Fe-interview: [html] 第160天 怎么检测浏览器是否支持HTML5特性？

Created on 22 Sep 2019  ·  5Comments  ·  Source: haizlin/fe-interview

第160天 怎么检测浏览器是否支持HTML5特性？

html
Source
picture haizhilin2013

Most helpful comment

  • 检测window中是否拥有HTML5特有的属性
'localStorage' in window;
  • 创建一个HTML5特有的元素，检测是否存在该元素的特有属性
function supportCanvas() {
    return !!document.createElement('canvas').getContext;
}
  • 创建一个元素，然后检测这个元素的DOM对象是否拥有特定方法，同时调用这个方法并检查这个返回值
function supportVideoType() {
    return document.createElement("video").canPlayType('video/mp4;codecs="avc1.42E01E,mp4a.40.2"');
}
  • 创建一个元素，然后检测该元素的DOM对象设定的属性值，然后检查浏览器是否保留了该属性值
function supportColorType () {
    var i = document.createElement("input")
    // HTML支持`color`
    i.setAttribute("type", "color");
    console.log(i.type)
    return i.type !== "text"//text为默认的type
}
picture vkboo on 23 Sep 2019
👍8 🎉2

All 5 comments

写一个canvas 里面可以写一行文字例如：你的浏览器不支持html5，这样的
或者是用