前端新人,第一篇博客,留给我调试的第一个ie兼容性问题getElementsByClassName,昨晚写到4点,中午起来调到现在,总算有个影子了
//用到的ie8支持的方法 var chils= s.childNodes; //得到s的全部子节点 var par=s.parentNode; //得到s的父节点 var ns=s.nextSibling; //获得s的下一个兄弟节点 var ps=s.previousSibling; //得到s的上一个兄弟节点 var fc=s.firstChild; //获得s的第一个子节点 var lc=s.lastChild; //获得s的最后一个子节点 .tagName //返回值为大写的字符串
var GetElementsByClassName = function(parentNodeName,className,TagName,level,bool){ //parentNodeName : 目标元素的有ID的父辈元素 //className : 目标元素的类名 //TagName : 目标元素的标签名 //level : 目标元素为parentNodeName的第几代子节点 //bool : 布尔值,如果目标元素为直接parentNodeName所有子节点为真,否则为假 var classArray = new Array(); var level1 = new Array(); var level2 = new Array(); var level3 = new Array(); if(document.getElementsByClassName){ //判断是否支持document.getElementsByClassName return document.getElementsByClassName(className); } else{ if(bool==true){ //判断bool值是否为真 parentNodeName = document.getElementById(parentNodeName); classArray[0] = parentNodeName.firstChild; i=0; while(classArray[i].nextSibling!=null||classArray[i].parentNode!=parentNodeName){ //不是最后一个节点或者父节点不为传入的父元素 classArray[i+1]=classArray[i].nextSibling; i++; } return classArray; } else{ var l=0; var m=0; var n=0; parentNodeName = document.getElementById(parentNodeName); level1 = parentNodeName.childNodes; //第一级为传入父元素的子节点 if(level==1){ for(var k=0;k<level1.length;k++){ if(level1[k].tagName==TagName){ //若节点为文本节点,则不存入 classArray[n]=level1[k]; n++; } } return classArray; } for(var i=0;i<level1.length;i++){ //第二级为传入父元素的第二代子节点 for(var j=0;j<level1[i].childNodes.length;j++){ if(level1[i].childNodes[j].tagName!=null){ level2[l] = level1[i].childNodes[j]; l++; } } } if(level==2){ for(var k=0;k<level2.length;k++){ if(level2[k].tagName==TagName){ classArray[n]=level2[k]; n++; } } return classArray; } for(var i=0;i<level2.length;i++){ //第三级为传入父元素的第三代子节点 for(var j=0;j<level2[i].childNodes.length;j++){ if(level2[i].childNodes[j].tagName!=null){ level3[m] = level2[i].childNodes[j]; m++; } } } if(level==3){ for(var k=0;k<level3.length;k++){ if(level3[k].tagName==TagName){ classArray[n]=level3[k]; n++; } } return classArray; } } } }
写bool是觉得这种情况比较简单而且出现比较频繁,可以减少运行的时间
调了一下午,classArray.length有时比实际的要大,最后发现是有的子节点为P标签或者A标签,里面有文字,文字会成为文本节点!这下记住了-||
来源:https://www.cnblogs.com/6mlbl/p/5428672.html