пересечение div того же класса

Question

У меня есть 5 div того же класса, но разные идентификаторы сложены друг на друга. как мне пройти через javascript? они называются div1, div2, div3 и т. д.

также, как мне изменить атрибут div во время прохождения?

большое спасибо.

там.

Answer 1

Прежде всего прочтите эту статью

getElementsByClassName Speed Comparison

и

Enhanced getElementsByClassName

var elements = document.getElementsByTagName("div"); 

for (var i = 0; len = elements.length; i < len; i ++) 
{ 
    if (elements[i].className === "yourclassname") 
    { 
     // change the desired attribute of element. 
     //Eg elements[i].style.display = "none"; 
    } 
} 

Использование JQuery each функция

$(".yourclassname").each (function() { 
    // $(this) will fetch the current element 
}); 

Answer 2

for(var i = 1; i++; i<=5){ 
    var div = document.getElementById("div" + i); 
    //do stuff with div 
} 

Edit: Я вижу, вы называете это «под названием» div1 ... div5, вы должны дать идентификатор = «Div1» также для того, чтобы работать

Answer 3

В современных браузерах вы можете получить их, используя getElementsByClassName функция:

var elements = document.getElementsByClassName('myClass'); 

for (var i = 0, n = elements.length; i < n; i++) { 
    //.. 
} 

Обратите внимание, что я получаю elements.length только один раз, что является обычной практикой при переборе HTMLCollections.

Это потому, что эти коллекции «живут», они могут меняться в любое время, и доступ к свойству длины на каждой итерации дорого.

Для полной реализации кросс-браузера, проверьте эту статью г-на Resig:

• getElementsByClassName Speed Comparison

Edit: Я оставляю вас здесь переработана версию Dustin Diaz getElementsByClassName кросс-браузер чистый DOM Реализация:

function getElementsByClassName(node,classname) { 
    if (node.getElementsByClassName) { // use native implementation if available 
    return node.getElementsByClassName(classname); 
    } else { 
    return (function getElementsByClass(searchClass,node) { 
     if (node == null) 
      node = document; 
     var classElements = [], 
      els = node.getElementsByTagName("*"), 
      elsLen = els.length, 
      pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)"), i, j; 

     for (i = 0, j = 0; i < elsLen; i++) { 
      if (pattern.test(els[i].className)) { 
       classElements[j] = els[i]; 
       j++; 
      } 
     } 
     return classElements; 
    })(classname, node); 
    } 
} 

Answer 4

Ar e вы используете что-то вроде Prototype или jQuery? Если это так, я очень рекомендую один из них, так как они упрощают обход. Например, с помощью прототипа было бы:

ответов

$$('.className').each(function(s) { 
    //what you want to do 
}); 

Answer 5

Библиотеки на основе очевидны, но если вы ограничены из них, here are a couple methods, которые более совместимы, чем при использовании браузера Firefox (новый и славный!) document.getElementsByClassName использования.

Answer 6

Вот решение JQuery:

Установить атрибуты всех дивы:

$(".yourclassname").attr("attribute","value"); 

Набор текста содержание всех дивы:

$(".yourclassname").text("New content"); 

Set HTML содержание всех дивы:

$(".yourclassname").html("<h1>New content</h1><p>blah blah blah</p>"); 

Библиотека jQuery находится по адресу http://jquery.com/.

Answer 7

Его немного работы, чтобы взломать через, но вот статья о том, как включить queryselectorAll даже в старых браузерах:

http://ajaxian.com/archives/creating-a-queryselector-for-ie-that-runs-at-native-speed

Для этого в Mootools или Prototype:

$$('.className').each(function(element, index) { 
    //what you want to do 
}); 

В Jquery это то же без двойного доллара (как писала другими):

$('.className').each(function() { 
    //what you want to do 
});