标签:utf-8 操作 兼容 blog oct 浏览器 问题 兼容性问题 type
dom操作中的getElementByClassName()在ie6、7、8中具有兼容性问题,而在高级浏览器中就不存在这种问题。以下通过代码对getElementByClassName()的封装 。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
div{
width: 100px;
height: 100px;
background-color: pink;
margin: 10px;
}
</style>
<script>
window.onload = function(){
console.log(getClass("test").length);
}
function getClass(className){
//如果浏览器支持着,则直接返回
if(document.getElementsByClassName){
return document.getElementsByClassName(className);
}
//不支持的浏览器
var arr = [];
var dom = document.getElementsByTagName("*");
for(var i=0; i < dom.length; i++){
// if(dom[i].className == className){
// arr.push(dom[i]);
// }i
//改进后的class
var txt = dom[i].split(" ");//["dome","test"]
for(var j=0; j < txt.length; j++){
if(txt[j] == className){
arr.push(dom[i]);
}
}
}
return arr;
}
/*
原理,遍历所有的div。通过每个div的className来判断
*/
</script>
</head>
<body>
</body>
<div class="dome"></div>
<div></div>
<div class="test"></div>
<div></div>
<div class="dome test"></div>
<div></div>
<div></div>
<div></div>
<div class="dome"></div>
<div></div>
</html>
标签:utf-8 操作 兼容 blog oct 浏览器 问题 兼容性问题 type
原文地址:http://www.cnblogs.com/jiang-z/p/7471867.html