Standard Reference
The object element defines an embedded object. The original intention was to replace the IMG and Applet elements. However, due to security and other reasons and lack of browser support, this original intention has not been realized. Browser objects support object types. However, different mainstream browsers use different codes to load even the same object type. The classid attribute is used to specify the URI address implemented by the object. It may be used to replace or cooperate with the data attribute, which is determined by the introduced object.
The codebase attribute specifies a basic path for the relative uri of the classid, data, and archive attributes. By default, this value is the basic URI of the current document.
The Type attribute defines the MIME type of data that appears in the file specified in the data attribute.
For more information about object elements and their attributes, see html4.01 standard 13.3.
Problem description
Generally, the IE browser introduces flash using the object element through the ActiveX plug-in, while other browsers use the EMBED element through the corresponding npapi plug-in. This leads to the difference in the way Flash is inserted in various browsers.
Impact
If you only use the object element to set the classid attribute to introduce flash, flash may not be introduced in Some browsers. If the nested object and EMBED element parameters are inconsistent, the introduced flash may be different in various browsers.
Affected browsers
Problem Analysis
For the object element in the html4.01 standard, ie has its own interpretation method for the classid attribute: Class Identifier ). Format: CLSID: XXXXXXXX-XXXX-xxxxxxxxxxxx. The ActiveX component is registered in the Windows registry.
The codebase attribute is the URI address of the ActiveX plug-in corresponding to this class identifier. It is generally a. Cab installation package. (For more information, see msdn: classid attribute | classid property and Class Identifier .)
The EMBED element is introduced by Netscape Navigator 2. It is used to insert a plug-in HTML documents that complies with the Netscape plug-in Application Programming Interface (npapi) specifications. The npapi plug-in is cross-platform and can be used in all browsers that implement this interface specification. Browsers other than IE in mainstream browsers currently support the npapi plug-in.
In fact, ie3.0 supports the npapi, but after ie5.5 SP2, Microsoft stopped its support for the npapi for security reasons, and recommended that you use its ActiveX technology as an alternative. (For more information, see msdn: Netscape plug-ins do not work after Internet Explorer is upgraded)
The EMBED element has a property named pluginspage with the value of the URL of the npapi plug-in. It is similar to the codebase attribute of the object element in IE and tells the browser plug-in.
The EMBED element does not belong to the html4.01 standard. The direct use of the EMBED element in the HTML document may not pass W3C verification. However, the EMBED element has been added to the HTML5 draft. (Draft HTML5: 4.8.3 the EMBED element)
So far, if you need to introduce an installed General Plug-in the HTML document, such as flash, the object element is used in IE, And the EMBED element is used in non-ie. In addition, ie also supports the introduction of plug-ins with correct mime settings for the EMBED element.
Generally, we use code similar to the following structure to introduce flash:Flash.html(The SWF file is from the flash example on the Adobe website)
<object width="200" height="200" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#4,0,0,0"> <param name="src" value="clock.swf" /> <param name="quality" value="high" /> <embed src="clock.swf" type="application/x-shockwave-flash" width="200" height="200" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed></object>
The effects in various browsers are:
Embed an EMBED element in an object element. In ie, the object element is preferentially used to ignore the EMBED element. In other browsers, The EMBED element is preferentially used to ignore the object element. This ensures that flash can be correctly loaded in all browsers. However, if the parameter settings of the object and embed elements are inconsistent, it is very likely that the flash displays different effects in different browsers, or even cannot be loaded normally.
For details about how to correctly introduce flash in HTML documents, refer to the official Adobe knowledge base document: object and embed syntax | content in flash and Flash Object and embed tag attributes.
The following will analyze whether consistent effects are achieved in all mainstream browsers when Flash is introduced with only one element. (Assuming that all browsers have correctly installed the plug-ins required by flash)
1. Use the classid attribute of the object element and the param element:
Flash_object_classid.html
<div style="border:5px solid black; padding:5px; float:left;"> <object width="200" height="200" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#4,0,0,0"> <param name="src" value="clock.swf" /> <param name="quality" value="high" /> </object></div>
This code runs in various browsers as follows:
IE6 IE7 IE8 chrome Safari |
Firefox Opera |
|
|
Firefox and opera do not support ActiveX technology. If Flash cannot be introduced through the object element and classid attribute, the width and height of the object element are both 0.
However, chrome and Safari correctly load Flash files. This is because the WebKit Kernel provides limited support for ActiveX. For more common ActiveX plug-ins (such as flash, Media Player, Director, quickTime, RealAudio), the browser will associate their classid in the Windows system with their corresponding mime-type, so you can introduce these plug-ins just like ie through the classid attribute of the object element.
2. Use the type and data attributes of the object element:
Flash_object_type.html
<div style="border:5px solid black; padding:5px; float:left;"> <object width="200" height="200" type="application/x-shockwave-flash" data="clock.swf"> </object></div>
This code runs in various browsers as follows:
IE6 IE7 IE8 |
Firefox Chrome safari Opera |
|
|
IE has no effect on setting the URL of the Flash file for the data attribute of the object element. This method can be used in non-ie browsers.
3. Use the object element type, data attribute, And Param element:
Flash_object_all.html
<div style="border:5px solid black; padding:5px; float:left;"> <object width="200" height="200" type="application/x-shockwave-flash" data="clock.swf"> <param name="src" value="clock.swf" /> <param name="quality" value="high" /> </object></div>
In this way, only the standard Object elements in W3C specifications are used. Combined with the above two test examples, all browsers can load Flash files normally.
4. Use the EMBED element:
Flash_embed.html
<div style="border:5px solid black; padding:5px; float:left;"> <embed src="clock.swf" type="application/x-shockwave-flash" width="200" height="200" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed></div>
Directly use the EMBED element, which is supported by all browsers.
Solution
- If W3C verification is not taken into account, you can embed the EMBED element into flash in a unified manner to avoid compatibility problems caused by inconsistent parameters.
- If you need to consider W3C validation service, you can use the third method to use the object and Param elements separately.
- If you must use the object embedded EMBED element hybrid method, ensure that the URL of the Flash file, parameters transmitted for flash, width, height, wmode, and other parameters are consistent.
- You can use the open-source swfobject to introduce flash. (See :)