使用媒体查询在移动设备上仅包含 JS 文件

Using Media Queries To Only Include JS Files On Mobile

本文关键字：包含 JS 文件 媒体 查询 移动      更新时间：2023-09-26

我正在尝试使用media属性仅将我的javascript文件链接到移动设备，而不是桌面设备。

这是我的链接标签：

<script type="text/javascript" media="screen and (max-width : 850px)" src="mobile.js"></script>

但这不起作用，它链接到 JS 到所有内容。

如何仅在满足这些查询条件的情况下链接 JS 文件？

如果我不能，我如何在移动设备上只运行 JS？

使用javascript怎么样？

<script type="text/javascript">
if (screen.width < 980) { 
    document.write('<script type="text/javascript" src="mobile.js"></script>');  
 } 
</script>

有两种方法可以执行此操作：

  1. 页面上已有所有脚本，并在触发断点时调用它们
  2. 仅在需要时加载脚本，一旦遇到断点

无论哪种方式，您都需要这个：

询问.js

这将允许您为 js 添加媒体查询回调。

重量

轻，可以在没有开销的任何地方工作。 

if (document.documentElement.clientWidth < 900) {   // scripts }
相关文章：