Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   обход дерева DOM (https://javascript.ru/forum/events/29754-obkhod-dereva-dom.html)

Nickolas 10.07.2012 01:06

обход дерева DOM
 
Друзья, нужна рекурсивная функция обхода DOM дерева, можно с использованием jquery. желательно с комментариями, чтобы можно было разобраться. заранее спасибо.

devote 10.07.2012 01:13

что значит рекурсивная? для каких целей? что бы обойти все элементы в DOM дереве, достаточно просто сделать:
var elems = document.getElementsByTagName('*');
for( var elem, i = 0; elem = elems[ i++ ]; ) {
    // some code
}

Aetae 10.07.2012 01:47

Мало ли зачем? Например нужны текстовые ноды.
Простейший вариант:
(function rec(el){
  var childs = el.childNodes, i = childs.length;
  while(i--) if( el.nodeType === 1 ) rec( childs[i] );
}(document.body))

Dim@ 10.07.2012 10:00

Aetae,
непонятно зачем нужна рекурсия?
if (document.createNodeIterator && document.createTreeWalker){ //Traversal API
 texts = document.createNodeIterator( //создание NodeItertor
  document,//обход всего документа
  NodeFilter.SHOW_TEXT,//узлы текст
  null,//нету функции фильтра
  false//в HTML не используется
 );
 var text;
 while((text = texts.nextNode()) != null){
  //действия с узлами text
 }
}

Gvozd 10.07.2012 11:47

Цитата:

Сообщение от Dim@
непонятно зачем нужна рекурсия?

В IE8 ваш пример не работает

Aetae 10.07.2012 11:51

IE9+

Dim@ 10.07.2012 13:29

Gvozd,
ясно я просто на линуксе в FF сижу и тестить в браузерах не могу :)

cyber 10.07.2012 19:00

а как насчет замыканий типа
var next = document.body.firstChild;
function closers(){
 
next = next.nextSibling;
if(next !== null)setTimeout(closers);
}

писал в браузере если не будет работать скажите

Dim@ 10.07.2012 21:14

cyber,
работать то работает, только нельзя так проходит документ (он не делается плоским, а NodeInterator делает + структура HTML документов почти всегда имеет древоидное строение)

cyber 10.07.2012 21:52

ну это было показано для примера (не совсем удачный пример), вот полная рекурсия
<!DOCTYPE HTML>
<html>
  <head> </head>
  <body>
    <div id ='1'>
      <div id = '2'>
      
        <div id = '3'></div>
      </div>
    </div>
    
    <div id = 'result'></div>
    <script>

var elemS = document.getElementsByTagName('*');
var res = document.getElementById('result');
var i = 0,stop = elemS.length;
(function closers(){
 

result.innerHTML +=', '+ elemS[i].tagName; 
i++;
if(i < stop)setTimeout(closers,0);
}());

    </script>

  </body>
</html>

кстати делать полный перебор ДОМ дерева это плохо=)

Dim@ 10.07.2012 21:56

Цитата:


кстати делать полный перебор ДОМ дерева это плохо

кто бы спорил

cyber 10.07.2012 22:11

кстати, а зачем вам полностью ДОМ перебирать(может есть вариант по проще)?

devote 10.07.2012 22:12

Цитата:

Сообщение от cyber
кстати делать полный перебор ДОМ дерева это плохо=)

Так можно сказать и о: "писать скрипты плохо". (это ведь нагружает ЦП юзера)

Делать можно что угодно, если это оправдывает ожидания и/или иных путей нет. А если программисту все запрещать, то и программировать нельзя будет.

cyber 10.07.2012 22:15

Цитата:

Сообщение от devote (Сообщение 187880)
Так можно сказать и о: "писать скрипты плохо". (это ведь нагружает ЦП юзера)

Делать можно что угодно, если это оправдывает ожидания и/или иных путей нет. А если программисту все запрещать, то и программировать нельзя будет.

скажу по другом :
перебирать полностью ДОМ стоит ,только если нет другого выхода...

devote 10.07.2012 22:18

Цитата:

Сообщение от cyber
перебирать полностью ДОМ стоит ,только если нет другого выхода...

любой код нужно писать с умом.

dmitriymar 10.07.2012 22:52

а может стоит подобных посылать?
например к Фленегану:)

Dim@ 11.07.2012 07:31

dmitriymar,
да, да :yes: :yes:
Цитата:

ну ребят помогите не знаю я :cray: :haha:


Часовой пояс GMT +3, время: 13:49.