将parameter passing给JavaScript文件
通常我会有一个JavaScript文件，我想要使用这需要某些variables在我的网页中定义。
所以代码是这样的：
<script type="text/javascript" src="file.js"></script> <script type="text/javascript"> var obj1 = "somevalue"; </script> 但是我想要做的是：
<script type="text/javascript" src="file.js?obj1=somevalue&obj2=someothervalue"></script>
我尝试了不同的方法，最好的方法是parsing查询string，如下所示：
var scriptSrc = document.getElementById("myscript").src.toLowerCase();
然后search我的价值观。
我不知道是否有另一种方法来做到这一点，而不build立一个函数来parsing我的string。
你们都知道其他方法吗？
如果可能，我build议不要使用全局variables。 使用命名空间和OOP将parameter passing给对象。
这段代码属于file.js：
var MYLIBRARY = MYLIBRARY || (function(){ var _args = {}; // private return { init : function(Args) { _args = Args; // some other initialising }, helloWorld : function() { alert('Hello World! -' + _args[0]); } }; }());
并在您的HTML文件中：
<script type="text/javascript" src="file.js"></script> <script type="text/javascript"> MYLIBRARY.init(["somevalue", 1, "controlId"]); MYLIBRARY.helloWorld(); </script>
您可以传递具有任意属性的参数。 这适用于所有最新的浏览器。
<script type="text/javascript" data-my_var_1="some_val_1" data-my_var_2="some_val_2" src="/js/somefile.js"></script>
在somefile.js里面，你可以通过这种方式获得variables的值：
……..
var this_js_script = $('script[src*=somefile]'); // or better regexp to get the file name.. var my_var_1 = this_js_script.attr('data-my_var_1'); if (typeof my_var_1 === "undefined" ) { var my_var_1 = 'some_default_value'; } alert(my_var_1); // to view the variable value var my_var_2 = this_js_script.attr('data-my_var_2'); if (typeof my_var_2 === "undefined" ) { var my_var_2 = 'some_default_value'; } alert(my_var_2); // to view the variable value
…等等…
我遇到的另一个想法是分配一个“ID”元素和传递参数作为数据*属性。 结果标签看起来像这样：
<script id="helper" data-name="helper" src="helper.js"></script>
然后，脚本可以使用该编程来定位自己并parsing参数。 鉴于以前的标签，名称可以像这样检索：
var name = document.getElementById("helper").getAttribute("data-name");
我们得到名字=帮手
看看这个url。 这是完美的要求。
http://feather.elektrum.org/book/src.html
非常感谢作者。 为了快速参考，我粘贴了下面的主要逻辑：
var scripts = document.getElementsByTagName('script'); var myScript = scripts[ scripts.length - 1 ]; var queryString = myScript.src.replace(/^[^\?]+\??/,''); var params = parseQuery( queryString ); function parseQuery ( query ) { var Params = new Object (); if ( ! query ) return Params; // return empty object var Pairs = query.split(/[;&]/); for ( var i = 0; i < Pairs.length; i++ ) { var KeyVal = Pairs[i].split('='); if ( ! KeyVal || KeyVal.length != 2 ) continue; var key = unescape( KeyVal[0] ); var val = unescape( KeyVal[1] ); val = val.replace(/\+/g, ' '); Params[key] = val; } return Params; }
这是一个非常匆忙的概念certificate。
我敢肯定，至less有两个地方可以改善，而且我也相信这不会在野外长期存在下去。 任何反馈，使其更具有代表性或可用是值得欢迎的。
关键是为你的脚本元素设置一个id。 唯一的问题是，这意味着你只能调用脚本一次，因为它会查找该ID来提取查询string。 如果脚本循环遍历所有查询元素来查看是否有指向它的元素，则可以修复这个问题，如果是，则使用这种脚本元素的最后一个实例。 无论如何，在代码上：
脚本被称为：
window.onload = function() { //Notice that both possible parameters are pre-defined. //Which is probably not required if using proper object notation //in query string, or if variable-variables are possible in js. var header; var text; //script gets the src attribute based on ID of page's script element: var requestURL = document.getElementById("myScript").getAttribute("src"); //next use substring() to get querystring part of src var queryString = requestURL.substring(requestURL.indexOf("?") + 1, requestURL.length); //Next split the querystring into array var params = queryString.split("&"); //Next loop through params for(var i = 0; i < params.length; i++){ var name = params[i].substring(0,params[i].indexOf("=")); var value = params[i].substring(params[i].indexOf("=") + 1, params[i].length); //Test if value is a number. If not, wrap value with quotes: if(isNaN(parseInt(value))) { params[i] = params[i].replace(value, "'" + value + "'"); } // Finally, use eval to set values of pre-defined variables: eval(params[i]); } //Output to test that it worked: document.getElementById("docTitle").innerHTML = header; document.getElementById("docText").innerHTML = text; };
脚本通过以下页面调用：
<script id="myScript" type="text/javascript" src="test.js?header=Test Page&text=This Works"></script> <h1 id="docTitle"></h1> <p id="docText"></p>
您使用全局variables：-D。
喜欢这个：
<script type="text/javascript"> var obj1 = "somevalue"; var obj2 = "someothervalue"; </script> <script type="text/javascript" src="file.js"></script">
'file.js'中的JavaScript代码可以正常访问obj1和obj2 。
编辑只是想添加，如果'file.js'想要检查是否obj1和obj2甚至已被声明，您可以使用以下函数。
function IsDefined($Name) { return (window[$Name] != undefined); }
希望这可以帮助。
如果你正在使用像jQuery这样的Javascript框架，这可以很容易地完成。 像这样，
var x = $('script:first').attr('src'); //Fetch the source in the first script tag var params = x.split('?')[1]; //Get the params
现在，您可以使用这些参数作为可变参数进行分割。
同样的过程可以在没有任何框架的情况下完成，但需要更多的代码。
可能很简单
例如
<script src="js/myscript.js?id=123"></script> <script> var queryString = $("script[src*='js/myscript.js']").attr('src').split('?')[1]; </script>
然后你可以把查询string转换成如下所示的json
var json = $.parseJSON('{"' + queryString.replace(/&/g, '","').replace(/=/g, '":"') + '"}');
然后可以使用像
console.log(json.id);
很好的问题和创造性的答案，但我的build议是让你的方法paramterized，这应该解决你所有的问题，没有任何花招。
如果你有function：
function A() { var val = external_value_from_query_string_or_global_param; }
您可以将其更改为：
function B(function_param) { var val = function_param; }
我认为这是最自然的方法，你不需要创build关于“文件参数”的额外文档，你也会收到相同的结果。 如果你允许其他开发者使用你的js文件，这个特别有用。
那么，你可以通过任何脚本语言来构buildJavaScript文件，在每个请求中注入你的variables到文件中。 你将不得不告诉你的networking服务器不要静态js-files（使用mod_rewrite就足够了）。
请注意，尽pipe这些js文件不断被修改，但是会失去caching。
再见。
不，你不能通过向JS文件URL的查询string部分添加variables来做到这一点。 如果它编写代码的一部分来parsing困扰你的string，也许另一种方法是json编码你的variables，并把它们放在标签的rel属性中。 我不知道这是如何有效的HTMLvalidation，如果这是你很担心的事情。 然后你只需要find脚本的rel属性，然后json_decode。
例如
<script type='text/javascript' src='file.js' rel='{"myvar":"somevalue","anothervar":"anothervalue"}'></script>
这是不正确的HTML（我不认为），但它似乎工作，如果你在你的网页脚本标记创build一个自定义属性 ：
<script id="myScript" myCustomAttribute="some value" ....>
然后访问javascript中的自定义属性：
var myVar = document.getElementById( "myScript" ).getAttribute( "myCustomAttribute" );
不知道这是否比parsing脚本源string更好或更差。
