JavaScript的：不能訪問鑑於這種標記一個節點列表

Question

的一次迭代的childNode：

<ul id="navtabs"> 
    <li><a onClick="someFunction();" href="#">Link</a></li> 
    <li><a onClick="someFunction();" href="#">Link</a></li> 
</ul> 

這個功能：

function someFunction(){ 
    navList=document.getElementById('navtabs').childNodes; 
    for(i=0;i<navList.length;i++){ 
    navList[i].childNodes[0].className='fgf'; 
    } 
} 

我expectaction是類每個錨的改變然而，該功能運行時，我得到：

Error: navList[i].childNodes[0] is undefined 

當我使用：

navList[i].className='fgf'; 

代替上述代碼，列表項的類名稱將按預期更改。

如何通過上述函數中的循環訪問childNode的childNode？

謝謝。

Answer 1

childNodes可能會給你文本節點以及DOM元素，這就是爲什麼你會得到這個錯誤。在你的循環，navList[i]有時是沒有孩子自己的，這當然是一個文本節點，爲什麼navList[i].childNodes[0]是undefined

而不是使用childNodes的，你可以做

navList=document.getElementById('navtabs').children; 

只得到孩子元素。但我會建議被設定更具體的getElementsByTagName

function someFunction() { 
    navList = document.getElementById('navtabs').getElementsByTagName("li"); 
    for(i = 0; i < navList.length; i++){ 
     navList[i].getElementsByTagName("a")[0].className='fgf'; 
    } 
} 

Answer 2

您正在尋找<a>元素

兒童入住

function someFunction(){ 
    var navList=document.getElementById('navtabs').getElementsByTagName('a'); 
    for(i=0;i<navList.length;i++){ 
    navList[i]className='fgf'; 
    } 
}