在脚本标记的源属性中使用全局变量

Question

我运行以下JavaScript代码，该代码给出我的来自客户端的参数列表以及调用Google融合表SQL语句，该语句将其响应提供给回调函数handleResponse。

<script> 

    // get parameter list 
    var url = window.location.toString(); 
    url.match(/\?(.+)$/); 
    var params = RegExp.$1; 
    var params = params.split("&"); 
    var queryStringList = {}; 
    for(var i=0;i<params.length;i++) 
    { 
    var tmp = params[i].split("="); 
    queryStringList[tmp[0]] = unescape(tmp[1]); 
    } 

    // callback function 
    function handleRespose(response) 
    { 
    } 
</script> 
<script src="https://www.googleapis.com/fusiontables/v1/query?sql=SELECT data from table&key=myKey&callback=handleRespose"></script> 

我的问题是，我该如何使用queryStringList这样的：

<script src="https://www.googleapis.com/fusiontables/v1/query?sql=SELECT " + queryStringList["data1"] + "from table&key=myKey&callback=handleRespose"></script> 

Answer 1

你必须加载从JavaScript新的JS文件。例如：

var fusiontables = document.createElement("script"); 
fusiontables.setAttribute("src", "https://www.googleapis.com/fusiontables/v1/query?sql=SELECT " + queryStringList["data1"] + "from table&key=myKey&callback=handleRespose"); 

document.getElementsByTagName("head")[0].appendChild(fusiontables); 

这将编程创建一个新的<script>元素，并将其注入到该页面。请注意，该变量不需要是全局的。

如果你把这个功能，你可以使用它像这样：

// loadscript.js 
function loadscript(url) { 
    var script = document.createElement("script"); 
    script.setAttribute("src", url); 
    document.getElementsByTagName("head")[0].appendChild(script); 
} 

<!-- page.html --> 
<script src="loadscript.js"></script> 
<script> 
    var queryStringList = {}; 
    // ... Do stuff to fill queryStringList ... 

    var url = "https://www.googleapis.com/fusiontables/v1/query?sql=SELECT " + queryStringList["data1"] + "from table&key=myKey&callback=handleRespose"; 
    loadscript(url); 
</script>