Side navigation
#5327 closed bug (duplicate)
Opened October 06, 2009 03:54AM UTC
Closed December 06, 2010 07:40PM UTC
Last modified March 10, 2012 11:23AM UTC
Internet Explorer errors when inserting HTML5 elements
| Reported by: | Perceptes | Owned by: | |
|---|---|---|---|
| Priority: | major | Milestone: | |
| Component: | core | Version: | 1.3.2 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
Internet Explorer (6, 7, and 8) currently throws an error when using jQuery to insert HTML5 elements into the page using DOM manipulation functions. The HTML5 shiv script created by John Resig and Remy Sharp allows IE to recognize and correctly style HTML5 elements, but it fails to correctly parse elements inserted after the initial page load.
This issue has been discussed on these pages:
http://stackoverflow.com/questions/1191164/jquery-html5-append-appendto-and-ie
It was suggested in the Google Group thread that this issue is caused by jQuery using innerHTML instead of createElement, though even when inserting HTML5 elements into each other one at a time I found that the same error was received.
Attached is a simple test case that shows this behavior.
Attachments (1)
Change History (7)
Changed October 20, 2009 01:20PM UTC by comment:1
Changed October 27, 2009 12:34PM UTC by comment:2
Given that IE supports neither XHTML nor HTML5, I'm not sure what jQuery can do. If you use the $("<unknownelement />") technique to create the element it will work, but only because jQuery has an optimization to use createElement for that one case. The performance implications of having jQuery parse or even preprocess the HTML string to allow HTML5 elements seem horrific.
Changed November 11, 2009 08:13PM UTC by comment:3
| component: | unfilled → core |
|---|
Changed November 19, 2010 02:41AM UTC by comment:4
| resolution: | → invalid |
|---|---|
| status: | new → closed |
Use modernizr or a similar script to provide HTML5 tag support in IE.
Changed December 06, 2010 07:39PM UTC by comment:5
| milestone: | 1.4 |
|---|---|
| resolution: | invalid |
| status: | closed → reopened |
Modernizr doesn't fix this issue. It's tricky.
I'm going to merge this in with #6485 which covers this topic with potential solutions.
Thanks for the report and details, perceptes.
Changed December 06, 2010 07:40PM UTC by comment:6
| resolution: | → duplicate |
|---|---|
| status: | reopened → closed |
The bug is in IE's implementation of innerHTML - for some reason it doesn't like the "unknown" elements being inserted via innerHTML - whereas DOM scripting is fine.
jQuery uses creates a holding div, and then drops in the markup you want to append in via innerHTML. IE now sees the unknown elements as two new broken elements, i.e. <article>content</article> is seen as ARTICLE, #text, /ARTICLE, caused by innerHTML borking.
Here's an example, check it out in IE and you'll see that innerHTML insertion method incorrectly reports 3 nodes inserted in the div: http://jsbin.com/olizu
Screenshot for those without IE: http://leftlogic.litmusapp.com/pub/2c3ea3e