# window-reflecting body element event handlers

[browser](../..) ⟩ [event](..) ⟩ [handler]() ⟩ window-reflecting body element event handlers

{% hint style="warning" %}
[**Window**](../../dom/type/window)**-**<mark style="color:yellow;">**reflecting**</mark> <mark style="color:orange;">**body**</mark> element [**event handlers**]()：

if you assign one of the following event handlers on [document.body](https://developer.mozilla.org/en-US/docs/Web/API/Document/body), it will be reflected on [window](../../dom/type/window) too, and vice versa.&#x20;

* <mark style="color:yellow;">**onblur**</mark>, <mark style="color:yellow;">**onerror**</mark>, <mark style="color:yellow;">**onfocus**</mark>, <mark style="color:yellow;">**onload**</mark>, <mark style="color:yellow;">**onresize**</mark>, <mark style="color:yellow;">**onscroll**</mark>

```javascript
const body = document.body;
body.onblur = function f(){};        // assigned on body
window.onblur                        // f: reflected on window

window.onresize = function g(){};    // assigned on window
body.onresize                        // g: reflected on body
```

📗  [Medium](https://medium.com/@mingjunlu/window-onscroll-vs-document-body-onscroll-9c331bb8d298)
{% endhint %}

{% tabs %}
{% tab title="👥 相關" %}
* [scroll](../../dom/type/window/scroll "mention")
{% endtab %}

{% tab title="📗 參考" %}
* [ ] [你的 onscroll 不是你的 onscroll](https://medium.com/@mingjunlu/window-onscroll-vs-document-body-onscroll-9c331bb8d298) ⭐️&#x20;
{% endtab %}
{% endtabs %}
