Side navigation
#10501 closed bug (fixed)
Opened October 14, 2011 11:08PM UTC
Closed October 23, 2011 08:22PM UTC
Last modified January 11, 2012 09:06PM UTC
HTML5 element "innerShiv" inconsistent across html()/append()
| Reported by: | rwaldron | Owned by: | rwaldron |
|---|---|---|---|
| Priority: | blocker | Milestone: | 1.7 |
| Component: | manipulation | Version: | 1.7b2 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
Thanks to JD Bartlett for finding this issue. Running this example: http://jsbin.com/obomec in <= IE8 will fail to set style on the newly created section element, however changing the code to use the html() method instead of append() will work correctly ( http://jsbin.com/obomec/5 )
Attachments (0)
Change History (14)
Changed October 14, 2011 11:08PM UTC by comment:1
| component: | unfiled → manipulation |
|---|---|
| milestone: | None → 1.7 |
| owner: | → rwaldron |
| priority: | undecided → blocker |
| status: | new → assigned |
Changed October 15, 2011 05:58PM UTC by comment:2
Seems to be an issue with IE<=8's Element#cloneNode. cloneNode is used by jQuery.clone, which is used by jQuery#domManip, which is used by jQuery.append.
When there are styles targeting a class associated with the HTML5 element being cloned, IE8 seems to act appropriately: http://jsbin.com/obomec/2
Changed October 15, 2011 06:19PM UTC by comment:3
Jonathan Neal's Shimprove tackles the cloneNode issue: http://www.iecss.com/shimprove/
Shimprove overrides cloneNode with newCloneNode -- a method that grabs an element's outerHTML, creates a new element from that HTML within the context of a shim'd fragment, and then returns that element as its result. Badabing badaboom.
Obviously, jQuery shouldn't override any core browser functions, but internal use of a method similar to newCloneNode (on IE's where it's necessary) would fix this issue.
Changed October 17, 2011 06:50PM UTC by comment:4
Changed October 23, 2011 08:22PM UTC by comment:5
| resolution: | → fixed |
|---|---|
| status: | assigned → closed |
Landing pull request 550. IE6,7,8 cannot use cached fragments from unknown elems. Fixes #10501.
More Details:
Changeset: f3a4d261ecd0e858515f6e3fa8f5ff59078ec895
Changed November 16, 2011 09:41PM UTC by comment:6
Is the clone() issue fixed in stable jQuery 1.7?
I still get <:section></:section> on cloned <section>s in IE8.
Changed November 16, 2011 10:17PM UTC by comment:7
We never go back and change a file once it's released. The current code is always at http://code.jquery.com/jquery-git.js so test against that. We will be releasing 1.7.1 soon.
Changed November 17, 2011 01:31AM UTC by comment:8
Also, for future reference, posting the same question on two tickets is unnecessary.
Changed November 30, 2011 11:32AM UTC by comment:9
jquery-git.js fixes the issue for me, thanks!
Changed December 01, 2011 11:23AM UTC by comment:10
Wait. jquery-git.js fixes the issue on .cloneNode() but *not* for .innerHtml() which for Ajax loaded HTML5 content screws all up in IE8: http://pastebin.com/Y4GLa8Tc
Changed December 16, 2011 10:55PM UTC by comment:11
I'm using 1.7.1 and I still get this bug when I try to do something like $('<some selector>').append($('<some selector to html5>'.clone(true)); in the IE8?
Changed January 11, 2012 07:57PM UTC by comment:12
I have a better example of the inconsistencies that are still occurring.
It's impossible right now to use $.html() on elements that are not in the DOM, you must use $.append() in those cases.
Changed January 11, 2012 08:01PM UTC by comment:13
Replying to [comment:12 drew@…]:
I have a better example of the inconsistencies that are still occurring. http://jsfiddle.net/jjgMC/11/ It's impossible right now to use $.html() on elements that are not in the DOM, you must use $.append() in those cases.
Also version http://jsfiddle.net/jjgMC/12/ shows that jquery-git(as of 1/11/2012) also fails to correctly allow styles (but they all work in FF9/Webkit/IE9)
Changed January 11, 2012 09:06PM UTC by comment:14
jQuery's HTML5 support is not intended to be a "fix-all", Please be sure to use the latest "html5shiv":
http://code.google.com/p/html5shiv/
See: http://jsbin.com/egumes/2
Running in IE8:
