我想知道如何改变特定灯光的风格.在一个特定的<ul>通过javascript

I Want to know how to change the style of an partcular <li> in a particular <ul> by javascript

本文关键字：想知道 一个 javascript 通过 ul 何改变 风格 改变      更新时间：2023-09-26

我想知道如何通过JavaScript改变特定<ul>中特定<li>的样式

我的代码是这样的

<ul id="menu">
  <li id="number1"><a href="#1">1</a></li>
  <li id="number2"><a href="#2">2</a></li>
</ul>

现在假设我想用JavaScript改变ul#menu的li#number1的背景颜色

这是你在纯JavaScript中的解决方案:

var el = document.querySelector('#number1');
el.addEventListener('click', function(e) {
    el.style.backgroundColor = 'blue';
});

这是一个使用javascript和button的解决方案。

<script>
function doSth(){
    var nodes = document.getElementById("menu").getElementsByTagName("li");
    for(var i=0; i<nodes.length; i++) {
        if (nodes[i].id == 'number2') {
             nodes[i].style.background = "blue";
         }
    }
}
</script>
<ul id="menu">
<li id="number1"><a href="#1">1</a></li>
<li id="number2"><a href="#2">2</a></li></ul>
<input type="button" onClick="doSth();" value="Click here"/>
相关文章：