【问题标题】:Correctly supporting the html main element in IE正确支持 IE 中的 html 主元素
【发布时间】:2017-11-26 01:27:29
【问题描述】:

我决定开始使用 html5 main 元素,由于某些浏览器缺乏支持,我过去没有使用过。

我知道您可以通过执行以下操作“解决”缺乏支持的问题:

main {
    display: block;
}

但是我遇到了one answer,它指出您应该执行以下操作以将其添加到 DOM 中:

document.createElement('main');

我的问题是——我们不应该先检查浏览器是否支持main 元素,然后再执行此操作吗?我不确定最好的方法是什么? ....或者这是否真的不需要并且无论支持如何都可以安全地用于所有页面加载?

【问题讨论】:

  • @Rob 您是否阅读了问题或只是阅读了主题行?它们绝不相同。

标签: html dom


【解决方案1】:

链接的答案并不准确。

 document.createElement('main');

仅在 IE9 和更早版本中需要,通过帮助这些版本解析正确地 <main></main> 标记以形成有效的 main 元素。正如链接的答案所说,单独调用它是无害的,所以你可以这样做而不用担心它被不恰当地调用。但是,如果您支持 IE 9 或更早版本,则应在标记中的第一个(通常仅)<main> 标记之前在 JavaScript 中同步包含其包含脚本。

IE10 和 IE11 正确解析标签,但将创建的 main 元素视为内联元素。要使其样式与其他浏览器一样,请使用

main {
    display: block;
}

要考虑的另一个方面是可访问性地标角色。默认情况下,IE 不会暴露主要的地标角色,因此您可能希望使用<main role="main"> 来使其这样做,尽管应该注意的是 HTML5 规范不鼓励这样做。

【讨论】:

  • 很好的答案 - 谢谢!此外,关于可访问性部分的很好的旁注。干杯!
猜你喜欢
  • 1970-01-01
  • 2014-09-11
  • 1970-01-01
  • 2011-08-29
  • 2011-10-26
  • 2013-01-06
  • 2012-01-27
  • 2023-04-10
  • 2013-01-01
相关资源
最近更新 更多