事件监听器中，click target如何指向被点击的按钮？

这是JavaScript事件机制的标准行为，拆解来看：

1. 事件对象会自动传入回调
   当你调用addEventListener绑定点击事件时，浏览器检测到用户点击对应元素后，会自动生成一个事件对象（Event），并把这个对象作为参数传给你的回调函数。你这里把这个参数命名为x（通常大家习惯叫e、evt或者event），它就是这个内置的事件对象。

2. target属性指向触发事件的源头元素
   事件对象上的target属性，专门用来表示用户实际触发事件的最底层DOM元素。在你的代码里，监听器直接绑定在按钮元素上，用户点击的就是这个按钮，所以x.target自然就指向被点击的那个按钮DOM节点，你也就可以通过它访问按钮的dataset.id属性。

举个和你代码对应的场景：
假设循环到第1个按钮，你给它绑定了点击监听器，用户点击这个按钮时，浏览器就把事件对象传给回调里的x，x.target就是这个按钮元素，x.target.dataset.id就能拿到按钮上的data-id值。

另外补充个小细节：和target类似的还有currentTarget属性，它指向绑定监听器的那个元素。在你的场景里，因为监听器直接绑在按钮上，所以x.target和x.currentTarget是同一个元素；但如果按钮内部还有子元素（比如<button><span>点击</span></button>），用户点击span时，target是span，currentTarget还是按钮。

内容的提问来源于stack exchange，提问作者easymoneysniper23