纯JavaScript-for循环可用于元素[0]，但不能用于元素[i]

我的简化代码应该为导航中的每个b元素添加一个EventListener，如下所示：

函数openSubNavs2（） { var allToggleBs=document.querySelector（'ul#nav'）.getElementsByTagName（'b'）； 对于（var i=0；i用而不是

var

声明变量，这将创建单个范围

for (let i=0; i<allToggleBs.length; i++)

---

for（设i=0；i如果需要es3支持，也可以使用匿名函数：

function openSubNavs2()
{
    var allToggleBs = document.querySelector('ul#nav').getElementsByTagName('b');
    for (var i=0; i<allToggleBs.length; i++)
    {
        (function(toggleB) {
            toggleB.addEventListener('click', function() {
                toggleB.className = 'show';
            });
        })(allToggleBs[i]);
    }
}

函数openSubNavs2（）
{
var allToggleBs=document.querySelector（'ul#nav'）.getElementsByTagName（'b'）；
对于（var i=0；i使用
let
而不是
var
声明变量。您可以使用

for (let i=0; i<allToggleBs.length; i++)

for（设i=0；i我认为您正在失去
i
的上下文。您可以使用
let
而不是
var
声明i var。或者仍然使用ES5，将
i
包装在闭包中（因此，
i
不会更改其值）：

函数openSubNavs2（）
{
var allToggleBs=document.querySelector（'ul#nav'）.getElementsByTagName（'b'）；
对于（var i=0；i循环完成后，toggleB的可能重复项将不会保持不变。请使用
event.target
或
this
引用单击的标记，而不是VariableToggleB。您也可以只向nav添加一个单击事件，而不是每个标记单击一次，然后使用event.target使一个事件处理所有CA可能重复的While-let而不是var（参见其他帖子）很有用，但它并没有解决问题。您的解决方案解决了问题，我只是选择了另一个，因为它支持一些较旧的浏览器（在其他情况下也是如此）。虽然let而不是var（参见其他帖子）很有用，但它并没有解决问题。您的解决方案解决了问题。
function openSubNavs2()
{
    var allToggleBs = document.querySelector('ul#nav').getElementsByTagName('b');
    for (var i=0; i<allToggleBs.length; i++)
    {
        (function(i) {
            var toggleB = allToggleBs[i];
            toggleB.addEventListener('click', function()
            {
                toggleB.className = 'show';
            });
        })(i);

    }
}
window.addEventListener('load', function() {openSubNavs2();});