把html转换成节点类型,HTML节点类型

function showElement(){

var element=document.getElementById("h1");//h1是一个

<

h1

>

标签

alert('nodetype:'+element.nodeType);//nodeType=1

alert('nodeName:'+element.nodeName);

alert('nodeValue:'+element.nodeValue); //null

alert('element:'+element);

}

function showText(){

var element=document.getElementById("h1");

var text=element.childNodes[0];

alert('nodeType:'+text.nodeType);  //nodeType=3

alert('nodeValue:'+text.nodeValue);  //文本节点的nodeValue是其文本内容

text.nodeValue=text.nodeValue+"abc"; //文本内容添加修改删除等等。

alert('nodeName:'+text.nodeName);

alert(text.data);   //data同样是其内容,这个属性下同样可以增删改。

}

function showDocument(){

alert('nodeType:'+document.nodeType);  //9

alert('nodeName:'+document.nodeName);

alert(document);

}

function showAttr(){

var btnShowAttr=document.getElementById("btnShowAttr"); //演示按钮，有很多属性

var attrs=btnShowAttr.attributes;

for(var i=0;i

<

attrs

.length ;i++){

var attr

=attrs[i];

alert('nodeType:'+attr.nodeType); //attribute 的nodeType

=2

alert('attr:'+attr);

alert('attr.name:'+attr.name+'

='+attr.value);

}

}

function demo(){

var btnDemo1

=document.getElementById("btnDemo1");

btnDemo1.onclick

=showElement;

//按钮1取节点nodetype值

var btnDemo2

=document.getElementById("btnDemo2");

btnDemo2.onclick

=showText;

var btnDemo3

=document.getElementById("btnDemo3");

btnDemo3.onclick

=showDocument;

var btnShowAttr

=document.getElementById("btnShowAttr");

btnShowAttr.onclick

=showAttr;

}

window.onload

=demo;