js循环点击元素的子节点

Question

js 循环遍历点击元素的子节点我有错误：未捕获的类型错误：无法读取未定义的属性 'contains'

我需要比较其中一个是否具有 class 任务价值我不明白为什么我有错误！！！需要帮助对不起英语不好 Link 到 js fiddle 代码

function docClick(e) {
    var target = e.target;
    console.log(this.childNodes.length)

    for(var i = 0; i < this.childNodes.length; i++){
        console.log(this.childNodes[i])

        if(this.childNodes[i].classList.contains("task-value")){
            console.log("if")
        }else{
            console.log("else")
        }
    }

Link UpDate whit full css/Html and Javascript

Answer 1

这成为可能，因为 this.childNodes 不仅包含 HTML 个元素，还包含 text 个节点。文本节点不能有类所以它们永远不会有属性 classList 您需要使用属性 children 才能准确获得 html elements

function docClick(e) {
    var target = e.target;
    console.log(this.children.length)

    for(var i = 0; i < this.children.length; i++){
        console.log(this.children[i])

        if(this.children[i].classList.contains("task-value")){
            console.log("if")
        }else{
            console.log("else")
        }
    }

js循环点击元素的子节点

js loop through clicked elements childnodes

javascript

loops

child-nodes