【问题标题】:Finding Defined Media Queries with JavaScript使用 JavaScript 查找已定义的媒体查询
【发布时间】:2011-12-30 18:32:33
【问题描述】:
我的挑战是搜索网页以尝试找到所有已定义的页面断点,例如媒体查询。我不想只查找当前正在应用的媒体查询,而是查找 CSS 文件中定义的所有媒体查询。
我已经浏览了一些,但到目前为止我完全没有运气。我知道这是可能的,因为像 Respond.js 这样的库必须这样做,但是查看源代码后,我并不完全确定他们是如何做到的,或者最好的方法。
非常感谢任何建议,
谢谢:)
【问题讨论】:
标签:
javascript
css
media-queries
【解决方案1】:
respond.js 执行此操作的方式是加载 css 文件本身,而不依赖于 DOM 向 JavaScript 公开的内容。
浏览器都支持其他东西,甚至它们支持的东西也不总是公开。
例如,Internet Explorer 只公开常规 styleRules(没有 @imports 或类似的东西)。
所以不要往那个方向走。
我会建议一种类似于 respond.js' 的方式并以这种方式获取媒体查询。
希望对您有所帮助,PM5544...
【解决方案2】:
只是一个猜测,你可以尝试解析<link>标签,获取.css文件的url并通过AJAX请求它们(如果在同一个域中),一旦你收到.css文件的正文,你可以解析它并找到媒体查询。