Beispielcode für das Document Object Model

A B 链接

Hallo Welt!

Willkommen bei DOM World!

var nodeStatus = function (node) { var temp = "" ; if (node.nodeName != null) { temp += "nodeName:" + node.nodeName + "n"; } else { temp "Knotenname :null!n"; // ,n }

if (node.nodeType != null) { temp += "nodeType:" + node.nodeType + "n"; } else { temp += "nodeType:null!n"; }

if (node.nodeValue != null) { temp += "nodeValue:" + node.nodeValue + "n"; } else { temp += "nodeValue:null!n"; }

return temp; }

var currentElement = document.getElementById('p1'); var msg = nodeStatus(currentElement); //alert(msg); var firstChild = currentElement.firstChild; msg += nodeStatus(firstChild);

//父亲的下一个儿子->弟弟 var youngBrother = firstChild.nextSibling; msg += nodeStatus(youngerBrother);

//2弟的儿子=p父亲的大孙子 var grandSon = youngBrother.firstChild; msg += nodeStatus(grandSon);

//孙子的父亲 var grandSonParent = grandSon.parentNode; msg += nodeStatus(grandSonParent);

//孙子的父亲的兄长 var grandSonParentElderBrother = grandSonParent. previousSibling msg = nodeStatus(grandSonParentElderBrother) ;

//大哥的父亲 var parent = grandSonParentElderBrother.parentNode; msg += nodeStatus(parent);

//父亲的小儿子 var lastChild = parent.lastChild; msg += nodeStatus(lastChild);

//父亲的所有儿子 var allChildInfo = ""; var allChild = parent.childNodes; für (var i = 0; ich allChildInfo += nodeStatus(allChild[i]); }

//alert(msg); Beans Käse Milch var oPurchases = document.getElementById( 'purchases'); var items = document.getElementsByTagName("li");

var info = typeof (oPurchases) + ' '; for (var i = 0 ; i info += typeof (items[i]) + " "; }

//document.write(info) ; A B C D var rdItems = document.getElementsByName("rdGroup"); var rdInfo = ""; for (var i = 0; ich rdInfo += nodeStatus(rdItems[i]) + 'n'; }

//alert(rdInfo);

id="pSample"> Dies ist das erste Beispiel!

var oSample = document.getElementById(' pSample'); var attr = ""; //取得所有属性内容 attr += "原标题是：" + oSample.getAttribute( „Titel“) + ‚n‘ ; attr += "样式是：" + "color=" + oSample.getAttribute("style").color + ",fontSize=" + oSample.getAttribute ("style").fontSize + 'n';

//alert(attr);

//改变属性内容,新增一个名字的属性 oSample.setAttribute( "title", "newTitle"); oSample.setAttribute("name", "pName");

attr += "新标题是：" + oSample.getAttribute("title ") + 'n' + "新名字是：" + oSample.getAttribute("name");

//alert(attr);

//删除属性 oSample.removeAttribute("name");

attr += "n现在的名字是：" + oSample.getAttribute("name");

//alert (attr);

var createElement = function () { var eleInfo = "";

//段落 var newParagraph = document.createElement ('p');

eleInfo += nodeStatus(newParagraph) + 'n';

//文本内容(儿子) var newTextNode = document.createTextNode( '我是段落里面的文字');

eleInfo += nodeStatus(newTextNode) + 'n';

newParagraph.appendChild(newTextNode);

//第一个儿子 eleInfo += nodeStatus(newParagraph.firstChild) + 'n';

document.body.appendChild(newParagraph);

//return eleInfo; }

//alert(createElement());

//Ein neues Element einfügen var doInsertBefore = function (o) { var myDiv = document.getElementById('myDiv'); //Das Div-Element abrufen var newInput = document.createElement ( 'input'); //Neues Eingabeelement ; //Ein neues Textfeld vor der Schaltfläche einfügen }

var doRemoveChild = function (o) {

var myDiv = o.parentNode; //übergeordnetes Element Holen Sie sich den übergeordneten Knoten des aktuellen Objekts var firstChild = myDiv.firstChild; //Der erste untergeordnete Knoten des übergeordneten Knotens }

"doRemoveChild(this)"/>

Beispielcode für das Document Object Model

In Verbindung stehende Artikel