怎么引入(调用)一个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 相关文章推荐
JS函数验证总结(方便js客户端输入验证)
Oct 29 Javascript
JS+CSS实现Li列表隔行换色效果的方法
Feb 16 Javascript
jquery实现超简洁的TAB选项卡效果代码
Aug 28 Javascript
开启BootStrap学习之旅
May 04 Javascript
Html5+jQuery+CSS制作相册小记录
Dec 30 Javascript
js实现文本上下来回滚动
Feb 03 Javascript
原生js实现form表单序列化的方法
Aug 02 Javascript
js html实现计算器功能
Nov 13 Javascript
js中null与空字符串&quot;&quot;的区别讲解
Jan 17 Javascript
jQuery实现回到顶部效果
Oct 19 jQuery
jQuery treeview树形结构应用
Mar 24 jQuery
vue二维数组循环嵌套方式 循环数组、循环嵌套数组
Apr 24 Vue.js
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
星际争霸任务指南——人族
2020/03/04 星际争霸
PHP安装攻略:常见问题解答(三)
2006/10/09 PHP
PHP读取目录下所有文件的代码
2008/01/07 PHP
php 页面执行时间计算代码
2008/12/04 PHP
FireFox浏览器使用Javascript上传大文件
2013/10/30 PHP
PHP生成自定义长度随机字符串的函数分享
2014/05/04 PHP
PHP中exec函数和shell_exec函数的区别
2014/08/20 PHP
Yii实现文章列表置顶功能示例
2016/10/18 PHP
thinkPHP实现的省市区三级联动功能示例
2017/05/05 PHP
PHP设计模式之装饰器模式实例详解
2018/02/07 PHP
jQuery EasyUI 开源插件套装 完全替代ExtJS
2010/03/24 Javascript
js中settimeout方法加参数的使用实例
2014/02/27 Javascript
用svg制作富有动态的tooltip
2015/07/17 Javascript
再谈javascript注入 黑客必备!
2016/09/14 Javascript
JQuery获取鼠标进入和离开容器的方向
2016/12/29 Javascript
Vue.js学习示例分享
2017/02/05 Javascript
详解VueJs异步动态加载块
2017/03/09 Javascript
angular+webpack2实战例子
2017/05/23 Javascript
jquery网页加载进度条的实现
2017/06/01 jQuery
小程序实现搜索框
2020/06/19 Javascript
2019年度web前端面试题总结(主要为Vue面试题)
2020/01/12 Javascript
基于JavaScript实现简单抽奖功能代码实例
2020/10/20 Javascript
Python3.6+Django2.0以上 xadmin站点的配置和使用教程图解
2019/06/04 Python
Python3之不使用第三方变量,实现交换两个变量的值
2019/06/26 Python
python3中sys.argv的实例用法
2020/04/24 Python
python 在sql语句中使用%s,%d,%f说明
2020/06/06 Python
基于Python实现全自动下载抖音视频
2020/11/06 Python
晨会主持词
2014/03/17 职场文书
买房委托公证书
2014/04/08 职场文书
计算机应用专业自荐信
2014/07/05 职场文书
2015年党员个人工作总结
2015/05/13 职场文书
2016党员干部反腐倡廉心得体会
2016/01/13 职场文书
如何书写授权委托书?
2019/06/25 职场文书
JS如何实现基于websocket的多端桥接平台
2021/05/14 Javascript
Java Socket实现多人聊天系统
2021/07/15 Java/Android
Sleuth+logback 设置traceid 及自定义信息方式
2021/07/26 Java/Android