Я не могу заставить свойство className работать в Safari - PullRequest
0 голосов
/ 18 февраля 2012

Я пробовал эту функцию javascript перед добавлением a.className = "year";, и все работало правильно, но затем, добавив ее, я не смог заставить страницу загружаться ни с Safari, ни с Google Chrome. Что мне нужно сделать, это просто добавить класс к новому элементу 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);
        }
    }

}

1 Ответ

1 голос
/ 18 февраля 2012

но я получил ту же ошибку: страница не загружается ..

проблема в том, что ваш код работает в бесконечном цикле.Причина этого:

  1. С помощью вызова ниже вы извлекли все элементы с классом "year".Возвращаемая коллекция - это динамическая коллекция

    years = document.getElementsByClassName("year");
    
  2. . Итерируя по коллекции, вы создаете новые элементы привязки и устанавливаете для них «год».class.

  3. Когда вы добавляете их в документ, они будут автоматически добавлены в коллекцию, созданную на 1-м шаге, потому что это динамическая коллекция, потому что новые элементы соответствуют «теме» (здесь класс "year") коллекции.

, чтобы избежать бесконечных циклов, у вас есть много возможностей.

  1. кэшировать свойство length впеременная

    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.

...