Я использовал несколько библиотек (включая мою) для динамической загрузки ресурсов на основе медиазапросов, которые ямы обрисовали в общих чертах в файлах CSS. Например:

В CSS:

  @media screen and (max-width: 480px) {
    .foo {
      display: none;
    }
  }

А также использование загрузчика активов;require.js,modernizr.js и т. д. или с помощьюwindow.matchMedia и связанныеaddListener() функции:

  if (function("screen and (max-width: 480px)")){
    // Load several files
    load(['mobile.js','mobile.css']);
  }

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

Так что я'мы изучали возможность программного доступа к значениям черезdocument.stylesheets, но я'я не уверен, что онидоступны, и, кажется, очень мало документации, чтобы предположить, что они есть.

Я самый дальниймы ищемCSSMediaRule и используяconsole.dir(document.stylesheets) среди прочего, чтобы исследовать объект таблицы стилей.

Но никаких ссылок не делается (в пределахdocument.stylesheets) к действующим правилам медиазапроса, используемым в CSS - только те классы, которые будут применяться в результате медиазапросов ... Что яЯ пытаюсь найти, программно, это: "

экран и (максимальная ширина: 480 пикселей)

Есть ли способ получить доступ к такому запросу CSS Mediaправила через JavaScript / DOM?