javascript - 将参数添加到 $.getScript

Question

我有一个外部 JavaScript 可以这样调用:

<script type="text/javascript" src="https://ndd.com/script.js" data-goal="12345"></script>

根据getScript，调用将是:

$.getScript("https://ndd.com/script.js", function(data, textStatus, jqxhr) {
  console.log(data); // Data returned
  console.log(textStatus); // Success
  console.log(jqxhr.status); // 200
  console.log("Load was performed.");
});

顺便说一句，我没有找到任何有关如何传递 data-goal 参数的信息。

我无法在代码中使用标准方式(添加第一个 JavaScript 示例)，需要从 JavaScript 文件调用它。

有什么线索吗？

编辑: 作为信息，Javascript 被调用但不被执行。它的唯一工作方式如下:

var tagString ='<script type="text/javascript" src="https://ndd.com/script.js" data-goal="12345"></script>';
eval($('').find("script").text());
var range = document.createRange();
range.selectNode(document.getElementsByTagName("BODY")[0]);
var documentFragment = range.createContextualFragment(tagString);
document.body.appendChild(documentFragment);

Answer 1

您可以手动创建脚本标签，分配属性并将其添加到 DOM。将标签附加到文档后，浏览器将加载并执行您的脚本。

var script = document.createElement('script');
script.onload = function()
{
  // This proves that jQuery has been dynamically loaded and executed by browsers:
  console.log("jQuery has loaded with the following version: " + jQuery.fn.jquery);
  
  // This proves that the script tag contains a data-goal attribute
  console.log(document.body.innerHTML);
};
script.dataset.goal = 12345;
script.src = 'https://code.jquery.com/jquery-3.4.1.min.js';
document.body.appendChild(script);

正如 Adassko 已经提到的，有一个很好的 SO 问题解释了为什么使用 vanilla JS 而不是 jQuery 手动附加脚本是一个好主意:

Can't append <script> element