Question

我正在尝试在动态加载的内容中使用jQuery丰富的动画功能。

我可以动态地将脚本插入到这样的元素中：

var element = document.createElement("div");
element.innerHTML = "some html here";

var script  = document.createElement("script");
script.type = "text/javascript";
script.text = 'alert("Alert!");';

element.appendChild (script);

当我尝试将jquery代码插入到script元素中时，会出现问题。这不起作用，导致脚本根本不运行。

var element = document.createElement("div");
element.innerHTML = "some html here";

var script  = document.createElement("script");
script.type = "text/javascript";
script.text = 'alert("Alert!");\n';
script.text = script.text+'$("div").animate({height:300,opacity:0.4},"slow");\n';

element.appendChild (script);

我可以成功附加javascript代码来更改我想要的元素，但使用jquery函数可以简化操作。

使用firebug我可以看到脚本元素已经加载到dom中，但是当我向它添加jquery代码时，没有任何反应，甚至没有警报。

我已将jquery源文件包含在我的主文档中，并将我的所有代码包装到window.addEventListener（'load'，function（））中，以便在页面完成加载时调用启动上述代码的函数。 / p>

有没有办法动态创建对jquery函数的调用？我是以正确的方式来做这件事的吗？我已经被困了一段时间，谷歌还没有为我解决这个，任何帮助表示赞赏。

Answer 1

这应该做你想要的：

$('body').append('<s' + 'cript>console.log("lol");</script>');

但为什么不将代码包装到一个函数中，然后随时可以调用它？

function iAnimateThings() {
   $("div").animate({height:300,opacity:0.4},"slow");
}

Answer 2

你的代码没错，你错过了这一行上的一个倒置逗号

script.text = script.text+'$("div").animate({height:300,opacity:0.4},"slow")';

这是你的工作小提琴 http://jsfiddle.net/vYut9/

如何动态插入jquery代码

2 个答案: