关于动态加载js脚本的话题
如何动态执行js脚本
event1.js的内容为:alert("event1.js成功加载");
1.document.write('<script src="event1.js"><\/script>'); 经测试在ie7+版本上均有效;
2更改src属性在chrome,ff下并没有效果,在ie8-有效;
例子:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
</head>
<body>
<button id="btn">点我</button>
<script id="s1" src=""></script>
<script>
s1.src="event1.js";
</script>
</body>
</html>
3.动态创建script标签,在chrome,ff,ie下均有效;
例子:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
</head>
<body>
<button id="btn">点我</button>
<script>
addEv();
function addEv(){
document.getElementById("btn").onclick=function(){
var script=document.createElement("script");
script.src="event1.js";
document.body.appendChild(script);
};
}
</script>
</body>
</html>
以上的三种方法都是异步的,还是举一个例子吧:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
</head>
<body>
<button id="btn">点我</button>
<script>
var script=document.createElement("script");
script.src="event1.js";
document.body.appendChild(script);
setTimeout("console.log(str)",1000);//一般情况下在控制台正常打印出str的值
alert(str);//一般会报一个str未定义的错误
</script>
</body>
</html>