时间戳

首页 > 解决方案 > 如何单独选择 <li> 然后使用模数选择奇数

javascript - 如何单独选择 <li> 然后使用模数选择奇数

问题描述

好吧，所以我从老师那里得到了一个作业，首先选择每个单独的 <li>，然后使用模数只选择奇数并更改它们的颜色。我不得不说我完全被难住了。

我尝试使用子节点进行选择：varlistaOne = document.getElementById ("lista1").childNodes[0];

HTML

<ul id="lista1">
                <li>List item 1</li>
                <li>List item 2</li>
                <li>List item 3</li>
                <li>List item 4</li>
                <li>List item 5</li>
            </ul>

JS

    listaOne = document.getElementById ("lista1").childNodes[0];
listaTwo = document.getElementById ("lista1").childNodes[1];
listaThree = document.getElementById ("lista1").childNodes[2];
listaFour = document.getElementById ("lista1").childNodes[3];
listaFive = document.getElementById ("lista1").childNodes[4];

我希望能够单独选择一个 <li>

标签： javascriptdommodulus

解决方案

根据您的操作方式，如果您选择每个元素，forEach 循环会打包必要的代码。

var nodeList = document.getElementById('parent').childNodes;

nodeList.forEach((node, index) => {
    if (index % 2 === 0) {
        // code for evens here
    } else {
        // code for odds here
    }
});

https://developer.mozilla.org/en-US/docs/Web/API/NodeList

推荐阅读