jQuery浏览器功能测试support --样式测试

最新推荐文章于 2020-05-31 17:16:08 发布

guoyouxiang

最新推荐文章于 2020-05-31 17:16:08 发布

阅读量166

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/guoyouxiang/article/details/42422439

本文介绍了一个用于测试浏览器对特定CSS样式的支持性的jQuery插件。该插件通过创建DOM元素并设置样式来检查浏览器是否支持如透明度(opacity)、浮动(cssFloat)等样式属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

样式测试（2.1~2.3）3个

jQuery.support = (function() {

    var support,
        all,
        a,

        div = document.createElement( "div" ),
        documentElement = document.documentElement;

    // Preliminary tests
    div.setAttribute("className", "t");
    div.innerHTML = "   <link/><table></table><a href='/a' style='top:1px;float:left;opacity:.55;'>a</a><input type='checkbox'/>";

    all = div.getElementsByTagName( "*" );
    a = div.getElementsByTagName( "a" )[ 0 ];

    support = {
        // Get the style information from getAttribute
        // (IE uses .cssText instead)
        // 2.1 如果DOM元素内联样式可以通过DOM属性style直接访问，则测试项style为true
        // 在IE6， IE7，IE8中，需要通过style.cssText访问内联样式，此时测试项style为false, 而在其他浏览器重则为true
        style: /top/.test( a.getAttribute("style") ),


        // Make sure that element opacity exists
        // (IE uses filter instead)
        // Use a regex to work around a WebKit issue. See #5145
        // 2.2 如果浏览器支持样式opacity, 则测试项opacity为true
        // 在IE6， IE7， IE8中，不支持样式opacity, 需要用滤镜(alpha filters)代替，此时测试项opacity为false, 而在其他浏览器中则为true
        // 在Opera9.2以及之前的Opera浏览器中，a.style.opacity==="0.5"的结果为false,即认为Opera不迟滞样式Opacity, 而事实上是支持的。
        // jquery-1.2.js的写法：a.style.opacity==="0.5"
        // jquery-1.4.js的写法是： /^0.55$/.test(a.style.opacity)
        opacity: /^0.55/.test( a.style.opacity ),

        // Verify style float existence
        // (IE uses styleFloat instead of cssFloat)
        // 2.3 如果浏览器支持通过style.cssFloat访问样式float, 则测试项cssFloat为true
        // 在IE6，IE7， IE8中，需要通过style.styleFloat访问样式float,此时测试项cssFloat为false, 而在其他浏览器中则为true
        cssFloat: !!a.style.cssFloat,

    };




    return support;
})();