# handler options

[JS](../../../../js) ⟩ [browser](../../..) ⟩ [event](../..) ⟩ [handler](..) ⟩ [register]() ⟩ options

{% hint style="success" %}
```javascript
elem.addEventListener(event, handler, {
    once: true,    // automatically removed after it triggers.
    capture: true, // capturing phase
    passive: true, // handler won't call preventDefault()
});
```

* `capture`: -> [Bubbling and capturing](https://javascript.info/bubbling-and-capturing). <mark style="color:blue;">`options`</mark> can also be <mark style="color:yellow;">`false/true`</mark>, that’s the same as <mark style="color:yellow;">`{capture: false/true}`</mark>.
* `passive`: -> [Browser default actions](https://javascript.info/default-browser-action).
{% endhint %}

{% tabs %}
{% tab title="⭐️ 重點" %}
{% hint style="info" %}
If you pass <mark style="color:purple;">**true**</mark> to the optional <mark style="color:yellow;">**3rd argument**</mark> to [addEventListener()](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener),  the handler is registered as a [**capturing event handler**](../../propagation/capturing).

```javascript
elem.addEventListener(event, handler, true);
```
{% endhint %}
{% endtab %}

{% tab title="📗 參考" %}
* [ ] javascript.info ⟩ [Introduction to browser events](https://javascript.info/introduction-browser-events#addeventlistener)
{% endtab %}
{% endtabs %}
