html5特性检测--检测技术

《html5特性检测--检测技术》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、HTML5中国：http://www.html5cn.orgHTML5特性检测--检测技术4种基本技术可以用于检测浏览器是否支持某种html5特性，从简单到复杂的顺序：1、检测全局对象（window或navigator）是否拥有特定的属性。如果浏览器支持地理位置API的话，全局的navigator对象上会有一个名为geolocation的属性，反之，navigator对象上该属性的值为undefined:functionsupports_geolocation(){ return!!naviga

2、tor.geolocation; } 如果不想写这个方法的话，可以使用modernizr库提供的方法检测浏览器是否支持地理位置API：if(Modernizr.geolocation){dosomething} else{dosomething} 2、创建一个元素，然后检测该元素的DOM对象是否拥有特定的属性。以检测画布特性为例。functionsupports_canvas(){ return!!document.createElement_x_x('canvas').getContext; 

3、} return!!document.createElement_x_x('canvas').getContext;这一句是创建一个虚拟的元素，这个元素永远不会附加到页面上，因此对于用户来说它永远是不可见的。紧接着测试该元素是否拥有getContext()方法，这个方法只有当浏览器支持canvasAPI时才会存在，最后用双重否定!!来强制这个检测方法返回一个布尔值如果不想写这个方法的话，可以使用modernizr库提供的方法检测浏览器是否支持canvasAPI：if(Modern

4、izr.canvas){dosomething} else{dosomething}  3、创建一个元素，然后检测该元素的DOM对象是否拥有特定的方法，同时调用这个方法并检查它的返回值。以检测支持视频格式为例。functionsupports_video(){   return!!document.createElement_x_x('video').canPlayType; } 如果浏览器支持HTML5video,被创建

5、方法，反之，该对象只会拥有一些所有元素都有的公共属性。如果不想写这个方法的话，可以使用modernizr库提供的方法检测浏览器是否支持videoAPI：if(Modernizr.video){dosomething} else{dosomething} 4、创建一个元素，给这个元素的DOM对象设定特定的属性值，然后检查浏览器是否保留了该属性值。以检测支持的类型为例。首先创建一个虚拟的元素：vari=document.createElement_x_x("input")

6、;元素默认为文本类型，接下来将元素的类型设置成要检测的类型：HTML5中国：http://www.html5cn.orgi.setAttribute("type","color");如果浏览器支持次特定的输入框类型，那么设置的type值会被保留，反之，依然为文本类型。returni.type!=="text"; if(!Modernizr.inputtypes.date){   //浏览器有没有提供，type="date">原生支持 } 更多详情可访问html5中国：http://

7、www.html5cn.org