Verwenden Sie JavaScript, um eine Liste mit allen Medienabfragen zu erstellen, die auf die aktuelle Seite angewendet werden.
Ich nehme an, dass dies gefiltert werden müsste, um eingebettete Medienabfragen zu finden, d. h.
<link rel="stylesheet" media="only screen and (min-width: 30em)" href="/css/30em.css">
sowie Medienabfragen in CSS-Dateien, d. h.
@media only screen and (min-width: 320px) {}
Eine Beispielausgabe von dem, was ich suche:
%Vor%Überprüfen Sie das Beispiel hier mit dem Code zum Auflisten der Medienabfragen, die auf die aktuelle Seite angewendet werden
JavaScript:
%Vor%HTML:
%Vor% Sie können MediaQueryList -Objekt verwenden:
Ein MediaQueryList-Objekt verwaltet eine Liste von Medienabfragen in einem Dokument und verarbeitet Benachrichtigungen an Listener, wenn sich die Medienabfragen im Dokument ändern.
Ein verwandter Artikel von Nicholas C. Zakas:
Eine weitere Option ist die Verwendung der Eigenschaft styleSheets des Objekts document .
Bitte überprüfen Sie den Link . Ich benutzte @sureshunivers Code, um zu analysieren und li liste zu erstellen.
%Vor%Beantworten Sie diesen Artikel Reagieren auf Medienabfragen in JavaScript
Tags und Links javascript jquery responsive-design media-queries