ajax入门学习篇2
|
1．Dom是文档对象模型。是一种属性结构的。在java中一切元素都是对象，html中一切元素的都是节点。 2.<a href=”aaa.html”>sds</a> A是元素节点，href是属性节点，sds是文本节点 3.getElementByid是查找元素节点 4.getElementsByName也是查找元素节点的。 5. getElementsByTagName() 方法返回元素的顺序是它们在文档中的顺序。 6.hasChildNodes查看是否存在子节点。 7.用nodename返回的是每种节点的名称。但是如果是文本节点在返回一个#text 8.取文本节点的方法就是先取元素节点，然后用子节点取。 9，取属性节点，先取元素节点，然后用getAttributeNode（“属性名”）取 10．Nodetype如果是元素节点返回1，属性节点是2，文本节点3 11.nodevalue如果是元素节点返回为空，属性节点返回属性的内容，文本节点也返回内容 12.setattribute（“属性名”，“属性名字”）对节点添加属性 13.createElement（）创建元素节点 14.createTextNode（）创建文本节点 例子说明 <script type="text/javascript" language="javascript"> var add = new Function('a','b','return a+b;');//这是函数定义的方法，构造方法定义 alert(add(4,4)); function add1(a,b) { return a + b };//函数直接定义 alert(add1(5,9)); function message() { alert(document.getElementById("a1").value);//可以得到value值 alert(document.getElementsByName("a2").length);//可以得到这个元素节点的个数 alert(document.getElementsByTagName("input").length);//这里或得这个标签的个数 alert(document.getElementById("a3").firstChild.nodeValue);//可以得到h1的文本节点 alert(document.getElementById("a3").childNodes[0].nodeValue); 和上面的一样。 } </script> </head> <body> <form action="#" method="get" name="from1"> <input type="text" id="a1" name="a2" value="aa"><input type="submit" value="提交" onclick="message()"> </form> <h1 id="a3">你好</h1> </body>
例题2.节点的替换。 <script type="text/javascript"> window.onload = function() {//加载窗口，执行 document.getElementById("bj").onclick = function() {//点击这个节点触发事件 var biElement = document.getElementById("bj");//获取北京节点 var cqElement = document.getElementById("cq");//获取重庆节点 var pElement = biElement.parentNode;//获得北京节点的父节点 pElement.replaceChild(cqElement,biElement);//用重庆节点把北京节点替换，但是下面的重庆节点会没有 } } </script> </head> <body> <input type="button" value="check"> <ul> <li id="bj">北京</li> <li>天津</li> <li>杭州</li> <li>大连</li> </ul> <ul> <li id='cq'>重庆</li> <li>南京</li> <li>云南</li> <li>连云港</li> </ul> </body>
3.对节点的添加 window.onload=function(){ var liElement= document.createElement("li");//创建一个元素节点 liElement.setAttribute("id","fish");//设置该节点的属性。 var liTextElement=document.createTextNode("鱼");//创建一个文本节点 var foodElement=document.getElementById("food");//获取一个已经存在的父节点 foodElement.appendChild(liElement);//将创建的元素节点挂到上面 liElement.appendChild(liTextElement);//将创建的文本挂到元素节点上 } </script> </head> <body> <ul id="food"> </ul> （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |