Поиск элементов в контексте
Всем привет.
Начну сразу с примера. Дано: 2 divа и в каждом еще 100 divов, то есть всего их 202, и в последнем еще 1 таблица. структура примерно такая
div
| ...
| div#100
| - table
div
| ...
| div#100
| - table
Найти: $('div div') - правильный результат должен быть 200, и $('div div table') - результат соответственно 2. Вообщем, интересует как правильно искать такие элементы. первое, что пришло в голову было чтото вроде:
var a = [];
var obj = document.getElementsByTagName('div');
for (var h = 0, l = obj.length; h < l; h++) {
var el = obj[h].getElementsByTagName('div');
for (var j =0, l1 = el.length; j < l1; j++)
a.push(el[j]);
}
почему это не работает, думаю понятно :) Потом был вариант с индексом добавленных элементов, работает, но жутко медленно.
var a = document.getElementsByTagName('div'), t, b=[];
var n = 0;
var tt;
while( t = a[n++] ) {
var g = t.getElementsByTagName('div');
var i = 0;
while( tt = g[i++] ){
if(!tt._)
b.push(tt);
tt._ = 1;
}
}
подскажите что-нибудь плз :) |
Метод getElementsByTagName ищет вообще все дочерние элементы, относительно родителя (или document), чтобы просматривать только на 1 уровень вложенности, используйте атрибут childNodes, но помните, что в эту коллекцию попадают и текстовые узлы (nodeType == 3), поэтому во время перебора нужно делать проверку if(…nodeType == 1) {…}
var i, list = document.body.childNodes, length = list.length;
for(i = 0; i < length; i++) if(list[i].nodeType == 1) {
…
}
Для поиска внешних DIV'ов в вашем примере, лучше задать им какой-нибудь класс и искать по нему, с помощью метода getElementsByClassName |
Не не катит. Речь идет о разработке собственного механизма цсс селекторов. childnodes можно использовать для для селектора ">" (div > span) например.
А в моем примере, дочерние дивы не обязательно "тру" дочерние, а например, div p div. |
Цитата:
|
1. Решил потренироваться, и написать очередной велосипед для выборки элементов по цсс селекторам
2. Да, слышал |
Цитата:
|
Не вижу связи :(
|
| Часовой пояс GMT +3, время: 06:17. |