如何使用DOM來修改它？

如何使用DOM修改li元素的樣式？如何使用DOM來修改它？

<div id="tabbed-boosts"> 
    <ul> 
     <li>test1</li> 
     <li>test2</li> 
     <li>test3</li> 
    </ul> 
    </div>

getElementById（'tabbed-boosts'）。childNodes會讓我到UL，我該如何修改LI？

還需要在IE6工作...

來源

2010-10-18 spyderman4g63

我會使用CSS： '＃tabbed-boosts li {....}' – 2010-10-18 18:13:11

對於DOM的東西，除非有一個很好的理由，否則我會用一個庫來解決扭曲問題，並使得事情變得更加方便。一些鏈接：[jQuery]（http://jquery.com），[關閉]（http://code.google.com/closure/library），[原型]（http://prototypejs.org），[YUI ]（http://developer.yahoo.com/yui/），[更多維基百科]（http://en.wikipedia.org/wiki/List_of_JavaScript_libraries）。例如，用jQuery，它會是'$（'＃tabbed-boosts> ul> li'）.css（/ * ... style stuff here * /）'。其他庫也會很容易。 – 2010-10-18 18:27:57

修改它*以什麼方式*？ @Sime：雖然我的首選技術，這不一定（並且當然不是*直接*）使用DOM ... – Shog9 2010-10-18 18:28:59

var lis = document.getElementById('tabbed-boosts').getElementsByTagName('li'); 
for (var i = 0; i < lis.length; i++) 
{ 
    lis[i].style.backgroundColor = '#' + Math.round(Math.random() * 0xFFFFFF).toString(16); 
}

來源

2010-10-18 18:13:06 poke

這將深入多層次，所以如果它是嵌套列表，它將通過處理'li'它會產生不利影響，它應該獨自離開。給定結構，只要'document.getElementById（'tabbed-boosts'）。firstChild.childNodes'就可以做到這一點，前提是沒有來自空白的文本節點。 – 2010-10-18 18:26:15

@ T.J。 Crowder：我相信按照需要提取解決方案總是可以的。我通常不想編輯一些lis，如果我不知道DOM結構是怎麼樣的，所以我可以放心地認爲選擇lis的方式已經足夠好了。畢竟這只是一個例子。 – poke 2010-10-18 18:37:26

我實際上撒謊了，它是我需要的一個A元素，但這最終導致了工作：document.getElementById（'tabbed-boosts'）。getElementsByTagName（'a'）[0] .className =「tab」 – spyderman4g63 2010-10-18 19:12:56

使用的document.getElementById（「標籤，提升」）問題.getElementsByTagName（「禮」）將顯示，如果你開始使用嵌套列表。使用childNodes屬性可以讓你訪問特定ul元素的直接子元素。例如

<ul id='tabbed-boosts'> 
    <li>...</li> 
    <li> 
     <ul> 
      <li> ... </li> 
     </ul> 
    </li> 
    <li>... </li> 
</ul>

使用getElementsByTag將返回標籤，提升內的所有「禮」元素子樹，其中的childNodes只會返回第一級「禮」的元素。在上面的例子中你會接收使用的getElementById，包括嵌套LI 4個元素的集合，而你只接收（如下所示）使用myUl.childNodes 3個li元素的集合

var myUl = document.getElementById('tabbed-boosts'); 

var myLi = myUl.childNodes; 

for(var i = 0; i<myLi.length; i++) 
{ 
    myLi[i].style....; 

    // do whatever you want to the li items; 
}

來源

2010-10-18 18:31:30

如何使用DOM來修改它？

回答

相關問題