# buttons A, B, C

[browser](https://lochiwei.gitbook.io/web/browser) ⟩ [event](https://lochiwei.gitbook.io/web/browser/event) ⟩ .target ⟩ example ⟩ buttons A,B,C &#x20;

{% hint style="success" %}

{% endhint %}

{% tabs %}
{% tab title="💈範例" %}

* replit ⟩ [buttons A, B, C](https://replit.com/@pegasusroe/buttons-A-B-C#index.js)&#x20;

```javascript
// register handler on parent
document.body.addEventListener("click", event => {
    // ⭐️ check if button is clicked
    if (event.target.nodeName === "BUTTON") {
        console.log(`🔘 button "${event.target.textContent}" clicked ...`);
    }
});
```

{% endtab %}

{% tab title="📗 參考" %}

* [ ] Eloquent JS ⟩ [Ch. 15: Event Handling](https://eloquentjavascript.net/15_event.html) ⟩ [Propagation](https://eloquentjavascript.net/15_event.html#h_NEhx0cDpml)&#x20;
  {% endtab %}

{% tab title="📘 手冊" %}

* [..](https://lochiwei.gitbook.io/web/browser/event "mention") ⟩ [.target](https://developer.mozilla.org/en-US/docs/Web/API/Event/target) ([EventTarget](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget))
  {% endtab %}
  {% endtabs %}
