<!DOCTYPE?html>
<html>
<head>
????<meta?charset="utf-8">
????<title>js</title>
????<script>
????????window.onload?=?function(){
????????????var?oBtn?=?document.getElementById("btn");
????????????var?oUl?=?document.getElementById("ul1");
????????????var?aLi?=?oUl.getElementsByTagName('li');
????????????console.log(aLi.length+";1");
????????????function?mHover?()?{
????????????????//鼠標移入變紅，移出變白
????????????????console.log(aLi.length+";2");//疑問在這里，在執行完添加節點的事件以后，
??????????????????????????????????????????????//為什么aLi.length會增加?這里沒有重新運行獲取全部li的代碼啊。
????????????????for(var?i=0;?i<aLi.length;i++){
????????????????????aLi[i].onmouseover?=?function(){
????????????????????????this.style.background?=?'red';
????????????????????};
????????????????????aLi[i].onmouseout?=?function(){
????????????????????????this.style.background?=?'#fff';
????????????????????}
????????????????}
????????????}
????????????mHover?();
????????????//添加新節點
????????????oBtn.onclick?=?function(){
????????????????var?oLi?=?document.createElement('li');
????????????????oLi.innerHTML?=?111;
????????????????oUl.appendChild(oLi);
????????????????mHover?();
????????????};
????????}
????</script>
</head>
<body>
<input?type="button"?name=""?id="btn"?value="添加"?/>
<ul?id="ul1">
????<li>111</li>
????<li>222</li>
????<li>333</li>
????<li>444</li>
</ul>
</body>
</html>這是一個動態添加li節點的功能，點擊按鈕添加li，同時具有鼠標移入和移出改變li顏色功能；但是點擊增加按鈕，執行新增li節點以后，重新執行了mHover ()函數，此時這個函數中循環體的aLi.length為什么會增加？怎么實現增加的？因為我并沒有在這個循環體中重新獲取li節點（oUl.getElementsByTagName('li')沒有執行）。請解答
對于js代碼節點數量增加的獲取
weibo_和諧_漢子_0
2017-07-13 16:10:08
