如何检查浏览器是否支持shadow DOM

Question

一种方法是检查元素上是否有.shadowRoot属性,但是我需要在呈现页面之前返回一个布尔值.

Answer 1

一个简单的功能测试是:

if (document.head.createShadowRoot || document.head.attachShadow) {
    // I can shadow DOM
} else {
    // I can't
}

即使您在head部分中包含脚本并且假设在您之前没有添加恶意脚本(这是一个安全的假设),这也会起作用.

目前,Chrome,Opera和衍生浏览器(如Android浏览器)都支持它.有关更多信息,请访问:http://caniuse.com/#feat=shadowdom