伪元素的内容不会在 IE11 中更新

Question

我有以下代码：

someSelector:after {
  content: attr('data-some-data');
  /* ... */
}

一切正常（值反映在屏幕上），直到我将此属性更改为其他属性：

document.querySelector('someSelector').dataset.someData = 'some other value';

屏幕上的内容没有更新，但是当我打开 DOM 资源管理器时，我可以清楚地看到，属性值确实已更新。

我尝试通过浏览器控制台手动设置，但也没有成功。

在其他浏览器中一切正常，当然在 IE 中...你知道...

是否可以强制更新此值以便在更改时反映在屏幕上？

Answer 1

当您修改元素数据集时，IE11 出于某种未知原因不会重绘 DOM。

但如果你必须支持 IE11，请使用 Element.setAttribute 方法，如下所示：

document.querySelector('someSelector').setAttribute('data-some-data', 'some other value');

DOM会重绘，应该更新伪元素内容

Pseudoelement's content doesn't get updated in IE11