disabled = true можно динамически установить на <style>.Почему не статично? - PullRequest
Новая
       1

disabled = true можно динамически установить на <style>.Почему не статично?

8 голосов
/ 22 апреля 2011

Чтобы отключить блоки <style>, все браузеры разрешают установку document.styleSheets[x].disabled = true.Однако только IE позволяет устанавливать это свойство для самого тега <style disabled="true">.Есть ли обходной путь для этого в других браузерах?Кажется странным, что что-то динамическое не может быть сделано статически.

Ответы [ 4 ]

6 голосов
/ 22 апреля 2011

Элемент style не имеет действительного атрибута с именем disabled.Начиная с спецификации HTML : 

<!ELEMENT STYLE - - %StyleSheet        -- style info -->
<!ATTLIST STYLE
  %i18n;                               -- lang, dir, for use with title --
  type        %ContentType;  #REQUIRED -- content type of style language --
  media       %MediaDesc;    #IMPLIED  -- designed for use with these media --
  title       %Text;         #IMPLIED  -- advisory title --
  >

Однако интерфейс DOM HTMLStyleElement имеет такое свойство.Начиная с спецификации DOM : 

interface HTMLStyleElement : HTMLElement {
           attribute boolean         disabled;
           attribute DOMString       media;
           attribute DOMString       type;
};

Не путайте элемент HTML с его аналогом в DOM. "странно, что что-то динамическое не может быть выполнено статически." Спецификации HTML и DOM были созданы для решения различных проблем.HTML это язык разметки.DOM - это соглашение для представления и взаимодействия с объектами в документе.

2 голосов
/ 01 февраля 2018

Атрибут media может быть установлен как в HTML, так и в Javascript.Идея состоит в том, чтобы установить атрибут media, чтобы тег стиля не применялся ни к одному устройству, чтобы отключить его.

Я думаю, что установка его на что-то недопустимое, например media="bogus" или media="none", рискованнопоскольку браузер может решить просто проигнорировать предикат и применить стиль ко всем типам мультимедиа.К счастью, установка максимальной ширины экрана в один пиксель вполне допустима, и в моей книге это почти то же самое, что отключить тег стиля. 

 var style = document.querySelector("#my-style");

 document.querySelector("#btn-style").addEventListener("click",function() {
    style.removeAttribute("media");
 });

 document.querySelector("#btn-unstyle").addEventListener("click",function() {
    style.setAttribute("media", "max-width: 1px");
 });
<style id="my-style" media="max-width: 1px">
   p { color: red }
</style>

<p>Styled if you click below.</p>

<button id="btn-style">Style that p</button>

<button id="btn-unstyle">Unstyle that p</button>
2 голосов
/ 22 апреля 2011

Один простой вариант - сделать его альтернативной таблицей стилей с заголовком, отличным от основного набора таблиц стилей. Это сделает браузеры по умолчанию отключенными.

2 голосов
/ 22 апреля 2011

Чтобы сделать это статически, просто удалите тег стиля.

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

...