---
title: HTMLBodyElement
slug: Web/API/HTMLBodyElement
translation_of: Web/API/HTMLBodyElement
---
<div>{{APIRef("HTML DOM")}}</div>

<div><strong><code>HTMLBodyElement </code></strong>接口提供了特殊的属性（除了它们继承的常规的{{ domxref("HTMLElement") }}接口）以外，还可以处理 body 元素。</div>

<div> </div>

<p>{{InheritanceDiagram(600, 120)}}</p>

<h2 id="属性">属性</h2>

<p><em>从其父项{{domxref("HTMLElement")}} 和{{domxref("WindowEventHandlers")}}中继承属性。</em></p>

<dl>
 <dt>{{domxref("HTMLBodyElement.aLink")}} {{obsolete_inline}}</dt>
 <dd>Is a {{ domxref("DOMString") }} that represents the color of active hyperlinks.</dd>
 <dt>{{domxref("HTMLBodyElement.background")}} {{obsolete_inline}}</dt>
 <dd>Is a {{ domxref("DOMString") }} that represents the description of the location of the background image resource. Note that this is not an URI, though some older version of some browsers do expect it.</dd>
 <dt>{{domxref("HTMLBodyElement.bgColor")}} {{obsolete_inline}}</dt>
 <dd>Is a {{ domxref("DOMString") }} that represents the background color for the document.</dd>
 <dt>{{domxref("HTMLBodyElement.link")}} {{obsolete_inline}}</dt>
 <dd>Is a {{ domxref("DOMString") }} that represents the color of unvisited links.</dd>
 <dt>{{domxref("HTMLBodyElement.text")}} {{obsolete_inline}}</dt>
 <dd>Is a {{ domxref("DOMString") }} that represents the foreground color of text.</dd>
 <dt>{{domxref("HTMLBodyElement.vLink")}} {{obsolete_inline}}</dt>
 <dd>Is a {{ domxref("DOMString") }} that represents the color of visited links.</dd>
</dl>

<h2 id="方法">方法</h2>

<p><em>No specific methods; inherits methods from its parent, {{domxref("HTMLElement")}} and from {{domxref("WindowEventHandlers")}}</em><em>.</em></p>

<h2 id="事件处理">事件处理</h2>

<p><em>No specific event handlers; inherits event handlers from its parent, {{domxref("HTMLElement")}} and from {{domxref("WindowEventHandlers")}}</em><em>.</em></p>

<dl>
 <dt>{{domxref("WindowEventHandlers.onafterprint")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("afterprint")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.onbeforeprint")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("beforeprint")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.onbeforeunload")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("beforeunload")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.onhashchange")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("hashchange")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.onlanguagechange")}} {{experimental_inline}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("languagechange")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.onmessage")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} called whenever an object receives a {{event("message")}} event.  </dd>
 <dt>{{domxref("WindowEventHandlers.onmessageerror")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} called whenever an object receives a {{event("messageerror")}} event.</dd>
 <dt>{{domxref("WindowEventHandlers.onoffline")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("offline")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.ononline")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("online")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.onpagehide")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("pagehide")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.onpageshow")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("pageshow")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.onpopstate")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("popstate")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.onrejectionhandled")}}</dt>
 <dd>An {{event("Event_handlers", "event handler")}} representing the code executed when the {{event("rejectionhandled")}} event is raised, indicating that a {{jsxref("Promise")}} was rejected and the rejection has been handled.</dd>
 <dt>{{domxref("WindowEventHandlers.onresize")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("resize")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.onstorage")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("storage")}} event is raised.</dd>
 <dt>{{domxref("WindowEventHandlers.onunhandledrejection")}}</dt>
 <dd>An {{event("Event_handlers", "event handler")}} representing the code executed when the {{event("unhandledrejection")}} event is raised, indicating that a {{jsxref("Promise")}} was rejected but the rejection was not handled.</dd>
 <dt>{{domxref("WindowEventHandlers.onunload")}}</dt>
 <dd>Is an {{event("Event_handlers", "event handler")}} representing the code to be called when the {{event("unload")}} event is raised.</dd>
</dl>

<h2 id="规范">规范</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('HTML WHATWG', "sections.html#the-body-element", "HTMLBodyElement")}}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td>Technically, the event-related properties <code>onafterprint</code>, <code>onbeforeprint</code>, <code>onbeforeunload</code>, <code>onblur</code>, <code>onerror</code>, <code>onfocus</code>, <code>onhashchange</code>, <code>onlanguagechange</code>, <code>onload</code>, <code>onmessage</code>, <code>onoffline</code>, <code>ononline</code>, <code>onpopstate</code>, <code>onresize</code>, <code>onstorage</code>, and <code>onunload</code>, have been moved to {{domxref("WindowEventHandlers")}}. <code>HTMLBodyElement</code> implements this interface.</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5.1', "sections.html#the-body-element", "HTMLBodyElement")}}</td>
   <td>{{Spec2('HTML5.1')}}</td>
   <td> </td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5 W3C', "sections.html#the-body-element", "HTMLBodyElement")}}</td>
   <td>{{Spec2('HTML5 W3C')}}</td>
   <td>The following properties are now obsolete: <code>aLink</code>, <code>bgColor</code>, <code>background</code>, <code>link</code>, <code>text</code>, and <code>vLink</code>.<br>
    The following properties have been added: <code>onafterprint</code>, <code>onbeforeprint</code>, <code>onbeforeunload</code>, <code>onblur</code>, <code>onerror</code>, <code>onfocus</code>, <code>onhashchange</code>, <code>onload</code>, <code>onmessage</code>, <code>onoffline</code>, <code>ononline</code>, <code>onpopstate</code>, <code>onresize</code>, <code>onstorage</code>, and <code>onunload</code>.</td>
  </tr>
  <tr>
   <td>{{SpecName('DOM2 HTML', 'html.html#ID-62018039', 'HTMLBodyElement')}}</td>
   <td>{{Spec2('DOM2 HTML')}}</td>
   <td>No change from {{SpecName("DOM1")}}.</td>
  </tr>
  <tr>
   <td>{{SpecName('DOM1', 'level-one-html.html#ID-62018039', 'HTMLBodyElement')}}</td>
   <td>{{Spec2('DOM1')}}</td>
   <td>Initial definition.</td>
  </tr>
 </tbody>
</table>

<h2 id="浏览器兼容性">浏览器兼容性</h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Edge</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatChrome(1)}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoDesktop(1.0)}} [1]</td>
   <td>4.0</td>
   <td>{{CompatVersionUnknown}} [1]</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>onXYZ</code> event handlers</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>onlanguage</code></td>
   <td>{{CompatNo}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatGeckoDesktop(32)}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>onmessageerror</code></td>
   <td>{{CompatChrome(60)}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatOpera(47)}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>onstorage</code></td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatGeckoDesktop(45)}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>onrejectionhandled</code> and <code>onunhandledrejection</code></td>
   <td>{{CompatChrome(49)}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatOpera(36)}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android Webview</th>
   <th>Chrome for Android</th>
   <th>Edge</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Phone</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoMobile(1.0)}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>onXYZ</code> event handlers</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>onlangugage</code></td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatGeckoMobile(32)}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>onmessageerror</code></td>
   <td>{{CompatChrome(60)}}</td>
   <td>{{CompatChrome(60)}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatOperaMobile(47)}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>onstorage</code></td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatGeckoMobile(45)}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>onrejectionhandled</code> and <code>onunhandledrejection</code></td>
   <td>{{CompatChrome(49)}}</td>
   <td>{{CompatChrome(49)}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatOperaMobile(36)}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<p>[1] Firefox prior to Firefox 7.0 (and some older versions of Opera) returned a URI for the <code>HTMLBodyElement.background</code> attribute.</p>

<h2 id="参考阅读">参考阅读</h2>

<ul>
 <li>HTML element implementing this interface: {{ HTMLElement("body") }}</li>
 <li>{{domxref("WindowEventHandlers")}}</li>
</ul>