为了账号安全,请及时绑定邮箱和手机立即绑定

js 怎么给多个div循环添加点击事件

js 怎么给多个div循环添加点击事件

慕村1106498 2017-06-19 13:43:28
最好是简单点,
查看完整描述

3 回答

已采纳
?
阳光暖暖的时光慢慢的

TA贡献3条经验 获得超2个赞

window.onload = function(){
    var aDiv = document.getElementByTagName("div");
    for(var i=0;i<aDiv.length;i++){
        aDiv[i].index = i;
        aDiv[i].onclick = function(){
            ...
        }
    }
}


查看完整回答
反对 回复 2017-06-29
?
标标哟

TA贡献3条经验 获得超0个赞

使用事件代理,比循环点击的效率好很多,也更规范。

为li添加点击事件如下:

<ul id="todo-app">
  <li class="item">Walk the dog</li>
  <li class="item">Pay bills</li>
  <li class="item">Make dinner</li>
  <li class="item">Code for one hour</li>
</ul>

第一种 使用循环:

document.addEventListener('DOMContentLoaded', function() {

  let app = document.getElementById('todo-app');
  let items = app.getElementsByClassName('item');

  // 给每个列表项添加事件监听器
  for (let item of items) {
    item.addEventListener('click', function() {
      alert('you clicked on item: ' + item.innerHTML);
    });
  }
});

第二种  事件代理:

document.addEventListener('DOMContentLoaded', function() {

  let app = document.getElementById('todo-app');

  // 给容器添加事件监听器
  app.addEventListener('click', function(e) {
    if (e.target && e.target.nodeName === 'LI') {
      let item = e.target;
      alert('you clicked on item: ' + item.innerHTML);
    }
  });
});


查看完整回答
反对 回复 2017-06-30
?
李晓健

TA贡献1036条经验 获得超461个赞

去查一下事件代理相关的知识。

查看完整回答
反对 回复 2017-06-19
  • 3 回答
  • 0 关注
  • 7994 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信