怎么引入(调用)一个JS文件


Posted in Javascript onMay 26, 2016

我们旺旺需要调用别的 js文件。怎么处理?

看随机抽取这个例子。在一个页面中如下:

<html>
<head>
<title>random number</title>
<script type="text/javascript">
//随机抽取人名 </script>
</head>
<body>
<form>
<input type="button" style='font-size:40px' value="Start" onclick="start()">
<input type="button" style='font-size:40px' value="Stop" onclick="stop();">
</form>
<br>    
<font color="blue" style='font-size:150px' id="num"></font>
<br>
</body>
</html>

我们可以把 js 放在另外一个文件里,比如当前文件夹的 a.js 中。

这样 html 页面如下:

<html>
<head>
<title>random number</title>
<script type="text/javascript" src="a.js">
</script>
</head>
<body>
<form>
<input type="button" style='font-size:40px' value="Start" onclick="start()">
<input type="button" style='font-size:40px' value="Stop" onclick="stop();">
</form>
<br>    
<font color="blue" style='font-size:150px' id="num"></font>
<br>
</body>
</html>

a.js

var errorString = "Please input a positive integer.";
var arr = ["A", "B", "C", "D"];
function count() {
max = arr.length; //max, 全局变量
document.getElementById("num").innerHTML = arr[parseInt(max * Math.random())];
}
function start()
{
timeId = setInterval("count();", 100);
}
function stop() {
clearInterval(timeId);
}

这样就行了。

当然,也可以把 a.js放在web上,然后引用成下面这样。

<html>
<head>
<title>random number</title>
<script type="text/javascript" src="http://localhost:8080/test/js/random1.js"></script>
</head>
<body>
<form>
<input type="button" style='font-size:40px' value="Start" onclick="start()">
<input type="button" style='font-size:40px' value="Stop" onclick="stop();">
</form>
<br>    
<font color="blue" style='font-size:150px' id="num"></font>
<br>
</body>
</html>

以上所述是小编给大家介绍的引入(调用)一个JS文件的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持

Javascript 相关文章推荐
javascript web对话框与弹出窗口
Feb 22 Javascript
javascript concat数组累加 示例
Sep 03 Javascript
javascript中简单的进制转换代码实例
Oct 26 Javascript
innerHTML,outerHTML,innerText,outerText的用法及区别解析
Dec 16 Javascript
AngularJS学习第二篇 AngularJS依赖注入
Feb 13 Javascript
支持移动端原生js轮播图
Feb 16 Javascript
详解webpack进阶之插件篇
Jul 06 Javascript
js实现动态改变radio状态的方法
Feb 28 Javascript
关于vue面试题汇总
Mar 20 Javascript
JavaScript数据结构与算法之二叉树插入节点、生成二叉树示例
Feb 21 Javascript
解决layui table表单提示数据接口请求异常的问题
Sep 24 Javascript
jquery检测上传文件大小示例
Apr 26 jQuery
JS加载器如何动态加载外部js文件
May 26 #Javascript
jquery获取复选框的值的简单实例
May 26 #Javascript
改变checkbox默认选中状态及取值的实现代码
May 26 #Javascript
JavaScript数组实现数据结构中的队列与堆栈
May 26 #Javascript
jquery获取复选框checkbox的值的简单实现方法
May 26 #Javascript
jquery判断checkbox是否选中及改变checkbox状态的实现方法
May 26 #Javascript
jquery获取所有选中的checkbox实现代码
May 26 #Javascript
You might like
用来给图片加水印的PHP类
2008/04/09 PHP
php DOS攻击实现代码(附如何防范)
2012/05/29 PHP
PHP与MongoDB简介|安全|M+PHP应用实例详解
2013/06/17 PHP
调整PHP的性能
2013/10/30 PHP
[原创]PHP实现逐行删除文件右侧空格的方法
2015/12/25 PHP
php原生导出excel文件的两种方法(推荐)
2016/11/19 PHP
thinkPHP5.0框架独立配置与动态配置方法
2017/03/17 PHP
基于Codeigniter框架实现的student信息系统站点动态发布功能详解
2017/03/23 PHP
CI(CodeIgniter)框架视图中加载视图的方法
2017/03/24 PHP
laravel 操作数据库常用函数的返回值方法
2019/10/11 PHP
用js得到网页中所有的div的id
2020/10/19 Javascript
根据对象的某一属性进行排序的js代码(如:name,age)
2010/08/10 Javascript
简述AngularJS的控制器的使用
2015/06/16 Javascript
详解js实现线段交点的三种算法
2016/08/09 Javascript
利用jQuery的动画函数animate实现豌豆发射效果
2016/08/28 Javascript
详解jQuery插件开发方式
2016/11/22 Javascript
Mac下通过brew安装指定版本的nodejs教程
2018/05/17 NodeJs
Vue中多个元素、组件的过渡及列表过渡的方法示例
2019/02/13 Javascript
手把手带你封装一个vue component第三方库
2019/02/14 Javascript
解决vue跨域axios异步通信问题
2019/04/17 Javascript
微信小程序自定义组件传值 页面和组件相互传数据操作示例
2019/05/05 Javascript
layer ui插件显示tips时,修改字体颜色的实现方法
2019/09/11 Javascript
基于JavaScript伪随机正态分布代码实例
2019/11/07 Javascript
Vue组件化开发之通用型弹出框的实现
2020/02/28 Javascript
js实现点击上传图片并设为模糊背景
2020/08/02 Javascript
Node.js web 应用如何封装到Docker容器中
2020/09/01 Javascript
python3爬取各类天气信息
2018/02/24 Python
pandas.read_csv参数详解(小结)
2019/06/21 Python
python一些性能分析的技巧
2020/08/30 Python
python基本算法之实现归并排序(Merge sort)
2020/09/01 Python
基于Python采集爬取微信公众号历史数据
2020/11/27 Python
豪华复古化妆:Besame Cosmetics
2019/09/06 全球购物
骨干教师培训制度
2014/01/13 职场文书
学生出入校管理制度
2014/01/16 职场文书
优秀教师事迹简介
2014/02/02 职场文书
旷课检讨书1000字
2014/02/14 职场文书