Question

我有一个调用外部application.js的页面。此外部application.js文件应调用外部join.js（托管在第三方域中）并将其放在页面上的给定div中，即#myGivenId。

已更新：简化问题说明。

join.js文件简单返回document.write('something here');字符串。 something here文字应放在#myGivenId

内

我尝试了以下代码，但结果似乎没有在页面上呈现，也没有出现在源代码中。

// jQuery version
$(document).ready(function() {
  return $.getScript('http://localhost:3001/ads/join.js', function(script) {
    return $('#myGivenId').html(script);
  });
});

// CoffeScript version
$(document).ready ->
  $.getScript('http://localhost:3001/ads/join.js', (script) -> $('#myGivenId').html(script))

知道为什么没有出现？

Answer 1

jQuery的$.getScript不会以这种方式返回数据，您需要提供回调。

$(document).ready ->
    $.getScript(script_url, (data) -> $('#myGivenId').append(data));

参考：http://api.jquery.com/jQuery.getScript/

Answer 2

您缺少的是将div放入DOM中。这很容易解决：

document.body.appendChild(placement);

将此行放在函数的末尾。

Answer 3

我不确定你的脚本的“结果”是什么意思，但这里有一些可能的解决方案（原谅我的咖啡脚本，我通常用JavaScript编程）：

导出功能

假设脚本有你想调用的函数，只需使用jQuery的.html（）：

$('#myChosenId').html(someFunc())

您必须确保提前加载脚本：

$.getScript(pathToScript, () -> $('#myChosenId').html(someFunc()))

这将加载脚本，然后在加载时调用该函数。

评估

如果脚本只是一个表达式（如5 + 3或callSomeFunc(Math.cos(5), 7, "hello")），那么我担心唯一的解决方案是使用eval。这是 NOT 一个很好的解决方案，我强烈建议在可能的情况下重构代码以导出函数。

$.get(pathToScript, (script) -> $('#myChosenId').html(eval(script)))

$.get 希望获取原始脚本（如果不起作用，您可能需要使用$.ajax）并将其传递给回调。 eval将执行脚本并将“结果”分配给div。

从你的问题来看，这听起来像你想要的。我从不建议使用eval;我只是提供了完整性。

如果您经常这样做，我建议您查看requirejs。它允许您干净地构建代码并以安全的方式导入外部代码。

修改

将脚本标记嵌入元素：

$('#myChosenId').append($('<script>').attr('src', pathToScript))

我没有对此进行测试，但它应该可行。它只是在您的元素下创建一个新的脚本标记。这是一种糟糕的风格，你应该找到一种从第三方网站获取数据的不同方式。有时这是必要的，例如使用路由器固件等。

Answer 4

这不符合您的期望。 document.write（）将写入原始脚本放在其中的主体。你不能document.write()一个元素......你需要修改一个元素的innerHTML。

如果您无法编辑join.js，除了更改原始外部脚本的位置之外，您没有其他解决方案。

如果您可以更改join.js，请修改它以直接修改DOM。例如。

document.getElementById("myGivenId").innerHTML = "something here";

如何从特定div中的外部js追加js？

4 个答案:

导出功能

评估

将脚本标记嵌入元素：