如何按浏览器宽度提供不同的javascript文件

Question

所以我想要某些浏览器宽度的某些Javascript文件.我知道@media为每个浏览器宽度和一些设备提供特定的CSS.如何在不使用服务器端调用的情况下为Javascript文件执行类似的操作？

可以使用Javascript根据浏览器宽度调用其他Javascript文件吗？如果是这样,怎么样？

提前致谢.

Answer 1

var scriptSrc = 'js/defaults.js';
if (screen.width <= 800)
  scriptSrc = 'js/defaults-800.js';
else if (screen.width <= 1024)
  scriptSrc = 'js/defaults-1024.js';
var script = document.createElement('script');
script.src = scriptSrc;
var head = document.getElementsByTagName('head')[0];
head.appendChild(script);

也许？根据屏幕分辨率动态加载它们.也可以使用文档大小,浏览器大小等.虽然我不是肯定的,但你真的想要这样做.理想情况下,您应该在设计中处理相对指标(如%或em)并避免这种情况.

Answer 2

虽然我不确定原因，但您始终可以通过 JS 脚本导入 JavaScript 文件。

以下链接提供了一些相关信息。

• http://www.kevinleary.net/loadexternal-javascript-jquery-getscript/
• http://www.stackoverflow.com/questions/1140402/how-to-add-jquery-in-js-file
• http://www.javascriptkit.com/javatutors/loadjavascriptcss.shtml

旁注 - 你为什么要考虑这样做？当然，您可以获取屏幕的分辨率，然后根据这些变量调整计算/内容，而无需更改 JS 文件。有很多不同的分辨率（移动设备、多个显示器、宽屏幕、投影仪等）。用户还可以有效地重新调整浏览器的大小，这不值得。