脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-html03,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。
<!DOCTYPE htML> <html lang="en"> <head> <meta charset="UTF-8"> <tITle></title> <script> window.onload = function(){ /*获取到第一个子节点*/ VAR oul= document.getElementById("ul"); /*FirstChild在IE下面获取到的第一个元素节点,DOM浏览器下面获取到的是第一个子节点*/ /*var node = oul.firstChild; alert(node.nodeName); console.info(node.nodeName);*/ /*处理兼容性问题*/ var node = oul.firstElementChild || oul.firstChild; console.info(node.nodeName); /*获取到最后一个子节点*/ var oli = oul.lastElementChild; oli.style.backgroundColor = "red"; /*获取到前一个兄弟节点*/ var node2 = oul.previousElementSibling; console.info(node2); /*获取到后一个兄弟节点*/ var node3 = oul.nextElementSibling; console.info(node3); /*获取到父节点*/ var oli1 = document.getElementById("li1"); var node4 = oli1.parentNode; console.info(node4); /*获取到定位父级*/ var op =document.getElementById("P3"); var node5 = op.offsetParent; console.info(node5); /*创建一个节点*/ var oli2 = document.createElement("li"); oli2.innerHTML ="韦德"; console.info(oli); /*nodeValue:只针对文本节点*/ console.info("newli"+oli2.firstChild.nodeValue); /*将创建好的节点放入dom树结构,默认添加在所有节点的最后*/ /* oul.appendChild(oli2);*/ oul.insertBefore(oli2,oli1); /*第一个参数是要加入的节点,第二个参数放的位置*/ } </script> </head> <body> <h1>天气好</h1> <ul id="ul"> <li id="li1">新闻</li> <li>体育</li> <li>更多</li> </ul> <p id="p1" style="position: relative"> <p id="p2"> <p id="p3"></p> </p> </p> </body> </html>
觉得可用,就经常来吧! 脚本宝典 欢迎评论哦! js脚本,巧夺天工,精雕玉琢。小宝典献丑了!
以上是脚本宝典为你收集整理的javascript代码实例教程-html03全部内容,希望文章能够帮你解决javascript代码实例教程-html03所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。