如何在 Safari Reader 中隐藏某些页面元素？

Question

我的页面上有社交链接。在 reader 模式下，它们正在显示，我想隐藏它们。社交链接块如下所示：

<div class="social-likes">
<span class="social-likes__item">
    <span class="social-likes__button" data-social="facebook">
        <svg class="social-likes__icon social-likes__icon_facebook"><use xlink:href="/images/m/svg/sprite.svg#social-likes__icon_facebook"></use></svg>
    </span>
    <span class="social-likes__counter">0</span>
</span>
<span class="social-likes__item">
    <span class="social-likes__button" data-social="vkontakte">
        <svg class="social-likes__icon social-likes__icon_vkontakte"><use xlink:href="/images/m/svg/sprite.svg#social-likes__icon_vkontakte"></use></svg>
    </span>
    <span class="social-likes__counter">0</span>
</span>
<span class="social-likes__item">
    <span class="social-likes__button" data-social="twitter">
        <svg class="social-likes__icon social-likes__icon_twitter"><use xlink:href="/images/m/svg/sprite.svg#social-likes__icon_twitter"></use></svg>
    </span>
    <span class="social-likes__counter">0</span>
</span>

不幸的是，页面内容是从DB加载的，所以我只能使用一些CSS或JS技巧（因此无法更改页面源代码）。

我查看了 Safari Reader source code 并尝试将一些 class 或 ID 名称添加到社交链接容器中，这些名称在 reader 的代码中标记为 'negative'并且不应显示 - 例如，'#disqus_thread'、'.instapaper_ignore' - 没有结果. 我也在测试页上尝试过这个（所以这个 classes 包含在页面源代码中）——同样的结果。

有什么解决办法吗？

Answer 1

我找到了解决办法。应该隐藏的元素被包裹在

<aside class="instapaper_ignore">...</aside>

看起来 reader 算法赋予标签不同的权重。

如何在 Safari Reader 中隐藏某些页面元素？

How certain page element can be hidden in Safari Reader?

html

javascript

css

safari