Блог

Главная - Вопросы по программированию - Содержимое псевдоэлемента не обновляется в IE11

Содержимое псевдоэлемента не обновляется в IE11

#css #internet-explorer-11 #css-content

#css #internet-explorer-11 #css-content

Вопрос:

У меня есть следующий код:

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

Все работает нормально (значение отображается на экране), пока я не изменю этот атрибут на что-то другое:

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

Содержимое не обновляется на экране, но когда я открываю DOM Explorer, я могу ясно видеть, что значение атрибута действительно обновляется.

Я пытался установить это вручную через консоль браузера, но также безуспешно.

Все работает корректно в других браузерах, но, конечно, в IE… Вы знаете…

Вопрос

Возможно ли принудительно обновить это значение, чтобы оно отображалось на экране при изменении?

Комментарии:

1. набор данных не является частью движка css. Я думаю, вам нужно использовать прослушиватель событий для какого-то элемента.. Javascript, который использует data-some-data, требует этой функции.

2. @bron вы не понимаете проблему, которую опубликовал OP. CSS «attr» должен иметь возможность считывать любой атрибут, присутствующий в элементе html, и обновлять его всякий раз, когда он изменяется. Это всего лишь странное поведение IE.

Ответ №1:

IE11 по какой-то неизвестной причине не перерисовывает DOM при изменении набора данных элементов.

Но если вам нужно поддерживать IE11, используйте метод Element.setAttribute следующим образом:

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

DOM будет перерисован, и содержимое псевдоэлемента должно быть обновлено.