JS中跨页面调用变量和函数的方法(例如a.js 和 b.js中互相调用)


Posted in Javascript onNovember 01, 2016

在项目开发过程中,也许你会遇这样的情况。

在某一Js文件中需要完成某一功能,但这一功能的大部分代码在另外一个Js文件中已经完成了,自己只需要调用这个方法再加上几句代码就可以实现所需的功能。

我们知道,在html中,利用<script language="javascript" type="text/javascript" src="./script.js"></script>引入的两个js是不可以相互调用的。那么该如何解决呢?当然,你可以将代码通通copy过来,也许你并不喜欢这样。

例如有这样一个html,里面有一个按钮,当按下时调用b.js文件中的方法b()。而b()中又要调用a.js文件中的方法a()。若要实现这个功能,必须注意,将要引入的Js文件代码放在</body>下面。

首先,我们在html中引入b.js,并在</body>之后加入引用语句。如下:

<html> 
<body> 
<input type="button" value="ok" onClick="javascript:b()"> 
</body> 
<!--这里引用要放在body下面--> 
<script language="JAVASCRIPT" src='b.js'></script> 
</html>

b.js文件如下:

new_element=document.createElement("script"); 
new_element.setAttribute("type","text/javascript"); 
new_element.setAttribute("src","a.js");// 在这里引入了a.js 
document.body.appendChild(new_element); 
function b() { 
a(); 
}

在b.js文件中前4行代码中我们引入了a.js文件,并在第7行代码中调用了a.js代码中的a()方法。

让我们来分析一下关键的几句代码:首先,我们利用document.createElement("script")生成了一个script的标签,设置其type属性为text/javascript,src为a.js(这里的a.js同b.js放在同一个目录,也可放在不同的目录)。最后将这个标签动态地加入body中。如此一来,我们就可以调用到不同js文件中的方法了。

以上就是小编为大家带来的JS中跨页面调用变量和函数的方法(例如a.js 和 b.js中互相调用)全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
Javascript 二维数组
Nov 26 Javascript
JS前端框架关于重构的失败经验分享
Mar 17 Javascript
浏览器打开层自动缓慢展开收缩实例代码
Jul 04 Javascript
调整小数的格式保留小数点后两位
May 14 Javascript
jQuery简单实现仿京东分类导航层效果
Jun 07 Javascript
关于定制FileField中的上传文件名称问题
Aug 22 Javascript
jquery实现倒计时小应用
Sep 19 jQuery
基于模板引擎Jade的应用(详解)
Dec 12 Javascript
p5.js临摹旋转爱心
Oct 23 Javascript
基于js实现逐步显示文字输出代码实例
Apr 02 Javascript
JavaScript如何判断对象有某属性
Jul 03 Javascript
JavaScript编码小技巧分享
Sep 17 Javascript
js print打印网页指定区域内容的简单实例
Nov 01 #Javascript
js文件中直接alert()中文出来的是乱码的解决方法
Nov 01 #Javascript
浅谈JavaScript事件绑定的常用方法及其优缺点分析
Nov 01 #Javascript
微信小程序 wxapp内容组件 progress详细介绍
Oct 31 #Javascript
微信小程序 wxapp内容组件 text详细介绍
Oct 31 #Javascript
微信小程序 wxapp内容组件 icon详细介绍
Oct 31 #Javascript
微信小程序 wxapp导航 navigator详解
Oct 31 #Javascript
You might like
PHP中对用户身份认证实现两种方法
2011/06/04 PHP
利用php绘制饼状图的实现代码
2013/06/07 PHP
PHP内置函数生成随机数实例
2019/01/18 PHP
PHP实现数组根据某个字段进行水平合并,横向合并案例分析
2019/10/08 PHP
任意位置显示html菜单
2007/02/01 Javascript
JavaScript类库D
2010/10/24 Javascript
分享14个很酷的jQuery导航菜单插件
2011/04/25 Javascript
jQuery判断checkbox是否选中的小例子
2013/12/02 Javascript
JS可以控制样式的名称写法一览
2014/01/16 Javascript
深入剖析JavaScript中的枚举功能
2014/03/06 Javascript
解析微信JS-SDK配置授权,实现分享接口
2016/12/09 Javascript
ionic中列表项增加和删除的实现方法
2017/01/22 Javascript
JavaScript使用readAsDataUrl方法预览图片
2017/05/10 Javascript
Vue2.0实现组件数据的双向绑定问题
2018/03/06 Javascript
json字符串传到前台input的方法
2018/08/06 Javascript
Vue实现兄弟组件间的联动效果
2020/01/21 Javascript
Python Web开发模板引擎优缺点总结
2014/05/06 Python
python教程之用py2exe将PY文件转成EXE文件
2014/06/12 Python
python修改注册表终止360进程实例
2014/10/13 Python
Python 实现输入任意多个数,并计算其平均值的例子
2019/07/16 Python
使用Python爬虫库requests发送请求、传递URL参数、定制headers
2020/01/25 Python
CSS3图片旋转特效(360/60/-360度)
2013/10/10 HTML / CSS
购买中国最好的电子产品:Geekbuying
2018/03/13 全球购物
MADE法国:提供原创设计师家具
2018/09/18 全球购物
印度在线购物网站:Paytmmall
2019/07/24 全球购物
幼儿园元旦家长感言
2014/02/27 职场文书
档案信息化建设方案
2014/05/16 职场文书
技术比武方案
2014/05/19 职场文书
飞机制造技术专业求职信
2014/07/27 职场文书
法人授权委托书范本
2014/09/17 职场文书
党员查摆剖析材料
2014/10/10 职场文书
2014年业务员工作总结范文
2014/11/17 职场文书
采购员岗位职责范本
2015/04/07 职场文书
电影焦裕禄观后感
2015/06/09 职场文书
如何用threejs实现实时多边形折射
2021/05/07 Javascript
《艾尔登法环》1.03.3补丁上线 碎星伤害调整
2022/04/07 其他游戏