如何防止在 iOS 和 Android 设备上加载 javascript 和 css 文件？答案

【问题标题】：How to prevent to load a javascript and css file on iOS and Android devices?如何防止在 iOS 和 Android 设备上加载 javascript 和 css 文件？
【发布时间】：2011-12-06 14:20:28
【问题描述】：

如何防止在 iOS 和 Android 设备上加载 js 文件？我正在为所有设备制作一个网站。我想为桌面用户添加一些特定的 JavaScript+CSS 效果，而不是 iPhone、iPad 和 Android、Windows 手机用户。那么我可以停止加载一些特定的 JavaScript 和 CSS 文件以在特定设备上加载吗？

【问题讨论】：

标签： javascript jquery css user-agent

【解决方案1】：

您可以使用Yepnope 库有条件地加载javascript 文件。 http://detectmobilebrowsers.com/ 有库来检测网站是否加载到移动设备上。因此，您可以将两者结合起来。

【讨论】：

赞成：由于提问者想要选择性地加载资源，仅 CSS 媒体查询是不够的。像往常一样，应该避免通过用户代理字符串检测特定设备，否则可能依赖 Modernizr 等功能检测库。

【解决方案2】：

您可以尝试检测用户代理，然后动态加载您想要的脚本/css。

【讨论】：

【解决方案3】：

对于 css，你真的应该尝试媒体查询。例如，如果你想为 iPhone 设置 CSS，你可以使用：

/* Portrait */
@media screen and (max-width: 320px) {
    body { opacity: 1; }
}
/* Landscape */
@media screen and (min-width: 321px) and (max-width: 480px) {
    body { opacity: 0; }
}

但是对于桌面来说也是一样的，你选择你的最小宽度和最大宽度。

对于Js，我建议你阅读这个：http://www.quirksmode.org/blog/archives/2010/08/combining_media.html

【讨论】：

我已经在使用媒体查询了。我的问题是加载 css 和 js 文件。
也许你可以试试if (screen.width < 600) { // don’t download complicated script // use low-source images instead of full-source ones } 你应该按照我刚刚给你的网址阅读JavaScript 配对。
iPad 处于横向模式，许多桌面显示器具有相同的分辨率 1024x768
我现在发现的唯一资源告诉我没有“好”的解决方案。我刚刚找到了一篇关于此的好文章，我认为您应该阅读：hand-interactive.com/resources/detect-mobile-javascript.htm 或者，您可以查看 Yepnope 库是否适合您的需求

【解决方案4】：

使用您的 JavaScript 文件中的媒体查询调用您的 CSS 文件。

【讨论】：