body
elementhtml
element.onafterprint
onbeforeprint
onbeforeunload
onblur
onerror
onfocus
onhashchange
onload
onmessage
onoffline
ononline
onpagehide
onpageshow
onpopstate
onresize
onscroll
onstorage
onunload
interface HTMLBodyElement : HTMLElement { attribute EventHandler onafterprint; attribute EventHandler onbeforeprint; attribute EventHandler onbeforeunload; attribute EventHandler onblur; attribute OnErrorEventHandler onerror; attribute EventHandler onfocus; attribute EventHandler onhashchange; attribute EventHandler onload; attribute EventHandler onmessage; attribute EventHandler onoffline; attribute EventHandler ononline; attribute EventHandler onpopstate; attribute EventHandler onpagehide; attribute EventHandler onpageshow; attribute EventHandler onresize; attribute EventHandler onscroll; attribute EventHandler onstorage; attribute EventHandler onunload; };
The body
element represents the main
content of the document.
In conforming documents, there is only one body
element. The document.body
IDL attribute provides scripts with easy access to a document's
body
element.
Some DOM operations (for example, parts of the
drag and drop model) are defined in terms of "the
body element". This refers to a particular element in the
DOM, as per the definition of the term, and not any arbitrary
body
element.
The body
element exposes as event handler
content attributes a number of the event
handlers of the Window
object. It also mirrors
their event handler IDL attributes.
The onblur
, onerror
, onfocus
, onload
, and onscroll
event
handlers of the Window
object, exposed on the
body
element, shadow the generic event
handlers with the same names normally supported by HTML
elements.
Thus, for example, a bubbling error
event dispatched on a child of
the body element of a Document
would first
trigger the onerror
event
handler content attributes of that element, then that of the
root html
element, and only then would it
trigger the onerror
event handler content
attribute on the body
element. This is because
the event would bubble from the target, to the body
, to
the html
, to the Document
, to the
Window
, and the event
handler on the body
is watching the
Window
not the body
. A regular event
listener attached to the body
using addEventListener()
, however, would be run when the
event bubbled through the body
and not when it reaches
the Window
object.
This page updates an indicator to show whether or not the user is online:
<!DOCTYPE HTML> <html> <head> <title>Online or offline?</title> <script> function update(online) { document.getElementById('status').textContent = online ? 'Online' : 'Offline'; } </script> </head> <body ononline="update(true)" onoffline="update(false)" onload="update(navigator.onLine)"> <p>You are: <span id="status">(Unknown)</span></p> </body> </html>