获取属性节点

<div id="d1" align="center" class="abc">hello html dom</div>
<script>
var div = document.getElementById("d1");
var as = div.attributes;

for(i=0;i<as.length;i++){
    document.write(as[i].nodeName);
    document.write("<br>)
    document.write(as[i].nodeValue);
    document.write("<br>)
    document.write(as["id"].nodeValue);
}
</script>

获取内容节点

<div id="d1" align="center" class="abc">hello html dom</div>
<script>

<div id="d1" align="center" class="abc">hello html dom</div>
var div = document.getElementById("d1");
var content = div.childNodes[0];
document.write(content.nodeName);
document.write("<br>");
document.write(content.nodeValue);

</script>

获取节点名称与节点值

<div id="d1">hello HTML DOM</div>

<script>
function p(s){
    document.write(s);
    document.write("<br>");
}

var div = document.getElementById("d1);
p(div.nodeName);
p(div.attributes[0].nodeName);
p(div.attributes[0].nodeValue);
p(div.childNodes[0].nodeName);
p(div.childNodes[0].nodeValue);

</script>

元素的文本内容

<html>
<div id = "d">hello HTML DOM</div>
<script>

function changeDiv1(){
    document.getElementById("d).childNodes[0].nodeValue = "通过childNodes[0].value改变内容";
}

function changeDiv2(){
    document.getElementById("d).innerHTML = "通过innerHTML改变内容";
}

</script>

<button onclick="changeDiv1()">通过内容节点改变div内容</button>
<button onclick="changeDiv2()">通过innerHTML改变div内容</button>
</html>

创建节点

  1. createElement
  2. createTextNode
  3. createAttribute ```
Hello HTML DOM

```