javascript - LinkedIn 用他们的 JS SDK 做了什么魔术？存在脚本主体和 src，加上奇怪格式的主体

Question

我想在我的页面上集成 LinkedIn 共享。

阅读 LinkedIn 在此处提供的文档: https://developer.linkedin.com/docs/getting-started-js-sdk

.. 我惊讶地发现他们在我页面的头部部分需要这个脚本标签

<script type="text/javascript" src="//platform.linkedin.com/in.js">
    api_key:   [API_KEY]
    onLoad:    [ONLOAD]
    authorize: [AUTHORIZE]
    lang:      [LANG_LOCALE]
</script>

我不明白这里发生了什么。首先，w3schools 说“”“注意:如果存在“src”属性，则该元素必须为空。“””(https://www.w3schools.com/tags/tag_script.asp)。我也去了这里:https://html.spec.whatwg.org/multipage/scripting.html#the-script-element(我不是 100% 确定这是多么权威......但是根据格式和长度看起来是权威的:P) - 它也在那里说如果有一个 src 属性，那么正文应该基本上是空的 - 在任何情况下 - 这两个资源无法解释 LinkedIn 的脚本语法。

那么有人知道脚本主体语法是怎么回事吗？是那些 JS 标签吗？如果是这样，我不明白它们是如何使用的。我认为标签与 continue/break 语句一起使用，以摆脱循环。如果我以那种语法提供信息，我不明白 LinkedIn 的 API 如何从我这里获取信息。脚本主体是否以某种方式提供给脚本，并由它自己解析？

谁能给我解释一下这是怎么回事？

谢谢!

Answer 1

你说的对。添加 src 属性时，不会执行 script 的主体。然而，有一种方法可以解决这个问题。这是通过检索脚本标记、提取 innerHTML 并对其使用 eval 实现的。您当然需要在文档准备好时执行此操作。

我不知道 LinkedIn 到底是怎么做到的，但是 HTML 标准并没有为他们改变，加载顺序也没有改变，所以他们要么使用类似于我解释的东西，要么使用一些更聪明的方法来解析正文脚本。

需要考虑的其他注意事项:您可以将其绑定(bind)到您的库中，而不是使用文档就绪事件。就像检索最后一个可用的脚本标签并提取正文一样，在您的库加载时，这将是最后一个以任何方式加载的元素，因此您应该能够在不使用任何事件的情况下检索代码。 (这需要测试，但 DOM 元素是同步加载的，自上而下的方法)。

显然不推荐使用 eval，它很慢，但绝对可以提供您正在寻找的功能。

附言。请原谅任何格式错误。我在离家 2k 英里外的手机上输入此信息。否则我会非常乐意提供一些示例代码片段并自己进行上述测试。