为什么我不能赶上 switch 方法中的“待办事项”? ClassList 和 Style 显示 Undefined

所以,这些是 Javascript 代码。

    const todoFilter = document.querySelector('.filter-todo');
    todoFilter.addEventListener('change',filterTodo);

    function filterTodo(e) {

    const todos = todoList.childNodes;
    
    todos.forEach(function (todo) {
        switch (e.target.value) {
            case "all":
                todo.style.display = "flex";
                break;
            case "completed":
                if (todo.classList.contains("completed")) {    //here classList is undefined
                    todo.style.display = 'flex';               //here style is undefined
                } else {
                    todo.style.display = 'none';               //here style is undefined
                }
                break;
            case "uncompleted":
                if (todo.classList.contains('uncompleted')) { //here ClassList is undefined
                    todo.style.display = 'none';              //here style is undefined
                } else {
                    todo.style.display = 'flex';              //here style is undefined
                }
        }
    });
}

这里是 HTML:

 <form action="">
    <input type="text" class="todo-input">
    <button class="todo-button" type="submit"><i class="fa fa-plus-square" aria-hidden="true">
    </i></button>
    <div class="select">
        <select name="todos" class="filter-todo">
            <option value="all">All</option>
            <option value="completed">Completed</option>
            <option value="uncompleted">Uncompleted</option>
        </select>
    </div>
</form>
<div class="todo-container">
    <div class="todo-list">

    </div>
</div>
<script src="todo.js"></script>

这些错误显示在控制台中:

todo.style is undefined
todo.classList is undefined
yanchengcai 回答:为什么我不能赶上 switch 方法中的“待办事项”? ClassList 和 Style 显示 Undefined

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/23940.html

大家都在问