Internet Explorer 中的 HTML5 元素：运行时插入

我在 Internet Explorer 7 及更高版本中使用 HTML5 元素时遇到问题（未测试 IE6）。我知道默认情况下，如果不使用 Javascript“shiv”，IE 会拒绝识别常见的 HTML5 元素，例如“文章”或“标题”。我使用了 Modernizr (http://www.modernizr.com) 来强制 IE 识别这些元素，以便我可以对它们应用 CSS 样式。到目前为止，一切都很好。

现在的问题是应用程序使用 Javascript 获取某些 HTML 片段（包含 HTML5 标记）并在运行时将它们插入到文档中。在所有其他浏览器上，这可以完美地工作，但在 IE 中，运行时插入的元素无法使用 CSS 进行样式设置。

这是我注入到页面中的标记块的示例：

<article id="block-1" class="block">
  <a href="#">
      <h2>Title</h2>
      <p>Text</p>
      <img src="http://dummyimage.com/100x100" width="100" height="100" alt="placeholder" />
  </a>
</article>

我通过用通用 div 替换文章标签来测试我的理论，这似乎暂时解决了问题，但以语义标记为代价。但我想知道是否还有更多面向未来的解决方法。

也许这会有所帮助：http://jdbartlett.github.com/innershiv/ http://jdbartlett.github.com/innershiv/

innerShiv 是一个函数，它获取 HTML 字符串，将其添加到 IE 中隐藏的文档附加元素，并返回 IE 安全的文档片段或集合。