首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

当last也是动态创建的时候,如何让li动态单击呢?

当last也是动态创建的时候,可以通过事件委托的方式实现li的动态单击。

事件委托是指将事件绑定到父元素上,利用事件冒泡的机制,通过判断事件源来执行相应的操作。在这种情况下,可以将点击事件绑定到父元素上,然后通过判断点击的目标元素是否为li来执行相应的操作。

以下是一个示例代码:

HTML部分:

代码语言:txt
复制
<ul id="list">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

JavaScript部分:

代码语言:txt
复制
var list = document.getElementById('list');

list.addEventListener('click', function(event) {
  var target = event.target;
  
  if (target.tagName === 'LI') {
    // 执行li的点击操作
    console.log('点击了li:' + target.textContent);
  }
});

在上述代码中,通过addEventListener方法将点击事件绑定到父元素ul上。当点击ul内的任意li元素时,事件会冒泡到ul元素,通过判断事件源的tagName是否为'LI',来确定是否点击了li元素。如果是,则执行相应的操作,例如在控制台输出li的文本内容。

这种方式可以适用于动态创建的li元素,无论是通过JavaScript动态创建还是通过后端渲染生成的。只需要将事件绑定到父元素上,无需为每个li元素单独绑定事件,提高了效率和代码的可维护性。

推荐的腾讯云相关产品:无

希望以上内容能够满足您的需求,如有其他问题,请随时提问。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券