通过获取子节点的方式隔行变色

<button id="btn2">点击</button>
<ul id="uu">
    <li>这是第1个li标签</li>
    <li>这是第2个li标签</li>
    <li>这是第3个li标签</li>
    <li>这是第4个li标签</li>
    <li>这是第5个li标签</li>
    <li>这是第6个li标签</li>
    <li>这是第7个li标签</li>
    <li>这是第8个li标签</li>
</ul>
//需求 : 隔行变色
//条件 : 通过获取子节点的方式隔行变色
var father = $myId("uu");

$myId("btn2").onclick = function () {
    var nodes = father.childNodes;
    var count = 0; //记录li的个数
    for(var i = 0 ; i < nodes.length ; i++){
        //判断是不是li标签
        if(nodes[i].nodeType === 1 && nodes[i].nodeName === "LI"){
            nodes[i].style.backgroundColor = i % 4 === 1 ? "red" : "";
            count++;
            console.log(count);

        }

    }


}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要通过递归方式获取所有节点和子节点,您可以使用深度优先搜索(DFS)算法。以下是一个示例的Java代码: ```java import java.util.ArrayList; import java.util.List; class Node { private String name; private List<Node> children; public Node(String name) { this.name = name; this.children = new ArrayList<>(); } public void addChild(Node child) { children.add(child); } public List<Node> getChildren() { return children; } public String getName() { return name; } } public class RecursiveQuery { public static void main(String[] args) { // 创建节点 Node root = new Node("Root"); Node node1 = new Node("Node 1"); Node node2 = new Node("Node 2"); Node node3 = new Node("Node 3"); // 构建树结构 root.addChild(node1); root.addChild(node2); node1.addChild(node3); // 查询所有节点和子节点 List<Node> allNodes = new ArrayList<>(); getAllNodes(root, allNodes); for (Node node : allNodes) { System.out.println(node.getName()); } } public static void getAllNodes(Node node, List<Node> allNodes) { allNodes.add(node); List<Node> children = node.getChildren(); for (Node child : children) { getAllNodes(child, allNodes); } } } ``` 以上代码定义了一个`Node`类来表示树的节点,每个节点包含一个名称和子节点列表。`getAllNodes`方法使用递归的深度优先搜索算法来获取给定节点及其所有子节点,并将它们添加到一个列表。然后,可以通过调用`getAllNodes`方法来查询所有节点和子节点,并将结果打印出来。 这个示例,根节点为"Root",有两个子节点"Node 1"和"Node 2","Node 1"又有一个子节点"Node 3"。运行以上代码,将输出以下结果: ``` Root Node 1 Node 3 Node 2 ``` 这就是通过递归方式获取所有节点和子节点的实现。您可以根据您的实际需求进行适当的修改和扩展。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值