【问题标题】:Does IOS Safari support Shadow DOM?IOS Safari 是否支持 Shadow DOM?
【发布时间】:2017-09-02 08:38:40
【问题描述】:

我的应用程序能够渲染 Shadow DOM,但检查器无法显示影子根。谁能帮我解决这个问题?

【问题讨论】:

    标签: mobile-safari web-component shadow-dom safari-web-inspector


    【解决方案1】:

    这取决于您指的是哪个 Shadow DOM——Shadow DOM v0 或 Shadow DOM v1。

    http://caniuse.com/#feat=shadowdomv1http://caniuse.com/#feat=shadowdom

    没有任何版本的 Safari 支持 Shadow DOM v0。但就 iOS Safari 而言,10.2+ 版本支持 Shadow DOM v1,但有以下限制:

    某些 CSS 选择器不起作用 (:host > .local-child) 并且样式化开槽内容 (::slotted) 有问题。

    Shadow DOM v0 和 v1 的区别见https://hayato.io/2016/shadowdomv1/


    2020 年 7 月 31 日更新:影子根不再隐藏在 Safari Web Inspector 中,而是始终显示,无论如何。见https://trac.webkit.org/changeset/253706/webkit/


    在旧版本的 Safari 中,Web Inspector 默认不显示阴影根,需要单击一个按钮才能显示阴影根;它看起来像这样:


    在 Inspector UI 中,它位于选项卡下方右侧的工具栏中。激活后变为蓝色:

    【讨论】:

    • Shadow DOM V1 是肯定的。不幸的是,我在检查器中没有看到影子根。我必须打开一些标志吗?
    • 查看我刚刚添加到答案中的图片
    • 这些括号现在不见了。知道他们去了哪里吗?
    • @DmitryMinkovsky 阴影根不再隐藏在当前的 Safari Web Inspector 中——因此不再需要按钮来显示它们,因为它们现在总是显示出来,无论如何。见trac.webkit.org/changeset/253706/webkit。 (我已经更新了答案以反映这种变化。)
    • 是的,不知何故错过了!非常感谢
    猜你喜欢
    • 1970-01-01
    • 2015-06-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-11-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多