如何将参数传递给动态插入的SCRIPT

时间:2014-06-04 00:30:21

标签: javascript jquery html

关于如何参数化SCRIPT已经写了很多。 SO上有一个很好的overview of approaches。该帖子以及我在脚本参数化主题上发现的所有其他内容都是以下两个假设之一:

  1. SCRIPT元素在页面上是硬编码的,因此,它是代码运行时页面上的最后一个SCRIPT元素,使其易于发现。然后,这是一个简单的读取数据属性等问题。

  2. SCRIPT元素在某种程度上是唯一可识别的,例如idsrc文件名等。

  3. 当上述两种假设都不成立时,参数化SCRIPTS的方法是什么,而且,不可能进行服务器端自定义,我们希望缓存脚本?

    作为一个例子,考虑一个异步场景,在页面的顶部窗口中,JavaScript可以在任何时间点在内容中的任何位置添加任意数量的具有相同src URL的SCRIPT元素,而其他不相关的更改DOM正在发生。每个脚本必须接收一个字符串参数。每个字符串参数值在页面上下文中都是唯一的。

1 个答案:

答案 0 :(得分:0)

从我的观点来看,第一个假设总是正确的,但不是你理解它的方式......

根据您提供的链接this article,我们有:

var scripts = document.getElementsByTagName('script');
var index = scripts.length - 1;
var myScript = scripts[index];
// myScript now contains our script object

此代码甚至可以在您描述的上下文中使用。

假设我们有3个脚本标签,当第一个标签执行时,其他标签甚至还不存在,所以它在技术上是最后一个脚本标签:)

执行此代码,看看会发生什么:

    <html>
        <head>
            <script id="script-a">
                var scripts = document.getElementsByTagName('script');
                var index = scripts.length - 1;
                var myScript = scripts[index];
                // myScript now contains our script object

                document.writeln('<br>myScript.id = ' + myScript.id);
                document.writeln('<br>scripts.length = ' + scripts.length);
                document.writeln('<br>----------------');
            </script>
            <script id="script-b">
                var scripts = document.getElementsByTagName('script');
                var index = scripts.length - 1;
                var myScript = scripts[index];
                // myScript now contains our script object

                document.writeln('<br>myScript.id = ' + myScript.id);
                document.writeln('<br>scripts.length = ' + scripts.length);
                document.writeln('<br>----------------');
            </script>
        </head>
    </html>

最近添加的脚本也是如此,您只需确保添加这些脚本的人真正附加这些标记(作为head标记的最后一个子项)。