软讯网络 > 网站建设 > PHP > 如何让动态插入的javascript脚本代码跑起来。

【标题】：如何让动态插入的javascript脚本代码跑起来。
【关键字】：javascript
【来源】：http://blog.csdn.net/BlueDestiny/archive/2006/08/07/1029672.aspx

如何让动态插入的javascript脚本代码跑起来。

首先，声明方法很多种，直接间接的方法都有，只罗列一般情况下的两种模式：
假设我们要装入的代码是a.js：
var foo=function(){
document.write("I am a.js content foo() function");
};

一。直接插入src，这种方法简单而直接，但有局限性，
1）

在如上的代码放上head标签内，执行时大多数情况下是会出错，信息为：错误:缺少对象
这是由于动态创建对象script时，则于a.js还没有完全载入而导致的。执行下面的代码，你就可以发现原因了。

<html>

<head>

<title>never-online dynamic code test page</title>

</head>

<body>

<pre>

readyState的含义

- uninitialized : 脚本对象刚被创建，脚本代码未载入；

- loading : 脚本代码载入中；

- loaded : 脚本代码完成读入，但尚未开始解释执行；

- interactive : 解释执行过程中；

- complete : 脚本已经执行完成。

</pre>

window.onerror=function(msg,url,line){

document.getElementById("viewer").innerHTML+='<p style="color:red">错误:'+msg+'line:'+line+'</p>';

return true;

}

function bar(u) {

var x=document.createElement("SCRIPT");

x.src=u;

x.defer=true;

document.getElementsByTagName("HEAD")[0].appendChild(x);

}

bar("a.js");

(function getReadyState(){

var e=document.getElementById("viewer")

var x=true;

var a = document.getElementsByTagName("SCRIPT");

for (var i=0; i<a.length; i++) {

if (a[i].readyState=='complete' && x!=false) x=true; else x=false

e.innerHTML+=(a[i].src?a[i].src+':':'noname:')+a[i].readyState+"<br />";

}

e.innerHTML+="<hr/>";

if (x) window.clearTimeout(window.timer); else

window.timer=window.setTimeout('getReadyState()',1000);

}());

foo();

</script>

//<![CDATA[

foo();

//]]>

</script>

</body>

</html>

初始值为：
a.js:loading
noname:interactive
我们可以知道，a.js依然在loading状态，在执行foo()当然是错误的。但下一个script标签执行中，a.js的readyState是complete了，所以可以执行foo()的函数。由此，我推荐你可以简单的这样运用动态用生成script标签方法来添加js的url。
解决方法如下
1）用window.setTimeout方法来执行，估计a.js已经载入完毕，才执行a.js里的函数。这个方法仍然不保险

2）多加一个script标签放置要执行的代码

二、用XMLHttpRequest和window.execScript动态的执行a.js，这个方法的优点比较明显，但效率可能有所下降，没有测试，有兴趣的朋友可以自己测试一下速度。
代码如下：

但这个方法仍有缺点，也就是a.js脚本中的代码有中文的情况，如何处理？那就要经常解码了，而解码恰恰是js的软肋，如果运用vbs来解码，那么兼容也就没有了。要看自己具体的应用了，我在neverModules里加载js包时用的就是window.execScript方法来解析代码，这样更可以配合js namespace的应用

不过大多数的情况下，第二种方法处理起来应该没有问题，如果要很严格的执行的话，第一种方法还是有改进的代码的，比如加载a.js的内容，把本身的脚本再次解析再执行，但复杂度就提高了，所以要有一个非常完美的解决方案，还需要更进一步来讨论。
我就不写这么多了，仅仅为一个提醒，还有一个抛砖引玉的作用。

慎用正则的test方法：【上一篇】
项目总结（Ajax＋Struts＋Spring＋Hiberante＋SQLServer2000）第二部分：【下一篇】

【相关文章】

关于javascript实现类的本质的探讨

[ajax开发工具]使用JSLint完成JavaScript语法检查

Javascript, Css ,DHTML的一些技巧和参考(1)

[JavaScript]自定义Title的显示方式

将内容复制到剪贴板 javascript 代码

使用javascript的日期函数