javascript - 检测浏览器支持显示 :inline-block

Question

如何检测浏览器是否支持 CSS 属性 display:inline-block？

Answer 1

好吧，如果你想纯粹通过使用 javascript 检查浏览器的 bavhiour 而不是用户代理嗅探来做到这一点，你可以这样做:

设置测试场景和控制场景。例如，具有以下结构:

• 分区
  • div 内容为“test”
  • div 内容为“test2”

将一个副本插入到文档中，并将两个内部 div 设置为 inline-block，然后将另一个副本插入到文档中，并将两个内部 div 设置为 block 。如果浏览器支持 inline-block，那么包含的 div 将有不同的高度。

备选答案:

您还可以使用 getComputedStyle 查看浏览器如何处理给定元素的 css。因此，理论上，您可以添加一个带有“display: inline-block”的元素，然后检查 computedStyle 以查看它是否存在。唯一的问题:IE 不支持 getComputedStyle。相反，它具有 currentStyle。我不知道 currentStyle 的功能是否相同(大概它的功能类似于我们想要的行为:忽略“无效”值)。