如何将类添加到div，而不管是单击外部div还是内部div？

要将类添加到div，无论是单击外部div还是内部div，可以使用事件委托来实现。

事件委托是利用事件冒泡原理，将事件绑定到父级元素上，通过判断事件源来触发相应的操作。

以下是实现的步骤：

1. 获取目标div的父级元素（外部div）并添加事件监听器。
   • 可以使用document.querySelector或document.getElementById获取父级元素。
   • 添加事件监听器可以使用addEventListener方法。

• 在事件监听器中判断事件源。
  • 可以使用事件对象的target属性来获取事件源。
• 判断事件源是否为目标div本身或其子元素。
  • 可以使用元素的contains方法来判断一个元素是否为另一个元素的后代。
• 如果是目标div本身或其子元素，给目标div添加类。

以下是示例代码：

HTML部分：

<div id="outerDiv">
  <div id="targetDiv">点击我</div>
</div>

JavaScript部分：

var outerDiv = document.getElementById('outerDiv');
outerDiv.addEventListener('click', function(event) {
  if (event.target.id === 'targetDiv' || event.target.parentNode.id === 'targetDiv') {
    event.target.classList.add('yourClass');
  }
});

解释说明：

• 首先获取外部div元素（id为outerDiv）。
• 添加click事件监听器，当点击外部div或内部div时触发。
• 在事件处理函数中，判断事件源是否为目标div（id为targetDiv）或目标div的父元素。
• 如果是目标div本身或其子元素，使用classList.add方法给目标div添加类（yourClass为自定义类名）。

这样无论是单击外部div还是内部div，都会给目标div添加类。