JS DOM

https://developer.mozilla.org/ru/docs/Web/JavaScript

document.forms[0] // По номеру формы внутри документа
document.forms.f1 // По имени, как к свойству
document.forms["f1"] // По имени, как к элементу массива

<form name="shipping">...<input type="text" name="zipcode">...</form>  --> document.shipping.zipcode

qq.getElementById("g_1")

qq=document.getElementsByTagName(div)[2]

var text_of_el1=qq.firstChild.data;  qq.nextSibling

el.setAttribute("id_","45")

events

preventDefault();

Интерфейс                Константа nodeType                                           Значение nodeType
Element                       Node.ELEMENT_NODE                                                 1
Text                             Node.TEXT_NODE                                                         3
Document                    Node.DOCUMENT_NODE                                            9
Comment                    Node.COMMENT_NODE                                               8
DocumentFragment     Node.DOCUMENT_FRAGMENT_NODE                     11
Attr                             Node.ATTRIBUTE_NODE                                               2

document.myform.onsubmit = validateform;

childNodes -> firstChild, lastChild, nextSibling, previousSibling и parentNode;    appendChild(), removeChild(), replaceChild() и insertBefore()

var n = document.documentElement; // Это объект Node.
var children = n.childNodes; // Это объект NodeList.
var head = children.item(0); // Это один из способов использования NodeList.
var body = children[1]; // Но есть более простой способ!

getAttribute(), setAttribute() и removeAttribute()

document.body 

document.createElement('script')       document.createElement("link")          document.getElementsByTagName("head")[0].appendChild(fileref)

Интерфейс HTMLDocument определяет свойства id, style, title, lang, dir и className.

el_.innerHTML

var t = document.createTextNode("это новый текстовый узел");

if (n.nodeType == 1 /*Node.ELEMENT_NODE*/)

// Ищем тег <a name="top">    var link = document.getElementsByName("top")[0];
// Ищем все элементы <input type="radio" name="shippingMethod">   var choices = document.getElementsByName("shippingMethod");

var classes = element.className; // Получить список класов

Свойства элемента DOM

nodeType
Тип узла. Самые популярные типы: "1" – для элементов и "3" – для текстовых узлов. Только для чтения.
nodeName/tagName
Название тега заглавными буквами. nodeName имеет специальные значения для узлов-неэлементов. Только для чтения.
innerHTML
Внутреннее содержимое узла-элемента в виде HTML. Можно изменять.
outerHTML
Полный HTML узла-элемента. При записи в elem.outerHTML переменная elem сохраняет старый узел.
nodeValue/data
Содержимое текстового узла или комментария. Свойство nodeValue также определено и для других типов узлов. Можно изменять. На некоторых узлах, где data нет, nodeValue есть и имеет значение null, поэтому лучше использовать data.
textContent
Содержит только текст внутри элемента, за вычетом всех тегов. Можно использовать для защиты от вставки произвольного HTML кода
Свойство и атрибут hidden
Скрыть элемент можно с помощью установки свойства hidden в true или с помощью атрибута
Узлы DOM также имеют другие свойства, в зависимости от тега. Например, у INPUT есть свойства value и checked, а у A есть href и т.д.

Все свойства элемента можно вывести в консоль.

Метод console.dir выводит аргумент не в «красивом» виде, а как объект, который можно развернуть и исследовать.

Например:

// в консоли можно будет увидеть все свойства DOM-объекта document
console.dir(document);
var elements = Ext.select('div').item(1);
alert(elements.dom.innerHTML);

window.addEvent('domready', function() {
            var sysAlert = new Element('div').setProperties({
                'class': 'sysAlert'
            });
            sysAlert.innerHTML = '<?php echo $modx->db->escape($sysMsgs);?>';
            var boxHtml = new MooPrompt('<?php echo $_lang['sys_alert']; ?>', sysAlert, {
                buttons: 1,
                button1: 'Ok',
                width: 500
            });
});