为什么这会崩溃浏览器标签？

Question

它不像我不能这样做,但我只是好奇:为什么这个代码崩溃浏览器选项卡？

var links = document.getElementsByTagName("a");
for (var i = 0; i < links.length; i++) {
    var a = document.createElement("A");
    a.innerHTML = "[?]";
    a.href = links[i].href; //this is the evil line
    a.onclick = function () {
        return false;
    };
    links[i].parentNode.appendChild(a);
}

Answer 1

因为NodeList(我认为他们把它称为HTMLCollection现在)你从后面getElementsByTagName是活的.因此,当您a向文档添加新内容时,浏览器会将其添加到您正在循环的列表中.由于每次循环时都添加另一个,因此永远不会到达循环的末尾.

如果您想要一个断开连接的数组或集合,您可以:

var collection = document.querySelectorAll("a");

要么

var array = Array.prototype.slice.call(document.getElementsByTagName("a"));

querySelectorAll支持全系列的CSS选择器.它受到所有现代浏览器和IE8的支持.但它可能比克隆getElementsByTagName NodeList(通常不重要)慢.