Failed to set the 'data' attribute for the 'Object' tag in jQuery. [IE8 only]

Question

I am creating an object object dynamically in jQuery to display some content. It works in all browsers except IE8.

Code:

j$(document).ready(function(){ j$('.objContainer').html(j$('<object>').attr( {'data':'http://www.stackoverflow.com', 'type':'text/html'})); }); 

HTML structure created after execution (in IE8):

  <object type="text/html"></object> 

In other browsers [IE9, Firefox, Chrome]:

  <object data="http://www.stackoverflow.com" type="text/html"></object> 

Any solutions?

Answer 1

Works for me: using IE8 developer tools, I see a data attribute. Here is a screenshot .

(I know that I don’t need to say this, but: you need to make sure that you allow scripts to run.)

Answer 2

As you can see here , data ( dataset ) are not supported by IE.
What you can do is rename the data to data-foo and then $(..).data("foo") will work even in IE due to the special processing of jquery itself.
This is a way around the dataset limitation for IE .

Answer 3

It should work fine, although I recommend using the $ .data () method

http://api.jquery.com/jQuery.data/

This is much safer, and jQuery ensures that data is deleted when DOM elements are deleted using jQuery methods.

Example:

 <object id='myObj' data-url="http://www.stackoverflow.com" type="text/html"></object> 

And you can read a value like:

 var url = $('#myObj').data('url');// Read the value $('#myObj').data('url', 'some-other-value');// Set a new value