H5W3
当前位置:H5W3 > 问答 > 正文

Chrome59到底支不支持forEach函数?

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<form>
请选择你爱好:<br>
<input type="checkbox" name="hobby" id="hobby1">  音乐
<input type="checkbox" name="hobby" id="hobby2">  登山
<input type="checkbox" name="hobby" id="hobby3">  游泳
<input type="checkbox" name="hobby" id="hobby4">  阅读
<input type="checkbox" name="hobby" id="hobby5">  打球
<input type="checkbox" name="hobby" id="hobby6">  跑步 <br>
<input type="button" value = "全选" onclick = "checkall();">
</form>
<script type="text/javascript">
function checkall(){
var hobby = document.getElementsByTagName("input");
hobby.forEach(function(v){v.checked=true;}); //为什么chrome这句报函数forEach不存在?
[1,2,3].forEach(function(v){alert(v);}); //而这句就不报错呢?
}
</script>
</body>
</html>

回答

因为 document.getElementsByTagName 返回的不是数组,而是类数组

请自行搜索“JS 类数组转数组”。

因为 document.getElementsByTagName 返回的 HTMLCollection 实例并不是数组,而 Array.prototype.forEach 是数组的方法。
由于 HTMLCollection 的实例是类数组对象,可以借助 forEach 来进行类似的迭代:

[].forEach.bind(document.getElementsByTagName('input'))(console.log);
// 代码无误的话,被选对象会被逐一打印

未经允许不得转载:H5W3 » Chrome59到底支不支持forEach函数?

赞 (0)

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址