什么是CSS媒体查询的JavaScript等价物

What's the JavaScript equivalent of CSS Media Queries?

本文关键字：JavaScript 等价物 查询 媒体 CSS 什么      更新时间：2023-09-26

我在使用媒体查询将CSS定位到特定的浏览器大小/或上下文方面经验丰富，但现在我对使用JS执行此操作感兴趣，基本上可以更好地控制我的脚本在不同功能的浏览器上的运行方式。

我不是在问如何在 JS 中复制媒体查询的功能，而是更多控制哪些代码在哪些浏览器上运行的方法是什么？

是否有一种方法或系统可以在不诉诸检测浏览器的情况下为我提供此控件？

多个if语句：

if ($(window).width() > 900)) {
   // do something here
}
实际上没有什么

可以控制代码的运行方式，除非您在检测希望代码运行的情况并将内容包装在 if 块中做一些基础工作。您可以在 HTML 中使用条件语句，在生成服务器代码中使用 if 块，也可以在 js 本身中使用条件语句。

不需要

4+ 个间接级别。

var width = typeof innerWidth === 'undefined' ? document.body.clientWidth : innerWidth;
if (width > 900) {
  // do something
}

这允许您为响应式设计定义断点，然后在浏览器进入和/或退出该断点时触发自定义事件。

http://xoxco.com/projects/code/breakpoints/

相关文章：