数组之forEach()循环操作
2020-03-16 本文已影响0人
小雪洁
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>forEach循环操作</title>
</head>
<body>
<ul>
<li>hxj</li>
<li>ydc</li>
</ul>
</body>
<script>
let families=[
{name:"haoxuejie",age:30},
{name:"yangdingchuan",age:28},
{name:"haoweixv",age:34}
];
//arr.forEach(function(item,index,arr){});
//item是当前元素,必须参数;index是当前元素索引，arr即数组
families.forEach(function(item){
//console.log(item);
});
families.forEach(function(item,index,arr){
//console.log(index);
//console.table(arr);
});
//使用forEach()对引用类型元素进行处理,可以改变原数组
families.forEach(function(item,index){
item.name=item.name.substr(3);
});
console.log(families);
//console.table(families);
//使用forEach()对基本类型元素处理，无法改变原数组
let a=[1,2,3,4,5];
let b =a.forEach(function(item,index){
item++;
});
console.log(a);// [1, 2, 3, 4, 5]
//使用forEach()可以直接操作dom节点，不用再通过点语法等将其转换成数组
let lis=document.querySelectorAll("li");
lis.forEach(function(item){
//console.log(item);
item.addEventListener("click",function(){
item.style.background="red";
})
});
</script>
</html>
