面试题：JavaScript中如何通过事件委托处理多个子元素的点击事件并获取目标元素信息

以下是使用JavaScript实现该功能的代码示例：

<!DOCTYPE html>
<html lang="zh - CN">

<head>
    <meta charset="UTF - 8">
</head>

<body>
    <div id="parent">
        <button>按钮1</button>
        <button>按钮2</button>
        <button>按钮3</button>
    </div>
    <script>
        const parent = document.getElementById('parent');
        parent.addEventListener('click', function (event) {
            if (event.target.tagName === 'BUTTON') {
                const buttonText = event.target.textContent;
                console.log('被点击按钮的文本内容:', buttonText);
            }
        });
    </script>
</body>

</html>

在上述代码中：

通过document.getElementById('parent')获取父元素。
为父元素添加click事件监听器。
在事件处理函数中，通过event.target.tagName === 'BUTTON'判断点击的元素是否是按钮。
如果是按钮，通过event.target.textContent获取按钮的文本内容并输出到控制台。

星途面试题库

面试题：JavaScript中如何通过事件委托处理多个子元素的点击事件并获取目标元素信息

知识考点

面试题答案