老式浏览器如何支持html5标签

/**

• @preserve HTML5 Shiv 3.7.3 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed
  /
  ;(function(window, document) {
  /jshint evil:true */
  /* version /
  var version = '3.7.3';

  /* Preset options /
  var options = window.html5 || {};

  /* Used to skip problem elements /
  var reSkip = /^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i;

  / Not all elements can be cloned in IE /
  var saveClones = /^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i;

  /* Detect whether the browser supports default html5 styles /
  var supportsHtml5Styles;

  /* Name of the expando, to work with multiple documents or to re-shiv one document /
  var expando = '_html5shiv';

  /* The id for the the documents expando /
  var expanID = 0;

  /* Cached data for each document /
  var expandoData = {};

  /* Detect whether the browser supports unknown elements /
  var supportsUnknownElements;

  (function() {
  try {
  var a = document.createElement('a');
  a.innerHTML = '<xyz></xyz>';
  //if the hidden property is implemented we can assume, that the browser supports basic HTML5 Styles
  supportsHtml5Styles = ('hidden' in a);

  supportsUnknownElements = a.childNodes.length == 1 || (function() {
    // assign a false positive if unable to shiv
    (document.createElement)('a');
    var frag = document.createDocumentFragment();
    return (
      typeof frag.cloneNode == 'undefined' ||
      typeof frag.createDocumentFragment == 'undefined' ||
      typeof frag.createElement == 'undefined'
    );
  }());

  } catch(e) {
  // assign a false positive if detection fails => unable to shiv
  supportsHtml5Styles = true;
  supportsUnknownElements = true;
  }

  }());

  /--------------------------------------------------------------------------/

  /**

  • Creates a style sheet with the given CSS text and adds it to the document.
  • @private
  • @param {Document} ownerDocument The document.
  • @param {String} cssText The CSS text.
  • @returns {StyleSheet} The style element.
    */
    function addStyleSheet(ownerDocument, cssText) {
    var p = ownerDocument.createElement('p'),
    parent = ownerDocument.getElementsByTagName('head')[0] || ownerDocument.documentElement;

  p.innerHTML = 'x<style>' + cssText + '</style>';
  return parent.insertBefore(p.lastChild, parent.firstChild);
  }

  /**

  • Returns the value of html5.elements as an array.
  • @private
  • @returns {Array} An array of shived element node names.
    */
    function getElements() {
    var elements = html5.elements;
    return typeof elements == 'string' ? elements.split(' ') : elements;
    }

  /**

  • Extends the built-in list of html5 elements
  • @memberOf html5
  • @param {String|Array} newElements whitespace separated list or array of new element names to shiv
  • @param {Document} ownerDocument The context document.
    */
    function addElements(newElements, ownerDocument) {
    var elements = html5.elements;
    if(typeof elements != 'string'){
    elements = elements.join(' ');
    }
    if(typeof newElements != 'string'){
    newElements = newElements.join(' ');
    }
    html5.elements = elements +' '+ newElements;
    shivDocument(ownerDocument);
    }

  /**

  • Returns the data associated to the given document
  • @private
  • @param {Document} ownerDocument The document.
  • @returns {Object} An object of data.
    */
    function getExpandoData(ownerDocument) {
    var data = expandoData[ownerDocument[expando]];
    if (!data) {
    data = {};
    expanID++;
    ownerDocument[expando] = expanID;
    expandoData[expanID] = data;
    }
    return data;
    }

  /**

  • returns a shived element for the given nodeName and document
  • @memberOf html5
  • @param {String} nodeName name of the element
  • @param {Document|DocumentFragment} ownerDocument The context document.
  • @returns {Object} The shived element.
    */
    function createElement(nodeName, ownerDocument, data){
    if (!ownerDocument) {
    ownerDocument = document;
    }
    if(supportsUnknownElements){
    return ownerDocument.createElement(nodeName);
    }
    if (!data) {
    data = getExpandoData(ownerDocument);
    }
    var node;

  if (data.cache[nodeName]) {
  node = data.cache[nodeName].cloneNode();
  } else if (saveClones.test(nodeName)) {
  node = (data.cache[nodeName] = data.createElem(nodeName)).cloneNode();
  } else {
  node = data.createElem(nodeName);
  }

  // Avoid adding some elements to fragments in IE < 9 because
  // Attributes like name or type cannot be set/changed once an element
  // is inserted into a document/fragment
  // Link elements with src attributes that are inaccessible, as with
  // a 403 response, will cause the tab/window to crash
  // * Script elements appended to fragments will execute when their src
  // or text property is set
  return node.canHaveChildren && !reSkip.test(nodeName) && !node.tagUrn ? data.frag.appendChild(node) : node;
  }

  /**

  • returns a shived DocumentFragment for the given document
  • @memberOf html5
  • @param {Document} ownerDocument The context document.
  • @returns {Object} The shived DocumentFragment.
    */
    function createDocumentFragment(ownerDocument, data){
    if (!ownerDocument) {
    ownerDocument = document;
    }
    if(supportsUnknownElements){
    return ownerDocument.createDocumentFragment();
    }
    data = data || getExpandoData(ownerDocument);
    var clone = data.frag.cloneNode(),
    i = 0,
    elems = getElements(),
    l = elems.length;
    for(;i<l;i++){
    clone.createElement(elems[i]);
    }
    return clone;
    }

  /**

  • Shivs the createElement and createDocumentFragment methods of the document.
  • @private
  • @param {Document|DocumentFragment} ownerDocument The document.
  • @param {Object} data of the document.
    */
    function shivMethods(ownerDocument, data) {
    if (!data.cache) {
    data.cache = {};
    data.createElem = ownerDocument.createElement;
    data.createFrag = ownerDocument.createDocumentFragment;
    data.frag = data.createFrag();
    }

  ownerDocument.createElement = function(nodeName) {
  //abort shiv
  if (!html5.shivMethods) {
  return data.createElem(nodeName);
  }
  return createElement(nodeName, ownerDocument, data);
  };

  ownerDocument.createDocumentFragment = Function('h,f', 'return function(){' +
  'var n=f.cloneNode(),c=n.createElement;' +
  'h.shivMethods&&(' +
  // unroll the createElement calls
  getElements().join().replace(/[\w-:]+/g, function(nodeName) {
  data.createElem(nodeName);
  data.frag.createElement(nodeName);
  return 'c("' + nodeName + '")';
  }) +
  ');return n}'
  )(html5, data.frag);
  }

  /--------------------------------------------------------------------------/

  /**

  • Shivs the given document.
  • @memberOf html5
  • @param {Document} ownerDocument The document to shiv.
  • @returns {Document} The shived document.
    */
    function shivDocument(ownerDocument) {
    if (!ownerDocument) {
    ownerDocument = document;
    }
    var data = getExpandoData(ownerDocument);

  if (html5.shivCSS && !supportsHtml5Styles && !data.hasCSS) {
  data.hasCSS = !!addStyleSheet(ownerDocument,
  // corrects block display not defined in IE6/7/8/9
  'article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}' +
  // adds styling not present in IE6/7/8/9
  'mark{background:#FF0;color:#000}' +
  // hides non-rendered elements
  'template{display:none}'
  );
  }
  if (!supportsUnknownElements) {
  shivMethods(ownerDocument, data);
  }
  return ownerDocument;
  }

  /--------------------------------------------------------------------------/

  /**

  • The html5 object is exposed so that more elements can be shived and
  • existing shiving can be detected on iframes.
  • @type Object
  • @example
  • // options can be changed before the script is included
  • html5 = { 'elements': 'mark section', 'shivCSS': false, 'shivMethods': false };
    */
    var html5 = {

  /**

  • An array or space separated string of node names of the elements to shiv.
  • @memberOf html5
  • @type Array|String
    */
    'elements': options.elements || 'abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output picture progress section summary template time video',

  /**

  • current version of html5shiv
    */
    'version': version,

  /**

  • A flag to indicate that the HTML5 style sheet should be inserted.
  • @memberOf html5
  • @type Boolean
    */
    'shivCSS': (options.shivCSS !== false),

  /**

  • Is equal to true if a browser supports creating unknown/HTML5 elements
  • @memberOf html5
  • @type boolean
    */
    'supportsUnknownElements': supportsUnknownElements,

  /**

  • A flag to indicate that the document's createElement and createDocumentFragment
  • methods should be overwritten.
  • @memberOf html5
  • @type Boolean
    */
    'shivMethods': (options.shivMethods !== false),

  /**

  • A string to describe the type of html5 object ("default" or "default print").
  • @memberOf html5
  • @type String
    */
    'type': 'default',

  // shivs the document according to the specified html5 object options
  'shivDocument': shivDocument,

  //creates a shived element
  createElement: createElement,

  //creates a shived documentFragment
  createDocumentFragment: createDocumentFragment,

  //extends list of elements
  addElements: addElements
  };

  /--------------------------------------------------------------------------/

  // expose html5
  window.html5 = html5;

  // shiv the document
  shivDocument(document);

  if(typeof module == 'object' && module.exports){
  module.exports = html5;
  }

}(typeof window !== "undefined" ? window : this, document));