您的位置：首页 > Web前端 > JavaScript

每日一题_JavaScript.使getElementsByClassName兼容IE7/8和火狐?

2017-02-09 13:06 549 查看

具体需求:
1. 让getElementsByClassName兼容IE和火狐浏览器,通过类名获取元素集合?

实现思路:
1. 由于IE和火狐都支持getElementsByTagName,所以可以通过它遍历所有元素找出className中包含指定类名的元素存到数组返回即可.

具体代码:

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>兼容IE7/8+|FireFox getElementsByClassName</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet">
</head>
<body>
<div id="rMain0" class="rMain">
<div class="rMain"></div>
<div class="rMain"></div>
</div>
<script type="text/javascript">
function $_(id){
return document.getElementById(id);
};
if(!document.getElementsByClassName){
document.getElementsByClassName = function (className, element){
var results = [];
var element=element?element:document;
// 获取所有DOM元素
var echildren=element.getElementsByTagName('*');
for(var i=0;i<echildren.length;i++){
var curchild=echildren[i];
var classNames=curchild.className.split(' ');
// 如果当前元素包含className就压入results数组
for(var j=0;j<classNames.length;j++){
if(classNames[j]==className){
results.push(curchild);
break;
};
};
};
return results;
};
};
alert(document.getElementsByClassName('rMain', $_('rMain0')).length)
</script>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： Java Script 每日一题

相关文章推荐

新的分享

章节导航