0

我在添加之前尝试了这个 javascript 函数a.className = "year";,一切正常,但是,添加它之后,我无法让页面加载既不使用 Safari 也不使用谷歌浏览器。我需要做的只是向新a元素添加一个类,我也尝试过,a.setAttribute("class", "year");但我得到了同样的错误:页面无法加载..如果有人知道如何帮助我,我将非常感激!

function create_timeline() {

    timeline = document.getElementById("timeline_ul");
    years = document.getElementsByClassName("year");
    for (i=0;i<years.length;i++) {
        if (years.item(i).nodeType==1) {
            year = years.item(i).innerHTML;
            a = document.createElement("a");
            a.innerHTML = year;
            a.className = "year";
            timeline.appendChild(a);
        }
    }

}
4

1 回答 1

1

但我得到了同样的错误:页面无法加载..

问题是,您的代码在无限循环中运行。原因是:

  1. 通过下面的调用,您已经获取了类“year”的所有元素。返回的集合是动态集合

    years = document.getElementsByClassName("year");
    
  2. 在遍历集合时,您正在创建新的锚元素,并将它们设置为“年份”类。

  3. 当您将它们附加到文档时,它们将自动添加到第一步创建的集合中,因为它是一个动态集合,因为新元素与集合的“主题”(这里是“年”类)相匹配。

为了避免无限循环,你有很多可能性。

  1. 将长度属性缓存在变量中

    var i=0, len = years.length;i<len;i++
    

但是使用这种方法,您无法确定新元素是添加到集合中还是以某种“逻辑”或“随机”顺序添加。

  1. 将集合转换为 JavaScript 数组

    years = document.getElementsByClassName("year");
    years = Array.prototype.slice.call(years, 0);
    
  2. 或使用 document.querySelectorAll,它返回元素的静态集合。

    years = document.querySelectorAll('.year');
    

我会选择方法#2或#3。

于 2012-02-18T17:11:08.707 回答