難道有更好的方法來編碼嗎？（初學者）

-1

注：我試圖學習如何使用JavaScript而不是jQuery或其他庫。難道有更好的方法來編碼嗎？（初學者）

我是JavaScript新手，我想了解它是如何工作的，並想知道是否有更有效的編碼方式。

function myFunction() { 
 
    var domObject = document.createElement("li"), 
 
     userName = document.getElementById("userName").value, 
 
     userNameText = document.createTextNode(userName); 
 

 
    domObject.appendChild(userNameText); 
 
    document.getElementById("myList").appendChild(domObject); 
 
    document.getElementById("userName").value = ""; 
 
}

<body> 
 
    <input type="text" id="userName"> 
 
    <button onclick="myFunction()">Click</button> 
 
    <ul id="myList"> 
 
     <li>this is</li> 
 
     <li>just a</li> 
 
     <li>test to</li> 
 
     <li>append children</li> 
 
    </ul> 
 
    <script src="main.js"></script> 
 
</body>

來源

2017-08-06 CMYK

我投票，因爲這是工作代碼的同行評審的要求，關閉了這個問題作爲題外話。相反，它更適合[codereview.se]。 –

domObject肯定不是一個變量最好的名字（也不是myFunction）。總之，使用addEventListener而非內聯事件監聽器：

// you can, of course, use getElementById with an ID attribute 
 
var input = document.querySelector('input'); 
 
var button = document.querySelector('button'); 
 
var list = document.querySelector('ul'); 
 

 
button.addEventListener('click', function() { 
 
    var li = document.createElement('li'); 
 
    li.textContent = input.value; 
 
    input.value = ''; 
 
    list.appendChild(li); 
 
});

<input type="text"> 
 
<button>Add to list</button> 
 
<ul></ul>

來源

2017-08-06 10:45:43 PeterMader

難道有更好的方法來編碼嗎？ （初學者）

回答

相關問題

難道有更好的方法來編碼嗎？（初學者）