项目场景:
由于ie不兼容getElmentsByClassName获取元素,所以我自己封装该方法: ie支持ID与TagName获取元素
问题描述:
提示:这里描述项目中遇到的问题:
for in 遍历数组时split()报错
function getclassName(cls) {
let arr = []
let elments = document.getElementsByTagName("*");
console.log(elments)
for (let i in elments) {
let classarr = elments[i].className.split(" ")
for (let j in classarr) {
if (classarr[j] == cls) {
arr.push(elments[i])
break
}
}
}
return arr
}
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201204162248969.png)
原因分析:
split为string型方法,split报错可能for in 遍历出了不是string型的元素,引起报错
解决方案:
1.首先判断遍历出的类型,证实分析的正确性
for (let i in elments) {
console.log(typeof elments[i].className)
}
![在这里插入图片描述](https://img-blog.csdnimg.cn/2020120416303927.png)
2.有3个undefined,那这3个是什么呢?
![在这里插入图片描述](https://img-blog.csdnimg.cn/2020120416340091.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rhb19fZg==,size_16,color_FFFFFF,t_70)
for (let i in elments) {
console.log(typeof elments[i].className,elments[i])
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201204163823789.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rhb19fZg==,size_16,color_FFFFFF,t_70)
可以看到,最后3个对象中没有classNaem属性,所以undefined,而最后3个对象怎么出来的。
for (let i =0;i<elments.length;i++) {
console.log(typeof elments[i].className,elments[i])
}
return arr
}
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201204164102442.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rhb19fZg==,size_16,color_FFFFFF,t_70)
for (let i of elments) {
console.log(typeof i.className,i)
}
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201204164214217.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rhb19fZg==,size_16,color_FFFFFF,t_70)
这里我们可以看到,另外两种遍历方式没有出现for in 的情况
得出结果:
for in 遍历会将对象从构造函数继承过来的属性都会遍历出来,而for循环与for of 不会,以后要注意!!!!
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)