我正在制作一个供个人使用的js / jquery调试工具。我发现微调我的css媒体屏幕查询很麻烦。所以我提出了一个想法，在窗口调整大小时显示触发的媒体css规则。因此，当css媒体屏幕规则开始时，我需要知道是否可以捕获事件。
注意：我可以轻松读取我的css文件并将它们放入变量并过滤掉所有媒体查询，并将屏幕值与当前窗口大小进行比较。这将起作用但感觉效率不高，因为需要处理所有css文件（和样式标记）。还有其他选择吗？
答案 0 :(得分：1)
我在firefox的dev页面中找到了一些东西。当媒体查询开始（并开始）时， 可能会获得事件。它很有实验性，但它确实有效。
此外，无需使用正则表达式从样式表中筛选出媒体查询。这可以通过访问-with js-文档样式表（不需要再次加载/ ajax表单）并检查CSSrule对象名称来完成。似乎css媒体查询规则有一个其他对象名，然后是普通的css样式规则。我建议阅读this有趣的文章。这一切都在那里解释。
Firefox开发页面
https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList
MediaQueryList对象维护一个媒体查询列表 文档，并处理时向侦听器发送通知 关于文件的媒体查询改变。
这使得观察文档以检测其媒体的时间成为可能 查询会更改，而不是定期轮询值，如果您 需要以编程方式检测媒体查询值的更改 在文件上。
官方规格：
http://dev.w3.org/csswg/cssom-view/#the-mediaquerylist-interface
另一篇（编辑：非常）有趣的文章可以在这里找到：
http://tylergaw.com/articles/reacting-to-media-queries-in-javascript
我想做的工作示例可以在这里找到!!
http://tylergaw.github.io/media-query-events/
另一个有趣的项目！