如何在页面加载后通过jQuerydynamic插入<script>标签?
我有问题得到这个工作。 我第一次尝试设置我的脚本标记为string,然后使用jquery replaceWith()将它们添加到页面加载后的文档:
var a = '<script type="text/javascript">some script here</script>'; $('#someelement').replaceWith(a);
但是我得到了该string字面错误。 然后我尝试编码string,如:
var a = '&left;script type="text/javascript">some script here<\/script>';
但发送到replaceWith()
只输出该string到浏览器。
有人能让我知道你将如何去dynamic添加一个<script>
标签到页面加载后,最好通过jQuery?
您可以将脚本放入单独的文件,然后使用$.getScript
加载并运行它。
例:
$.getScript("test.js", function(){ alert("Running test.js"); });
尝试以下操作:
<script type="text/javascript"> // Use any event to append the code $(document).ready(function() { var s = document.createElement("script"); s.type = "text/javascript"; s.src = "http://scriptlocation/das.js"; // Use any selector $("head").append(s); });
下面是使用现代(2014)JQuery的正确方法:
$(function () { $('<script>') .attr('type', 'text/javascript') .text('some script here') .appendTo('head'); })
或者如果你真的想replace一个div你可以做:
$(function () { $('<script>') .attr('type', 'text/javascript') .text('some script here') .replaceAll('#someelement'); });
更简单的方法是:
$('head').append('<script type="text/javascript" src="your.js"></script>');
你也可以使用这个表单来加载css。
这个答案在技术上与jcoffland的回答类似或相同。 我刚刚添加了一个查询来检测脚本是否已经存在。 我需要这个,因为我在一个Intranet网站上工作了几个模块,其中一些模块共享脚本或自带,但是这些脚本不需要每次都加载。 我在生产环境中使用这段代码已经有一年多的时间了,它就像一个魅力一样。 对自己说:是的,我知道,问一个函数是否存在会更正确::-)
if (!$('head > script[src="js/jquery.searchable.min.js"]').length) { $('head').append($('<script />').attr('src','js/jquery.searchable.min.js')); }
例:
var a = '<script type="text/javascript">some script here</script>'; $('#someelement').replaceWith(a);
它应该工作。 我试了一下 相同的结果。 但是当我使用这个:
var length = 1; var html = ""; for (var i = 0; i < length; i++) { html += '<div id="codeSnippet"></div>'; html += '<script type="text/javascript">'; html += 'your script here'; html += '</script>'; } $('#someElement').replaceWith(a);
这对我有效。
编辑:我忘了#someelement
(顺便说一句,我可能想使用#someElement
因为约定)
这里最重要的是+ =,所以html被添加并且不被replace。
如果不起作用,请发表评论。 我想帮你!
有一个解决方法,听起来更像是一个黑客攻击,我同意这不是最优雅的方式,但100%的作品:
说你的AJAX响应是类似的
<b>some html</b> <script>alert("and some javscript")
请注意,我已经跳过结束标签的目的。 然后在加载上面的脚本中,执行以下操作:
$.ajax({ url: "path/to/return/the-above-js+html.php", success: function(newhtml){ newhtml += "<"; newhtml += "/script>"; $("head").append(newhtml); } });
只是不要问我为什么:-)这是由于绝望的几乎随机试验而失败的结果之一。
关于它是如何工作的,我还没有完整的build议,但有趣的是,如果将结束标记追加到一行中,它将不起作用。
在这样的时代,我觉得我已经成功地被零分了。
这里有一个更清晰的方法 – 不需要jQuery,它将脚本添加为<body>
的最后一个子<body>
:
document.body.innerHTML +='<script src="mycdn.js"><\/script>'
但是如果你想添加和加载脚本使用Rocket Hazmat的方法 。
如果您正在尝试运行一些dynamic生成的JavaScript,那么使用eval
会稍微好一些。 但是,JavaScript是一种dynamic的语言,你真的不需要这样做。
如果脚本是静态的,那么Rocket的getScript
-suggestion就是要走的路。