This page is In Progress

Notice: The WebPlatform project, supported by various stewards between 2012 and 2015, has been discontinued. This site is now available on github.

object

Summary

The <object> element represents can represent an external resource, which, depending on the type of the resource, will either be treated as an image, as a nested browsing context, or as an external resource to be processed by a plugin.

Overview Table

DOM Interface
HTMLObjectElement

Examples of external resources:

  • Flash contents
  • Java applet
  • HTML resource

Accessibility

Authors should ensure that the information and user interface components must be presentable to users in ways they can perceive (WCAG 2.0 - Principle 1: Perceivable). This includes providing alternatives for time-based media Guideline 1.2.

HTML Attributes

  • data = URL potentially surrounded by spaces
    Specifies the address of the resource.

  • type = MIME type
    Specifies the type of the resource.

  • name = string
    Gives the name of the input element.

  • usemap = hash-name reference
    Specifies a hash-name reference to a map element with which to associate the object.

  • form = the ID of a form element in the element’s owner
    Associate the object element with its form owner.

  • width = non-negative integer
    Give the width of the visual content of the element, in CSS pixels.

  • height = non-negative integer
    Give the height of the visual content of the element, in CSS pixels.

The following attributes were previously defined but obsolete: noembed, archive, classid, code, codebase, codetype, declare, standby, datasrc, datafld, dataformatas, align, border, hspace, vspace.

Examples

The following example shows how a plugin can be used in HTML (in this case the Flash plugin, to show a video file). Fallback is provided for users who do not have Flash enabled, in this case using the video element to show the video for those using user agents that support video, and finally providing a link to the video for those who have neither Flash nor a video-capable browser

<p>Look at my video:
  <object type="application/x-shockwave-flash">
    <param name=movie value="http://video.example.com/library/watch.swf">
    <param name=allowfullscreen value=true>
    <param name=flashvars value="http://video.example.com/vids/315981">
    <video controls src="http://video.example.com/vids/315981">
      <a href="http://video.example.com/vids/315981">View video</a>.
    </video>
  </object>
</p>

In the following example, a Java applet is embedded in a page using the object element. (Generally speaking, it is better to avoid using applets like these and instead use native JavaScript and HTML to provide the functionality, since that way the application will work on all Web browsers without requiring a third-party plugin. Many devices, especially embedded devices, do not support third-party technologies like Java.)

<figure>
  <object type="application/x-java-applet">
    <param name="code" value="MyJavaClass">
    <p>You do not have Java available, or it is disabled.</p>
  </object>
  <figcaption>My Java Clock</figcaption>
</figure>

In this example, an HTML page is embedded in another using the object element

<figure>
  <object data="clock.html"></object>
  <figcaption>My HTML Clock</figcaption>
</figure>

Notes

Remarks

An object element can be a child of the head or the body element of a document. Possible return values (those generated by Dynamic HTML (DHTML) Object Model properties) on the object element depend on the implementation of the object. For example, the readyState property returns null or error if the object does not implement a readyState property. DHTML Object Model properties available for an object depend on the content of the object. For information about supported properties, see the documentation for the individual object. Events are sent directly to the object element. If the event is returned by the embedded object, it bubbles accordingly. If the event is not returned, it does not bubble. Note You can use the object property for the object element to reconcile DHTML Object Model members that are duplicated by the object element’s implementation and by DHTML. For instance, if the object implements an item method and DHTML implements an item method, use document.all.objectID.object.item() to access the one defined for the object. Windows Internet Explorer 9. In IE9 Standards mode, the object element is allowed to load content from other domains. In IE8 Standards mode, however, this is not allowed. Windows Internet Explorer 8 and later. IE8 mode enables several enhancements to the object element that are not available when pages are displayed in earlier document modes.

  • Images are supported as native object types.
  • The values of the codeBase and data attributes depend on the current document compatibility mode.
  • Object fallback is supported when an object fails to load for communication or cross-domain security failures.

Note Object fallback does not occur when the contentEditable property of the Document object is set to true.

  • The title attribute is preferred over the alt attribute when specified as a pop-up tooltip.
  • When the value of the data attribute specifies the data URI protocol, the value is not passed to Microsoft ActiveX controls upon instantiation. This preserves compatibility with older ActiveX controls that do not support the data URI protocol.

Related specifications

HTML 5.1
W3C Working Draft
HTML 5
W3C Recommendation
HTML 4.01
W3C Recommendation

Attributions