AJAX基础（三）——DOM基础及DOM操纵HTML

<script type="text/javascript" >

            function testapi(){
                //获得根节点元素
                var htmlrootElement=document.documentElement;
                //获得指定的元素节点
                var divNode=document.getElementById("div1");
                //获得整个页面所有的div元素节点
                var divNodes=document.getElementsByTagName("div");
                //创建元素节点
                var newdivNode=document.createElement("div");
                //创建文本节点
                var newTextNode=document.createTextNode("aaaa");
            }
</script>

元素节点的属性和方法

//根据标签名获得元素节点元素节点的操作：

                var divNode2=document.getElementById("div2");
                var divNodes2=divNode2.getElementsByTagName("div");             
                //操作属性
                var inputtext=document.getElementById("inputtext");
                var flag=inputtext.hasAttribute("value");
                inputtext.setAttribute("value", "aaacede");
                var textValue=inputtext.getAttribute("value");
                flag=inputtext.hasAttribute("value"); 
                inputtext.removeAttribute("value");
                alert("完成");

另一种操作元素属性的方法：

         //另一种操作元素属性的方法 
inputtext.value="另一种操作元素属性的方法";

两种方法的差异（以onclick事件为例）：

         当我们操纵按钮单击事件时，第一种方式不显示结果，而第二种方式才显示

var clic=document.getElementById("clic"); 
//不显示结果，操纵无效
clic.setAttribute("onclick", function(){alert("不显示")});
//显示结果，操纵有效
 clic.onclick=function(){alert("显示")};

属性节点的属性和方法（因为很少用，所以这里就不举例了）：