JavaScript 事件冒泡：点击子元素触发父元素事件

在 JavaScript 中，事件冒泡是指事件从最具体的元素开始触发，然后逐步向上冒泡到更一般的元素。所以当你点击子元素时，父元素的点击事件会自动触发。

以下是一个示例代码，演示了冒泡点击事件的触发：

HTML代码：

<div id='parent'>
  <button id='child'>子元素</button>
</div>

JavaScript代码：

var parent = document.getElementById('parent');
var child = document.getElementById('child');

parent.addEventListener('click', function() {
  console.log('父元素被点击');
});

child.addEventListener('click', function(event) {
  console.log('子元素被点击');
  event.stopPropagation();
});

在这个例子中，当你点击子元素时，会先触发子元素的点击事件，然后再触发父元素的点击事件。通过调用event.stopPropagation()方法，可以阻止事件继续向上冒泡，只触发子元素的点击事件。