[英]Javascript write new javascript links based on screen size
我试图弄清楚如何编写以下内容,仅当窗口宽度大小为480
或更小时。
<%= javascript_include_tag 'idangerous.js' %>
<%= javascript_include_tag 'custom.js' %>
<%= stylesheet_link_tag 'idangerous.swiper' %>
到目前为止,我所拥有的是以下内容:
<script type="text/javascript">
$(function () {
var width = $(window).width();
if (width <= 480) {
_output.innerHTML = "<%= javascript_include_tag 'idangerous.js' %>";
_output.innerHTML = "<%= javascript_include_tag 'custom.js' %>";
_output.innerHTML = "<%= stylesheet_link_tag 'idangerous.swiper' %>";
}
});
</script>
但是,这不起作用,我不想使用document.write
。 我也尝试在标题中附加,但我希望将其写在页面底部,在</body>
之前
任何其他有效的简化解决方案?
由于浏览器 HTML 解析器将看到字符串中的</script>
并将其解释为脚本元素的结尾,因此您不能将脚本标记附加为字符串(至少在不拆分字符串的情况下不能),您将必须动态创建它们
if (window.clientWidth <= 480) {
var scripts = ['idangerous.js', 'custom.js', 'idangerous.swiper'];
for (var i=0; i<scripts.length; i++) {
addScript(scripts[i])
}
}
function addScript(src) {
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = src;
head.appendChild(script);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.