javascript - Element.querySelector 未定义

Question

为什么此代码会在控制台中引发错误读取 TypeError: pizzaBox.querySelector is not a function。 (在 'pizzaBox.querySelector('h6')' 中，'pizzaBox.querySelector' 未定义)?

function addToppingsToAll (toppings)
{
    var pizzaBoxHolder = document.getElementById("PizzaBoxHolder");
    var PizzaBoxList   = pizzaBoxHolder.childNodes;
    for ( var i = 0 ; i < pizzaBoxList.length ; i++ )
    {
        var pizzaBox            = pizzaBoxList[i];
        toppingList             = pizzaBox.querySelector('h6');
        toppingList.textContent = "You have " + toppings " on your pizza";
    }
}

Answer 1

您的代码中至少存在三个问题:

1. 您可能正在遍历一些没有.querySelector() 方法的文本节点。
2. 您没有初始化您的 for 循环迭代变量 i
3. 您尝试使用一个未声明的变量 lineBoxList。

您可以通过仅使用 .querySelectorAll() 并让选择器为您完成更多工作来简化事情。

function addToppingsToAll (toppings) {
    var toppingItems = document.querySelectorAll("#PizzaBoxHolder h6");
    for (var i = 0; i < toppingItems.length; i++) {
        toppingItems[i].textContent = "You have " + toppings " on your pizza";
    }
}