在Javascript中,是否可以将变量传递给<script>"src"参数？

Question

Javascript中是否可以通过src参数传递变量？即.

<script type="text/javascript" src="http://domain.com/twitter.js?handle=aplusk" />`

我想twitter.js查看是否在执行我需要它之前传递了"句柄"并将其响应返回到原始页面调用twitter.js.

我最初创建了一个函数twitter.js,执行以下操作:

function getHandle() {
  var vars = [], hash, username;
  var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');

  for(var i = 0; i < hashes.length; i++) {
    hash = hashes[i].split('=');
    if (hash[0] == 'handle') 
     username = hash[1];
  }

  return username;
}

问题,这是有道理的,window.location.href不会对我正在调用的文件起作用 <script src="" />

谢谢!

Answer 1

我可以在这看到两个解决方案.

首先:您可以在托管twitter.js的服务器上处理这些GET参数,以便动态更改js文件.例如,您的文件是:

var handle = {{ handle }};

并且您的服务器以某种方式处理该文件,替换该twitter.js模板文件,具体取决于发送的请求.

第二个选项是在加载twitter.js的页面上设置全局变量,如下所示:

<script type="text/javascript">
    window.twitter_js_handle = 'aplusk';
</script>
<script type="text/javascript" src="http://domain.com/twitter.js" />

在twitter.js中:

var handle = window.twitter_js_handle || null;

Answer 2

我使用以下模式将查询变量转换<script src="script.js?foo=bar&baz=zing"></script>为对象包含键:值对.代码放在script.js的顶部:

var getVars = {};

(function(){
    var scripts, currentScript, queryString;

    scripts = document.getElementsByTagName('script');
    currentScript = scripts[ scripts.length - 1 ];
    queryString = currentScript.getAttribute('src').replace(/[^\?]*/,'').split('&');
    for(var i=0;i<queryString.length;i++){
        var keVal = queryString[i].split('=');
        getVars[ keyVal[0] ] = keyVal[1];
    }

}());
// console.info( getVars );
// Object { foo="bar", baz="zing"}

这可能不适用于延迟/异步添加的脚本元素,因为它依赖于立即执行代码.