2016-04-10 3 views
-2

Я пытаюсь пройти DOM страницы с помощью javascript и сделать простое предупреждение для каждого тега, чтобы отобразить атрибут tagName. Кажется, он не работает.Прогулка по DOM (javascript)

Это код и HTML в jsfiddle (и beow) https://jsfiddle.net/fluffymuffins/fw208ozk/

Я не вижу каких-либо предупреждений. Что не так?

HTML

<body> 
test text 
<p> 
some paragraph 
</p> 
<img src="http://example.com/image.jpg"> 
</body> 

JS

var results = []; 

walkDOM(document.body, function(node) { 
    alert(node.tagName); 
}); 

var walkDOM = function (node,func) { 
     func(node);      //What does this do? 
     node = node.firstChild; 
     while(node) { 
      walkDOM(node,func); 
      node = node.nextSibling; 
     } 

    }; 
+0

Существует отличный инструмент, который может вам помочь - [posthtml] (https://github.com/posthtml/posthtml). Это похоже на PostCSS, но для HTML. Он имеет почти тот же API, поэтому нет ничего сложного в том, чтобы вы создали простой плагин, который будет делать именно то, что вам нужно. – denysdovhan

+0

Почему люди сбрасывают это без объяснения причин. – Daisetsu

ответ

2

Итак, вы вызываете метод, который не существует до сих пор:

Легко назвать после объявления метода:

var results = []; 

//declaration before 
var walkDOM = function (node,func) { 
     func(node);      //What does this do? 
     node = node.firstChild; 
     while(node) { 
      walkDOM(node,func); 
      node = node.nextSibling; 
     } 
};  

//invoke method after 
walkDOM(document.body, function(node) { 
    alert(node.tagName); 
}); 

Ваш обновлено Fiddle: https://jsfiddle.net/diegopolido/fw208ozk/3/

func(node); линия означает, что вы вызываете функцию от аргументов, может быть, этот пример прояснит ум:

var walkDOM = function (node,func) { 
     func(node); //this will invoke the functionToInvoke from arg 
     node = node.firstChild; 
     while(node) { 
      walkDOM(node,func); 
      node = node.nextSibling; 
     } 
};  

var functionToInvoke = function(node) { 
    alert(node.tagName); 
}; 

walkDOM(document.body, functionToInvoke); 

Вашей обновленной скрипку, что: https://jsfiddle.net/diegopolido/fw208ozk/5/

+0

Спасибо, я не писал JS годами. Я забыл, что порядок определения имеет значение. – Daisetsu

+0

@Daisetsu. Ваше выражение было функцией, например 'var funcName = function() {}', и из-за правил подъема JS они должны быть объявлены до их вызова, но если вы сделали это как function funcName() {} ', тогда это было бы определением функции, и вы могли бы разместить его в любом месте и позвонить из любого места (при условии, что вы выходите в пределах доступной области) – Redu

Смежные вопросы