Question

我想将async属性添加到我的javascript包含文件中，但是只有当useragent与特定字符串匹配时才会这样。

我不能做这个服务器端，因为页面“可能”被缓存在服务器端，所以我需要用javascript检测useragent并相应地异步。

目前我这样做：

<script id="myscript" type="text/javascript">
if(navigator.userAgent.match(/development/i)){
    document.write("<script type='text\/javascript' src='\/\/localhost\/static\/js\/header.min.js' async><\/script>\n");
} else { 
    document.write("<script type='text\/javascript' src='\/\/localhost\/static\/js\/header.min.js'><\/script>\n");
}
</script>

我现在想要实现的是用其他东西替换document.write ，如果useragent匹配我的字符串，可能只需添加async属性，并使其为该useragent加载异步。

我还考虑过将其反转，所以默认情况下我会使用async加载标记，如果useragent与我的字符串不匹配则将其删除（但另一种方式更可取）。

这似乎也没有异步加载文件？

<script id="myscript" src="//localhost/static/js/header.min.js"></script>
<script type="text/javascript">
if(navigator.userAgent.match(/development/i)){
    document.getElementById("myscript").setAttribute("async", "async");
}
</script>

我还需要脚本来保持对其他用户的渲染阻止，并将其添加到脚本出现在html中的确切位置。我相信这也行不通：

var scriptEle = document.createElement("script");
scriptEle.setAttribute("type","text/javascript");
scriptEle.setAttribute("src","//localhost/static/js/header.min.js");
if(navigator.userAgent.match(/development/i)){
scriptEle.setAttribute("async","async");
}
document.getElementsByTagName("head")[0].appendElement(scriptEle);

我对javascript不是很熟练，所以如果有人有更好的想法......谢谢。

Answer 1

您可以尝试在设置（或不设置）async后设置src属性：

<script id="myscript" src=""></script>

<script type="text/javascript">
   var myScript = document.getElementById("myscript");

   if(navigator.userAgent.match(/development/i)){
       myScript.setAttribute("async", "async");
   }
   myScript.setAttribute("src", "/static/js/header.min.js");
</script>

有条件地包含没有document.write的JS文件

1 个答案: