求教如何动态加载脚本到HTML?

虽然可以动态的加载嵌入HTML中,但是根本就不会被执行。求教高手有什么办法来解决这个问题吗?
说句实话有些程序员总是吹嘘Javascript有多强大多强大~我看连include语句都没有的语言原本就弱智的很~
我的代码如下:
index.html
[code="html"]<!DOCTYPE HTML>



Test
<br> loadFile(&quot;include.js&quot;);<br> alert(vv);</p> <pre><code> function loadFile(filePath){ var element=null; element=document.createElement(&#39;script&#39;) element.setAttribute(&quot;type&quot;,&quot;text/javascript&quot;) element.setAttribute(&quot;src&quot;, filePath) var eHead=document.getElementsByTagName(&quot;head&quot;); if(eHead!=null) { eHead[0].appendChild(element) return true; }else{ return false; } } &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;/body&gt; </code></pre> <p></html>[/code]</p> <p>被动态加载的js脚本:<br> [code=&quot;javascript&quot;]var vv = &quot;I am a variable!&quot;;[/code]</p>

5个回答

动态创建 script元素 是可以执行的,你没有执行可能是路径的问题。
另外YUI
请参考http://yuilibrary.com/yui/docs/yui/loader.html和
http://stackoverflow.com/questions/21294/how-do-you-dynamically-load-a-javascript-file-think-cs-include

weixin_42502970
weixin_42502970 谢谢~你给的资料太好了~
6 年多之前 回复

用xsl + xml + xpath 可以完成,也就是把javascript 写在xml里面,然后用xsl来解晰出来,就相当于动态完成javascript加载

[color=red]如果用原生态的js 有2中方法[/color]
1、直接document.write

document.write("<script src='test.js'><\/script>");

2.动态创建 script元素

var oHead = document.getElementsByTagName('HEAD').item(0); var oScript= document.createElement("script"); oScript.type = "text/javascript"; oScript.src="test.js"; oHead.appendChild( oScript);

[color=red]如果用jquery了那么还有什么办不到了[/color]
$("#div").html(htmlstr);
其中 htmlstr 就是一段htmnl代码 用来动态加入html代码
还有一个
$.getScript("demo_ajax_script.js");
语法:
jQuery.getScript(url,success(response,status))
这个用来动态加载一个js当然这个js 可以写类似 $("#div").html(htmlstr); 的代码

iteye_5246
iteye_5246 可以加try -catch 来包围判断
6 年多之前 回复
zqcctt
zqcctt 原生态的js 没有判断readyState万一加载失败呢
6 年多之前 回复
iteye_5246
iteye_5246 我的动态js追加也就是第二种方法我测试过了的。。没问题,你仔细看下吧。
6 年多之前 回复

弱你妹!自己不会用说js弱!
我也不是很懂,以前想到过这个可能,所以写过,现在拷给你!

function JsLoader() {
this.load = function(url) {
var ss = document.getElementsByTagName("script");
for (i = 0; i < ss.length; i++) {
if (ss[i].src && ss[i].src.indexOf(url) != -1) {
this.onsuccess();
return
}
}
s = document.createElement("script");
s.type = "text/javascript";
s.src = url;
var head = document.getElementsByTagName("head")[0];
head.appendChild(s);
var self = this;
s.onload = s.onreadystatechange = function() {
if (this.readyState && this.readyState == "loading") return;
self.onsuccess()
}
s.onerror = function() {
head.removeChild(s);
self.onfailure()
}
}
}

zqcctt
zqcctt 要活用onreadystatechange 判断 readyState的状态 <html> <head> <title>动态调用js</title> <script type="text/javascript"> document.onreadystatechange = function(){ if (this.readyState && this.readyState == "complete"){ function JsLoader() { this.load = function(url) { var ss = document.getElementsByTagName("script"); for (i = 0; i < ss.length; i++) { if (ss[i].src && ss[i].src.indexOf(url) != -1) { this.onsuccess(); return } } s = document.createElement("script"); s.type = "text/javascript"; s.src = url; var head = document.getElementsByTagName("head")[0]; head.appendChild(s); var self = this; s.onload = s.onreadystatechange = function() { if (this.readyState && this.readyState == "complete") self.onsuccess(); } s.onerror = function() { head.removeChild(s); self.onfailure(); } } } JsLoader.prototype.onsuccess = function(){ alert("complete"); } JsLoader.prototype.onfailure = function(){ alert("false"); } document.getElementById("btn1").onclick=function(){ var a=new JsLoader(); a.load('a.js'); } document.getElementById("btn2").onclick=function(){ alert(a); } } } </script> </head> <body> <input type="button" id="btn1" value="动态加载js" /> <input type="button" id="btn2" value="获取a的值" /> </body> </html> 附a.js如下: var a = "兰州烧饼";
6 年多之前 回复

这个是可以的吧

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!