1. childNodes und nodeType
childNodes ruft die untergeordneten Knoten ab, aber der Abstand zwischen einer Beschriftung und einer anderen Beschriftung wird als Textknoten berechnet. nodeType bestimmt, um welchen Knotentyp es sich bei einem Knoten handelt. Nur wenn nodeType==1 der Elementknoten, 2 der Attributknoten und 3 der Textknoten ist.
2. Kinder erhalten nur HTML-Knoten, nicht einmal Textknoten. Obwohl es sich nicht um ein Standard-DOM-Attribut handelt, wird es von fast allen Browsern unterstützt.
3. offsetParent erhält den positionierten übergeordneten Elementknoten des Knotens.
4. FirstChild() und firstElementChild() haben Kompatibilitätsprobleme. Verwenden Sie if, um Kompatibilitätsprobleme zu lösen. Der Rest von lastchild usw. ähnelt diesem.
5. Verwenden Sie dom, um Elementattribute abzurufen, verwenden Sie setAttribute('attribute to be set', 'set attribute value'), removeAttribute(name), getAttribute(name), die grundsätzlich nicht häufig verwendet werden. Es gibt aber auch Situationen, in denen es eingesetzt werden muss.
6. Verwenden Sie className, um Elemente auszuwählen, die eine einfache Methode kapseln können. Dies ist jetzt eine niedrige Version ohne Fehler, weist jedoch starke Einschränkungen auf.
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <p id="p1"> <ul> <li class="box"></li> <li></li> <li></li> <li class="box"></li> <li class="box"></li> <li></li> <li></li> <li class="box"></li> </ul> </p> </body> <script> function getByClass(oParent,sClass){ //*号代表通配符 var aResult=[]; var aEle = oParent.getElementsByTagName('*'); for(var i=0;i<aEle.length;i++){ if(aEle[i].className==sClass){ aResult.push(aEle[i]); } } return aResult; } var p1 = document.getElementById('p1'); var aBox = getByClass(p1,'box'); for(var i=0;i<aBox.length;i++){ aBox[i].style.backgroundColor='red'; } </script></html>
Knoten wie Foren erstellen 🎜> Stellen Sie sicher, dass Sie den erstellten Knoten zu seinem übergeordneten Element hinzufügen
creatElement(), um den Knoten zu erstellen.
appendChild(), um den erstellten Knoten zu seinem übergeordneten Element hinzuzufügen, bevor Sie
insertBefore()
removeChild einfügen () vor einem Knoten, um einen Knoten zu löschen
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>创建节点</title> <script> window.onload=function(){ var oUl = document.getElementById('oUl'); var oBtn = document.getElementById('btn'); var input1 = document.getElementById('input1'); var aLi = document.getElementsByTagName('li'); oBtn.onclick=function(){ var oLi = document.createElement('li'); oLi.innerHTML=input1.value; if(aLi.length>0){ oUl.insertBefore(oLi,aLi[0]); }else{ oUl.appendChild(oLi); } } } </script> </head> <body> <p> <input id="input1" type="text" /> <input id='btn' type="button" value="创建" /> <ul id='oUl'> </ul> </p> </body></html>
Einige Zusammenfassung der Verwendung von DOM
Ausführlich Anwendung von DOM in JavaScript
Zusammenfassung nativer JavaScript-Operationen auf Dom-Knoten
Das obige ist der detaillierte Inhalt vonTeilen von DOM-Wissenspunkten in js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!