利用js代码引入其他js文件到页面中

      在web开发中我们可能会碰到写很多js文件,例如当我们写了一个a.js文件和一个b.js文件,我们想用a.js中的方法fun_a()去调用b.js里面的fun_b()方法,这个时候我们就会想到在页面要同时把a.js和b.js文件,页面上要引用这两js文件我们就需要写两个的script标签把这两个引用进来,但是我们只想通过一个script标签就把两个文件甚至更多的文件引进来,怎么办呢?
      我们可以通过如下的方式来解决:
1.在页面上添加script标签引进a.js

<html>
  
<head>
    
<title>js示例</title>
      
<script type="text/javascript" language="javascript" src="a.js"></script>
  
</head>
  
<body>
    
<input type="button" value="执行a.js中的fun_a()" onClick="fun_a()" />
  
</body>
</html>

2.在a.js中写如下代码

var js_element=document.createElement("script");
js_element.setAttribute(
"type","text/javascript");
js_element.setAttribute(
"src","b.js");
document.getElementsByTagName(
"head")[0].appendChild(js_element);

function fun_a()
{
    fun_b();
}

3.在b.js中写如下代码

function fun_b()
{
    window.alert(
"b.js中的fun_b()");
}

4.把这个三个文件放在同一目录下,点击按钮就会出来如下的执行效果

这证明我们成功的通过a.js引进了b.js

      解释一下a.js中的几句代码
var js_element=document.createElement("script");//这句是创建一个script标签
js_element.setAttribute("type","text/javascript");//脚本用的是javascript
js_element.setAttribute("src","b.js");//script标签中引进b.js文件
document.getElementsByTagName("head")[0].appendChild(js_element);//把script标签加入到<head></head>中

 

posted on 2009-04-10 12:51  ColdFish  阅读(3250)  评论(0编辑  收藏  举报