JQuery - 检测对 CSS 'display: table-row-group' 的支持答案

【问题标题】：JQuery - Detect support for CSS 'display: table-row-group'JQuery - 检测对 CSS 'display: table-row-group' 的支持
【发布时间】：2011-04-09 12:41:49
【问题描述】：

因此，Internet Explorer display 属性（以及其他属性）的标准 table-row 和 table-row-group 值。我不愿使用 JQuery 的 browser detection features，因为这些已被弃用。如何在不解析浏览器/用户代理字符串的情况下检测 JQuery 中的table-row-group 支持？也就是说，我如何检测功能的存在而不是特定浏览器的存在？

【问题讨论】：

标签： javascript jquery css internet-explorer

【解决方案1】：

我不相信使用 Javascript 可以直接检测对 CSS 属性的支持。如果这是真的，我有两个建议：

在隐藏的 div 中插入两个元素，一个带table-row，一个不带。看看有没有高宽差。如果是这样，计算高度或宽度，找出支持它的浏览器和不支持它的浏览器之间的差异。
即使不推荐使用 jQuery 的浏览器检测，您也可以在本地托管以下脚本：

http://www.tvidesign.co.uk/blog/CSS-Browser-detection-using-jQuery-instead-of-hacks.aspx

我使用它，我喜欢它！它将两个类（例如，“.browserIE7 和 .browserIE”）添加到 body 标签，以便您可以使用 Javascript (if $('body').hasClass('browserIE7')...) 或 CSS (.browserIE7.div {...)

祝你好运！

编辑

也许使用 Javascript...第三个选项是可能的：http://perfectionkills.com/feature-testing-css-properties/ 虽然我没有阅读文章或使用他的建议。

【讨论】：

【解决方案2】：

如果 CSS 属性检测不起作用，我建议使用如下 IE 条件：

<!--[if lte IE 7]>
        <script type="text/javascript">
            var ie7 = true;
        </script>
<![endif]--> 

<!--[if lte IE 6]>
         <script type="text/javascript">
            var ie6 = true;
        </script>
<![endif]-->

或者类似的东西......如果你想让你的脚本确定你使用的浏览器并且不想解析用户代理字符串。

如果您只想将 CSS 定向到特定浏览器，那么显然只需在条件句中放置一个指向 IE 样式表的链接。我绝不建议根据 JS 浏览器检测发送不同的 CSS，因为并非所有用户都会启用 JS。

【讨论】：

【解决方案3】：

您可能会发现 Modernizr 很有用。它测试各种各样的 CSS 属性，并根据这些测试将类添加到 <html> 标记。此外，它还添加了与用户代理相关的类。

您可以在其网站上了解有关 Modernizr 的更多信息：http://www.modernizr.com/

【讨论】：