91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

如何使用addEventListener做事件委托

小樊
96
2024-06-17 20:22:02
欄目: 編程語言

事件委托是一種在父元素上監聽事件,然后根據事件目標來執行相應操作的技術。使用addEventListener可以很方便地實現事件委托。

下面是一個簡單的示例,演示如何使用addEventListener做事件委托:

<!DOCTYPE html>
<html>
<head>
  <title>事件委托示例</title>
</head>
<body>
  <ul id="parentList">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
  </ul>

  <script>
    // 獲取父元素
    var parentList = document.getElementById('parentList');

    // 添加事件監聽器
    parentList.addEventListener('click', function(event) {
      // 判斷觸發事件的目標元素是否為li元素
      if (event.target.tagName === 'LI') {
        // 執行相應操作
        console.log('You clicked on ' + event.target.innerText);
      }
    });
  </script>
</body>
</html>

在上面的示例中,我們首先獲取了父元素parentList,然后在父元素上添加了一個click事件監聽器。當點擊父元素內的任何一個子元素時,事件會冒泡到父元素,然后在事件監聽器中判斷觸發事件的目標元素是否為li元素,如果是則執行相應操作。這樣就實現了事件委托的功能。

0
肇州县| 泰安市| 长岭县| 克拉玛依市| 伊宁县| 阜宁县| 化德县| 武安市| 磐石市| 麻阳| 大渡口区| 孝感市| 东光县| 韶关市| 井陉县| 茶陵县| 祥云县| 军事| 沂源县| 儋州市| 宜君县| 健康| 藁城市| 江都市| 万年县| 夏邑县| 海口市| 通许县| 长泰县| 漳浦县| 德惠市| 肃宁县| 甘谷县| 德钦县| 上饶县| 准格尔旗| 辛集市| 威信县| 翁源县| 平阳县| 江孜县|