Как перебрать узлы HTML DOM, которые содержат один из предоставленных атрибутов? - PullRequest
Новая
       29

Как перебрать узлы HTML DOM, которые содержат один из предоставленных атрибутов?

2 голосов
/ 17 мая 2011

Я хочу получить первый соответствующий элемент, затем второй и т. Д. Для следующего селектора CSS: 

[att]

Указанные ниже селекторы не являются действительными селекторами CSS3, но это то, что я пытаюсь сделать: 

   [att][0]
   [att][1]
   ...
   [att][n]

Могу ли я объединить несколько селекторов и перебрать каждый соответствующий узел, как в примере выше? 

[att1],[att2]

Если это невозможно сделать с помощью собственных селекторов DOM или CSS3, тогда запрос XPath также является опцией.

Ответы [ 3 ]

4 голосов
/ 17 мая 2011

Если опция document.querySelectorAll() является опцией, это будет очень просто - просто передайте селектор, и браузер обработает все остальное: 

var elms = document.querySelectorAll('[att]');

for (var i = 0; i < elms.length; ++i) {
    alert(elms[i].tagName);
}

Он работает с любым селектором CSS, который вы передаете, при условии, что браузер его поддерживает (что в этом случае должен делать любой браузер, реализующий функцию). Таким образом, чтобы выбрать элементы, которые имеют либо att1, att2, либо оба, используйте это, как упомянуто в комментариях: 

var elms = document.querySelectorAll('[att1], [att2]');
1 голос
/ 17 мая 2011

Использование jQuery: 

$('[att]');

Также это работает: 

$('[att1],[att2]');

Первый даст вам список всех элементов с атрибутом att.Если вы не хотите использовать jQuery, ваш код будет работать на намного медленнее, поскольку логический способ сделать это: 

var elems = document.getElementsByTagName('*');
for(var i=0, l=elems.length; i<l; i++){
    if(elems[i].getAttribute('att')){
        // do stuff
    }
}

Причина в том, что jQueryна самом деле быстрее, потому что он будет использовать XPath-запросы или другие методы, когда это возможно, что значительно ускорит выполнение.Конечно, вы можете реализовать XPath в приведенном выше коде, если хотите.

0 голосов
/ 15 апреля 2014 
var els = document.querySelectorAll('[att]');

Array.prototype.forEach.call(els,function(element){
    console.log(element.tagName)
})
...