Heim > Web-Frontend > js-Tutorial > So bedienen Sie DOM-Elemente in js

So bedienen Sie DOM-Elemente in js

小云云
Freigeben: 2018-03-26 16:09:38
Original
2062 Leute haben es durchsucht

DOM-Knoten entsprechen im Allgemeinen einem Tag, einer Textversion oder einem HTML-Attribut. DOM-Knoten verfügen über ein nodeType-Attribut, das zur Darstellung des Aufzählungstyps des aktuellen Elements {1:Element,2:Attribute,3:Text} verwendet wird. Dieser Artikel teilt Ihnen hauptsächlich die Betriebsmethoden von DOM-Elementen in js mit und hofft, allen zu helfen.

1. DOM-Knoten erstellen

var node1 = document.createElement('p');
var node2 = document.createTextNode('Hello World');
Nach dem Login kopieren

2. Vater-, Sohn- und Bruderknoten

var ele1 = document.querySelector('{.className/#id/tagName}');
var eleList = document.querySelectorAll('.className,#id,p');
Nach dem Login kopieren
var ele2 = document.getElementById('{id}')
var ele3 = document.getElementByClassName('{className}');
var ele4 = document.getElementByTagName('{tagName}');
Nach dem Login kopieren
4. Attribute

var parent =  ele.parentElement;    //父元素
parent = ele.parentNode;            //只读父元素
var children = ele.children;
var firstChild = ele.firstElementChild;
firstChild = ele.firstChild;
var lastChild = ele.lastElementChild;
lastChild = ele.lastChild;
var nextSibling = ele.nextSibling;
var prevSiblint = ele.previousSibling;
Nach dem Login kopieren
5. DOM-Änderung

var attrs = ele.attributes;    //获取所有属性 key-value
var classes = ele.getAttribute('class');        //获取单一属性值
ele.setAttribute('class','className');            //设置属性

ele.hasAttribute('attrName');        //判断属性是否存在
ele.removeAttribute('attrName');     //移除属性
ele.hasAttributes();                //是否有属性设置
Nach dem Login kopieren
Verwandte Empfehlungen:

ele.appendChild('elc');
ele.removeChild('elc');

ele.replaceChild('elc1','elc2');        
ele.insertBefore('elc','refElc');        //插入到子节点refElc节点之前
ele.cloneNode(true);        //该参数表示被复制的节点是否包括所有属性和子节点
Nach dem Login kopieren
js DOM-Element-ID ist die globale Variable _DOM

Das obige ist der detaillierte Inhalt vonSo bedienen Sie DOM-Elemente in js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage