根据屏幕宽度附加
我需要这样简单的东西:
<!-- if (screen.width
但是我需要来追加
而不是重定向
那可能吗?
看到它的实际效果: 简短演示
您可以定义一个函数,如下所示:
function appendScript(pathToScript) { var head = document.getElementsByTagName("head")[0]; var js = document.createElement("script"); js.type = "text/javascript"; js.src = pathToScript; head.appendChild(js); }
然后使用适当的参数(例如根据屏幕大小)调用它,如下所示:
appendScript("path/to/file.js");
如果您还需要从head
删除脚本(例如,基于其’src’属性),您可以定义一个函数,如下所示:
function removeScript(pathToScript) { var head = document.getElementsByTagName("head")[0]; var scripts = head.getElementsByTagName("script"); for (var i = 0; i < scripts.length; i++) { var js = scripts[i]; if (js.src == pathToScript) { head.removeChild(js); break; } } }
然后使用适当的参数(例如根据屏幕大小)调用它,如下所示:
removeScript("path/to/file.js");
另请注意,使用screen.width
返回用户屏幕的大小(而不是浏览器窗口的宽度)。
如果你需要获得窗口大小,你可以使用$(window).width()
(使用jQuery)。 如果你想要一个“jQuery-free”解决方案,请看一下这个跨浏览器替代方案的答案 。
您可以创建一个脚本元素并设置其src属性,然后将其附加到文档的头部
var script = document.createElement('script'); script.src = 'js.js'; document.head.appendChild(script)
如果想支持IE <9则代替document.head
使用document.getElementsByTagName('head')[0]
使用yepnope
你可以做类似的事情
yepnope([{ test: 768 >= screen.width // devices 768 and up , yep: [ "site/js/jquery.stickyPanel.min.js" ] , complete: function () { alert('complete'); } }]);
它会自动附加文件