Javascript 我如何使用DOM来修改它？

如何使用DOM修改li元素的样式

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

测试1
测试2
测试3

getElementById（'tabbed-boosts'）。childNodes将让我访问UL，如何修改LI

还需要在IE6中工作…

var lis=document.getElementById（'tabbed boosts'）.getElementsByTagName（'li'）；
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 );
}

对于（变量i=0；i

如果开始使用嵌套列表，则会出现使用document.getElementById（'tabbed boosts'）.getElementsByTagName（'li'）的问题。使用childNodes属性将允许您访问该特定ul元素的直接子元素。比如说

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

使用getElementsByTag将返回tabbed boosts子树中的所有'li'元素，其中childNodes将只返回第一级'li'元素。在上面的示例中，您将使用getElementById接收4个元素的集合，包括嵌套的LI，而使用myUl.childNodes仅接收3个LI元素的集合（如下所示）

var myUl=document.getElementById（'tabbed-boosts'）；
var myLi=myUl.childNodes；
对于（var i=0；iI）将使用CSS:
#tabbed boosts li{…}
对于DOM内容，除非有充分的理由不这样做，否则我将使用一个库来解决这些问题并使事情更加方便。一些链接：，。例如，对于jQuery，它将是
$（'#tabbed boosts>ul>li'）。CSS（/*…style stuff here*/）
。其他lib也会很简单。用什么方式修改它？@Sime:虽然我喜欢的技术，但不一定（当然也不是直接）使用DOM…@Shog9:因此他没有用它回答问题。：-）修改类名会深入到多个层次，所以如果是嵌套列表，它将通过处理它应该离开的
li
s产生不利影响。给定结构，只要
document.getElementById（'tabbed-boosts'）.firstChild.childNodes
就可以了，只要不存在来自空白的文本节点。@T.J.Crowder:我相信按照需要的方式抽象解决方案总是可以的。如果我还不知道DOM结构的样子，我通常不想编辑一些lis，因此我可以放心地假设选择lis的方法已经足够好了。毕竟，这只是一个例子。我实际上撒谎了，这是我需要的一个元素，但最终成功了：document.getElementById（'tabbed-boosts'）。getElementsByTagName（'A'）[0]。className=“tab”
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;
}