DOM - это, по сути, API, с помощью которого вы взаимодействуете с документом, и доступен на многих языках в виде библиотеки (JS является одним из этих языков).Браузер преобразует весь HTML-код вашей веб-страницы в дерево на основе вложенности.Откройте Firebug и посмотрите на структуру HTML.Это дерево, о котором я говорю.
Если вы хотите изменить любой HTML-код, вы можете взаимодействовать с DOM API для этого.
<html>
<head><script src="file.js"></script></head>
<body>blah</body>
</html>
В file.js
Iможет ссылаться на тело, используя:
onload = function() {
document.getElementsByTagName('body')[0].style.display='none';
}
getElementsByTagName
- это метод объекта document
.Я манипулирую элементом body
, который является элементом DOM.Если бы я хотел пройти и найти, скажем, диапазон, я мог бы сделать это:
onload = function() {
var els = document.getElementsByTagName('*');
for ( var i = els.length; i--; ) {
if ( els[i].nodeType == 1 && els[i].nodeName.toLowerCase() == 'span' ) {
alert( els[i] )
}
}
}
Я перебираю nodeList, возвращенный getElementsByTagName во фрагменте выше, и ищу диапазон, основанный на nodeName
свойство.