下面展示一些 所有代码片段
。
1、btns[i]元素在DOM中当做一个对象去看,充分的去挖掘已有的信息,找线索,找关联
2、// 给对象添加一个index属性,用来储存索引的值.并且你会发现索引是和i相同的。
//获取数组索引的方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 快捷方式:button{我是第$个按钮}*10 + 回车键 -->
<button>我是第1个按钮</button>
<button>我是第2个按钮</button>
<button>我是第3个按钮</button>
<button>我是第4个按钮</button>
<button>我是第5个按钮</button>
<button>我是第6个按钮</button>
<button>我是第7个按钮</button>
<button>我是第8个按钮</button>
<button>我是第9个按钮</button>
<button>我是第10个按钮</button>
<script>
var btns = document.getElementsByTagName("button")
// btns[i]元素在DOM中当做一个对象去看,充分的去挖掘已有的信息,找线索,找关联
for(var i = 0; i < btns.length; i++) {
// 给对象添加一个index属性,用来储存索引的值.并且你会发现索引是和i相同的。
btns[i].index = i
// 注册事件
btns[i].onclick = function() {
//在控制台打印出此刻你点击元素的索引
console.log(this.index);
}
}
</script>
</body>
</html>