Document Object Model. Лекция 3

Свойства и методы для доступа к структуре документа:
document.documentElement
document.body
document.getElementById('идентификатор')
document.getElementsByTagName('имя')
document.getElementsByName('имя')
document.getElementsByClassName('класс')
Пример.
var elems

Свойства, позволяющие перемещаться по структуре документа:
childNodes
firstChild
lastChild
parentNode
nextSibling
previousSibling

Поле nodeType:
Node.ELEMENT_NODE
Node.TEXT_NODE
Node.DOCUMENT_NODE
Node.ATTRIBUTE_NODE
Node.COMMENT_NODE

function nextTag(obj)
{
do
obj = obj.nextSibling;
while (obj && obj.nodeType

Свойства:
tagName
className
id
innerHTML
style
Пример.
var elem =
document.getElementById(‘menu’);
elem.style[‘backgroundColor’] = ‘red’;
elem.style[‘borderLeftRadius’] = ‘10px’;

var color = elem.currentStyle[‘color’];
getComputedStyle(объект[,“:псевдокласс”]);
var color = getComputedStyle(elem)[‘color’]; // rgb(0,0,0) или #000000

Манипуляции с параметрами тегов:
obj.setAttribute(‘параметр’, ‘значение’)
obj.getAttribute(‘параметр’)
obj.hasAttribute(‘параметр’)
obj.removeAttribute(‘параметр’)

Манипуляции с узлами структуры документа:
document.createElement(‘тег’);
родитель.appendChild(объект);
родитель.insertBefore(объект, DOM-узел);
родитель.removeChild(объект);
родитель.replaceChild(старый объект, новый объект);
старый объект.replaceNode(новый объект);

Пример добавление ссылки в меню:
var newLink = document.createElement(‘a’);
newLink.innerHTML= “Перейти в Google”;
newLink.setAttribute(‘href’,

Объект window
Методы:
alert(значение);
confirm(вопрос);
if(confirm(‘Удалить?’))
{
location.href = ‘/news/delete’;
/// …
}

prompt(вопрос[, начальное значение]);
var x = prompt(‘Представьтесь!’);
if(x!= null)
{
alert(‘Привет’, + x);
}

Объект window
Методы:
moveTo(x,y)
moveBy(dx, dy)
resizeTo(x, y)
resizeBy(dx, dy)
print()
open(‘адрес’, ‘имя_окна’,
‘свойство1= значение1, свойство2= значение2, …’

Свойства:
width = ширина
height = высота
left = левая координата
right = правая координата
top