Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > Найти все элементы документа по id

Автор: SDEVIL 30.7.2007, 19:24

Необходимо следующее:
Есть html документ сформированный php скриптом, в документе есть элементы с id sub_*, где *-любое число любых символов, имена всех необходимых элементов начинаются с sub_ как можно найти эти элементы и записать их в массив(полное id элементов для последующей работы с ними)

Автор: Mymik 30.7.2007, 20:14

если ты хотя бы знаешь тэги этих элементов то можно с помощью document.getElementsByTagName() и потом перебирать все эти элементы. В цикле брать element.id.indexOf("sub_") == 0 тогда записывать. А если нет, то пропускать.
Но если ты не знаешь даже тэгов в которых эти элементы будут встречаться... что ж... тогда вообще полностью перебор всех элементов и брать их child'ы... Единственный вариант это рекурсия. Но если html очень сложный... хм... тогда я б посоветовал тебе на стороне сервера еще формировать этот массив и не насиловать пользовательский комп такой ресурсозатратной дискурсией.

Автор: AKS 31.7.2007, 07:37

Цитата(SDEVIL @ 30.7.2007, 19:24

)

как можно найти эти элементы и записать их в массив(полное id элементов для последующей работы с ними)

Наверняка мог бы подойти вариант, наподобие такого:

Код


onload = function () {
    var html = document.body.innerHTML;
    var re = /(?:id=(?:\u0022|\u0027){0,1})(sub_[^\s\u0022\u0027\u003E]+)/gi;
    var ids = [];
    var match = re.exec(html);
    while (match) {
        ids.push(match[1]);
        match = re.exec(html);
    };
};

В массиве ids будут id, начанающиеся с sub_.

Автор: SDEVIL 31.7.2007, 22:21

Цитата(AKS @ 31.7.2007, 07:37)

Наверняка мог бы подойти вариант, наподобие такого:

А этот скрипт не очень будет грузить комп пользователя?

Автор: dXdYdZ 1.8.2007, 01:05

Быстрее будет всё же рекурсией:

//Массив с будущими элементами:
var ia=[];

parse=function(Fragment)
{
if(!Fragment.childNodes) return;
for(var n=Fragment.childNodes.length-1;n>-1;n--)
    {
    var id=Fragment[n].getAttribute("id");
        if(id) if(id.indexOf("sub_")==0) ia.push(Fragment[n]);
        parse(Fragment[n]);
    }
}

parse(document.body);

Я не тестировал этот скрипт, так что возможны ошибки.
Но в целом это будет работать довольно быстро(писал подобные вещи не один раз).

Автор: AKS 1.8.2007, 07:29

SDEVIL, по-поводу:

Код


..этот скрипт не очень будет грузить комп пользователя?

можно сказать, что это будет зависеть от размера страницы. Я взял для теста страничку, в которой document.body.innerHTML.length ~ 300000 символов. Так вот "пробежка" 5 раз (т.е. 5 вызовов функции и замер времени перед первой и после последней) заняла самое меньшее у Opera/FF ~ 0.5 сек, а у IE примерно 1 секунду. Т.е. триста тысяч символов умноженные на пять были просмотрены примерно за 0.5 - 1 секунду. Зависеть это, конечно же, должно еще и от компьютера пользователя, ну и еще от чего-нибудь - я уж не знаю...

Цитата(dXdYdZ @ 1.8.2007, 01:05

)

Быстрее будет всё же рекурсией

Неплохо было бы сравнить.

Цитата(dXdYdZ @ 1.8.2007, 01:05

)

Я не тестировал этот скрипт, так что возможны ошибки.

Да уж, без них не обошлось smile

Код


var id=Fragment[n].getAttribute("id"); // Fragment[n] - это что такое?

Цитата(dXdYdZ @ 1.8.2007, 01:05

)

...писал подобные вещи не один раз...

С подобными же ошибками? smile

Автор: Zeroglif 1.8.2007, 12:32

Как вариант, если не беспокоят погрешности, то можно собрать "все" элементы через:

Код


элемент.getElementsByTagName('*')

для IE ниже 6-ого - all. Могут быть, конечно, кроссбраузерные несостыковки, но решаемо.

Автор: dXdYdZ 1.8.2007, 17:54

Вот исправленный скрипт. Протестирован в IE 6.0.2900, Mozilla 1.7.12,
Opera 9.01, FireFox 2.0:

Код


//Массив с будущими элементами:
var ia=[];
 
parse=function(Fragment)
{
if(!Fragment.childNodes) return;
for(var n in Fragment.childNodes)
    {
    if(Fragment.childNodes[n].nodeType!==1) continue;
    var id=Fragment.childNodes[n].getAttribute("id");
        if(id) if(id.indexOf("sub_")==0) ia.push(Fragment.childNodes[n]);
        parse(Fragment.childNodes[n]);
    }
}

parse(document.body);

На счёт ошибок - когда пишу для себя, то многократно тестирую в Mozilla FireFox, Microsoft IE, Opera и Mozilla. А цель предыдущего ответа - не дать 100% рабочий код, а показать сам путь решения проблемы. Для меня задача состоит в том, чтобы человек понял принцип действия и мог потом написать любой похожий скрипт, а не в том, чтобы он его тупо скопировал, вставил и забыл. В данном случае ошибки даже полезны. Поєтому в предідущем варианте их даже не проверял. Думал, что и так понятно.

Автор: AKS 1.8.2007, 22:08

Цитата(dXdYdZ @ 1.8.2007, 17:54

)

...цель предыдущего ответа - не дать 100% рабочий код

Так вот Вы какой... smile

))))))))))))))))