标签：pre style back vrp yaf round div tlb 技术
标签 HTML
元素 css
节点 DOM
document.getElementById()
document.getElementsByTagName()
DOM：文档对象模型（Document Object Model）
区分文本节点和元素节点
fghshash <span>fhuewf</span>
nodeType节点类型 文本节点没有属性
nodetype==3 文本节点
nodetype==1元素节点
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script> window.onload=function(){ var oUl=document.getElementById(‘ul1‘); //ie 6-8 alert(oUl.childNodes.length); for(var i=0;i<oUl.childNodes.length;i++){ // oUl.childNodes[i].style.background=‘red‘; //alert(oUl.childNodes[i].nodeType); //nodetype==3 文本节点 //nodetype==1元素节点 if(oUl.childNodes[i].nodeType==1){ oUl.childNodes[i].style.background=‘red‘; }}} </script> </head> <body> <ul id="ul1"> <li></li> <li></li> </ul> </body> </html>
childNodes获取子节点 子节点只包含第一层节点
children获取子元素
根据父节点隐藏
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script> window.onload=function() { var aA=document.getElementsByTagName(‘a‘); for(var i=0;i<aA.length;i++){ aA[i].onclick=function(){ this.parentNode.style.display=‘none‘; } } } </script> </head> <body> <ul id="ul1"> <li>drdfgrd<a href="javascript:;">隐藏</a></li> <li>dr秃鹰grd<a href="javascript:;">隐藏</a></li> <li>drSDR fgrd<a href="javascript:;">隐藏</a></li> <li>drdf大概grd<a href="javascript:;">隐藏</a></li> </ul> </body> </html>
点击隐藏哪一行消失
标签：pre style back vrp yaf round div tlb 技术
原文地址：http://www.cnblogs.com/Yimi/p/6048106.html
