Question

我想要包含脚本标记，同时为其提供参数。这是我到目前为止所提出的

为脚本URL提供参数（缺点：生成多个JS文件）

<script src="http://example.com/something.js?P=123" type="text/javascript"></script>

在脚本标记中隐藏参数（缺点：与＃1相同）

<script src="http://example.com/scripts/123/something.js" type="text/javascript"></script>

Google Analytics方式（缺点：丑陋，复杂，全局变量）

<script type="text/javascript" charset="utf-8">
  var _something = _something || 123;
  (function() {
    var s = document.createElement('script');
    s.type = 'text/javascript';
    s.src = 'http://example.com/something.js';
    var ss = document.getElementsByTagName('script')[0];
    ss.parentNode.insertBefore(s, ss);
  })();
</script>

Answer 1

最好的事情是在外部脚本中定义事物（函数＆amp; c）但不执行任何操作。然后有一个内联脚本调用外部脚本中定义的函数/方法。

<script src="http://example.com/something.js" type="text/javascript"></script>
<script type="text/javascript">
    something(123);
</script>

Answer 2

如果脚本的执行方式取决于它的调用方式，你可以添加类似你的选项1的参数。

其他方式是：

<script params='{"abc": 123}' src="script.js"></script><!-- params is a non standard, non official attr that the script will read -->

或

<script>var _abc = 123;</script>
<script src="script.js"></script>

甚至

<script src="script.js#abc=123"></script>

我必须同意@outis：总是为每个人加载相同的东西，然后像你/客户想要的那样执行它。

Answer 3

我为我所拥有的跨子域XHR处理程序执行此操作。我称之为：

<script type="text/javascript" src="xd.js#subdomain"></script>

然后在脚本中解析它（使用jQuery）：

$('script').each(function(){
    if((src = this.src).indexOf('xd.js') < 0){ return; }
    xds = src.substr(src.indexOf('#') + 1).split(',');

    // do stuff with xds
});

Answer 4

您的第一个示例不需要生成多个文件。它可以由JavaScript单独使用，通过检测window.location.href并对其进行解析（您可能会发现http://phpjs.org/functions/parse_url:485和http://phpjs.org/functions/parse_str:484之类的内容对此有帮助：var queryString = parse_str(parse_url(window.location.href).query);）。

但是，如果您使用#P=123而非?P=123之类的内容，则不会导致用户再次下载该文件，因此我建议您改为使用{在上面的代码示例中查询“片段”）。

另一种可能性是使用HTML5保留的data- *属性，并在脚本中检测它们的值：

<script src="http://example.com/something.js" data-myOwnAttribute="someValue" data-anotherCustomAttribute="anotherValue"></script>

然后脚本将沿着以下行检测：

(function () {
    function getScriptParam (attr) {
        var scripts = document.getElementsByTagName('script'),
            currentScript = scripts[scripts.length-1];
        return currentScript.getAttribute('data-' + attr); // in future, could just use the HTML5 standard dataset attribute instead: currentScript.dataset[attr]
    }
    var myOwnAttribute = getScriptParam('myOwnAttribute');
    // ... do stuff here ...
}());

Google丑陋的API的真正优势在于它允许开发人员将该代码放入文档的<head>（被认为是正确的格式），同时仍然以跨浏览器的方式异步执行。我认为如果他们将动态脚本标记技术与上述方法结合起来，他们确实可以避免全球化。

什么是最简单的<script>标记与params </script>

4 个答案: