javascript - 将 HTML5/CSS3 行为引入旧浏览器 (IE) 的 Js 脚本分解

标签 javascript html css compatibility

有一个 few questions涵盖了这一点,但它们都没有解决我想知道的所有库/问题。那里有很多脚本,我很困惑到底哪个脚本做了什么,以及每个脚本带来什么样的性能问题。

这是我目前的理解:

  • Respond.js : 媒体查询支持回到 IE6。
  • Selectivizr : CSS 选择器和伪选择器?
  • HTML5shiv : 将 HTML5 元素添加回 IE6
  • CSS3Pie : 将某些 css3 属性添加回 IE6:border-radius、box-shadow、linear-- gradients。
  • IE9.js : png 透明度返回到 IE5.5,“许多其他 html/css 问题”???
  • Modernizr :据我了解,它是对高级功能支持的检测,当检测到/未检测到功能时,您可以自行决定如何操作。虽然我知道它为所有浏览器添加了 HTML5 元素
  • HTML5 Boilerplate : css normalizer,不太确定还有什么以及它与其他人的关系。
  • Head.js : 网站声称它可以做所有事情,但我不太确定它除了加载据称非常优越的 js 方法之外还能做什么(我想对我来说这似乎好得令人难以置信)。

前 4 个我很确定我理解,后 4 个我有点不清楚他们到底在做什么。我也很想知道它们的可靠性以及它们如何影响页面加载等,以及是否需要对 html 和 css 进行更改。

我很好奇许多不同的行为,我知道它们存在兼容性问题,以及更大的合并库是否为它们提供任何支持:css3-selectors/classes(例如,是否包括悬停在链接以外的东西上? )、透明 png、媒体查询、html5 元素(以及音频和视频呢)?

我意识到这是一个非常复杂的问题。我想知道是否有一个很好的资源可以打破这一切?否则我很想知道这些不同的工具在它们所涵盖的内容方面如何相互叠加(例如,我知道如果你有 modernizr,你不需要 html5shiv,但我不知道其他交叉问题),以及是否有任何我遗漏的重要工具。

最佳答案

据我所知,这些事情的最佳列表由编写 Modernizr 的人维护。 .

他们的 Wiki 上有一个页面,其中列出了几乎所有已知的“polyfill”(正如他们所知)。看这里:https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills

请记住,无论这些 hack 多么聪明,总会有一个根本问题,即他们试图强制浏览器做它不支持的事情。您通常可以使用其中的一两个来逃脱,但您尝试做的越多,性能就会越差(而且 IE8 本来就不是很快!)

此外,当然,它们中的大多数只会给出实际功能的近似值。它们中的大多数都有无法避免的缺点和问题(CSS3Pie 站点的“已知问题”页面就是一个很好的例子)。

关于javascript - 将 HTML5/CSS3 行为引入旧浏览器 (IE) 的 Js 脚本分解,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7558951/

相关文章:

javascript - jQuery 事件按键 : Which key was pressed? A-Z, & @

javascript - Sonar Javascript 插件错误 : "Fail to decorate" and "does not contain any file in its source folders"

javascript - 动态 HTML 表上的删除、编辑和保存行功能

HTML5 磁贴引擎

jquery - 当我使用 id=footer 时,Bootstrap 模式显示为禁用

ios - 输入 radio 不适用于 ios 触摸设备(vue js 应用程序)

javascript - 如何转换语义-UI-日历中的日期格式?

javascript - Vue.js Safari 移动和兼容性

html - div 高度不会增加以包围子内容

css - 更改可点击框中文本的颜色