带有 src AND 内容的脚本标签是什么意思？

IT技术 javascript
2021-01-18 20:21:03

来自 Google +1 按钮的示例：

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
      {"parsetags": "explicit"}
</script>

脚本标签具有 src-Attribute和内容。这是什么意思，它是如何工作的？

4个回答

不同的浏览器对此有不同的处理方式。有些仅在src包含无错误时才运行内容。有些人在尝试包含src脚本后运行它，无论成功与否。由于这种行为不可靠（并且在 HTML5 中被禁止），因此应该避免。

Google 不依赖任何特定行为。由于内容只是一个对象字面量（一个值），执行它实际上不会做任何事情，除了会导致静默错误。Google 的代码会查看script标签本身的内容，并根据这些内容调整其行为。

@Karl 在外部 .js 文件中使用，这将为您提供当前正在执行的 <script> 节点的内容： s=document.getElementsByTagName('script'); text = s[s.length-1].innerHTML; 我认为没有任何方法可以获取不涉及接触 DOM 的脚本节点的内容.
2021-03-10 20:21:03
@KarlKnechtel - 尝试：document.currentScript在您的 'src' 引用脚本中获取对脚本自己的 '<script>' 标签的引用。
2021-03-13 20:21:03
在我使用过的所有浏览器上，如果该src属性存在，脚本内容将永远不会被执行，并且实际上并不是真正的对象文字，该代码会产生一个SyntaxError如果执行，它只是脚本将使用的“JSON 文本”后来自己。
2021-03-15 20:21:03
@jose - 你的例子不是 CMS 所指的。如果代码作为独立语句运行，则是语法错误。您的示例（和 Google 的）“有效”只是因为脚本元素的内容由于src属性而被忽略。
2021-03-18 20:21:03
有没有比通过 DOM 更聪明的方法来让脚本查看它自己的脚本标签的内容（特别是）？
2021-03-20 20:21:03

如果脚本元素具有src属性，则必须忽略该内容，任何其他行为都是不一致的。

已经在博客中建议（作为 hack）将内容放入元素中，知道它不会被评估，然后使用 DOM 方法将内容作为字符串获取，并对其进行评估或将其插入新的脚本元素中。这两个都不是一个好主意。

为什么这不是一个好主意？如果用来初始化第三方插件呢？
2021-03-15 20:21:03
@FedericoS——用户无论如何都可以运行任意代码，我认为 eval 方法本身并没有那么多的安全问题。鉴于有更优雅的方式来可选地加载代码，它更不整洁和低效，尽管将所有内容和厨房接收器都转储到第一页并希望此后缓存能提供一些效率已经流行了一段时间。例如，Qantas 的主页是 24 mB。
2021-03-18 20:21:03
旧线程，但要回答@thekingoftruth 的问题：html 可由客户端编辑，因此通过 eval 运行它意味着使用户能够运行任意代码，这是一个巨大的安全漏洞。
2021-03-30 20:21:03

脚本加载后，它会查看自己的脚本标签以访问其内容。

它将使用一些类似于此的代码：

var scripts = document.getElementsByTagName("script");
var data = eval(scripts[scripts.length - 1].innerHTML);

由John Resig 提供。

为什么不只是document.currentScript？
2021-03-16 20:21:03

根据HTML5 草案规范，<script>具有src属性的元素应该只具有注释掉的代码，旨在为脚本提供文档。不过，似乎 Google 并不符合此规范。

其它你可能感兴趣的问题
上一篇如何在 FileList 对象中设置 File 对象和长度属性，其中文件也反映在 FormData 对象中？ 下一篇变量不会从 AJAX 函数返回