How to let versions below IE9 (ie6/7/8) recognize html5 elements_html5 tutorial skills

Each browser has a list of HTML elements it supports. Elements not on the list will be considered unknown elements. The browser will not set any styles for unknown elements (different browsers will have different default styles for elements). In versions prior to IE9, unknown elements cannot be styled. The DOM of unknown elements is also displayed incorrectly, and IE inserts an empty node with no child elements into the DOM. All elements that you would have thought would be children of this unknown element will become its siblings.

There is a solution to this problem. Use js to create a fake article element before using the article tag. IE will recognize this element and support setting styles with css. This fake element doesn't even need to be inserted into the DOM.

Please see the following example:

Copy the code

The code is as follows:

welcome to feimos's blog

This is your first time to visit this webSite.

html>

IE6 will not recognize article, so there will be no red border.

But if we add a js sentence in the head, the situation will be different immediately.

Copy code

The code is as follows:

IE6 pretends that it recognizes this element and displays the effect correctly.

We can create a fake copy of all new HTML5 elements once, so we don’t have to worry about browsers that don’t support HTML5 well in the future. Remy Sharp's HTML5 enabling script helps us do these things. The basic idea of ​​the script is as follows:

Copy the code

The code is as follows:

First use conditional comments to determine whether it is a version before IE9, and if so, execute js. First write all new tags into the e array, then iterate through the entire array and create a copy.

This script has been hosted on Google Project Hosting. You can directly link to this script:

Copy the code

The code is as follows:

In addition, this script needs to be placed at the beginning of the page, preferably in the head, not Place on the bottom. This way IE will run this code before parsing the page tags.