javascript - 有没有办法重置:after/:before CSS rules for an element?

Question

有没有办法(稳健地)为新创建的元素重置任何可能的 :after 和 :before CSS 规则？

通常你可以直接在元素上设置你想要重置的样式规则(如果你想确定的话，可以使用 !important)，但我不知道有什么方法可以改变规则仅在元素上的 :after 中定义。

(如果可能的话，只需要与 Chrome 一起工作。)

---

示例 jsFiddle .

:before/:after规则添加的内容影响clientHeight的返回值。

Answer 1

有一个DOM2 API对于这个问题。正确的做法是

document.getOverrideStyle(p, ':after').display = 'none'; // or
document.getOverrideStyle(p, ':after').cssText = 'display: none !important;';

不幸的是，没有浏览器实现它。 ( Webkit returns null ， Firefox has no such method )。看起来 CSS3 甚至都懒得谈论它了，可能是因为用例非常少。

所以你将不得不按照建议做一些 id/className 魔术 above或在 other thread