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

我们旺旺需要调用别的 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文件的方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持

赞 (0)

相关推荐

  • js文件中调用js的实现方法小结

    方法一: Js_file01.js ======== 复制代码 代码如下: //程序代码 document.write(" <script language=\"javascript\" src="\/com\/ Js_file02.js \" > <\/script>"); 方法二: html代码 程序代码 复制代码 代码如下: <html> <body> <input type="

  • JavaScript调用ajax获取文本文件内容实现代码

    JavaScript调用ajax获取文本文件内容实现代码

    这几年JQuery写多了,传统的的javascript已经很久不写了,不少东西都忘掉了,还有多少人记得javascript中实现ajax操作需要借助XMLHttpRequest对象,其实jquery的ajax本质也是这个,好了,今天就花点时间演示一下如何用传统javascript获取文本内容并展示在页面上,废话不多少,直接上代码,注释写的很详细,大家应该能看懂: 复制代码 代码如下: <script type="text/javascript"> //(A)①获取文本文件方

  • 为什么要在引入的css或者js文件后面加参数的详细讲解

    css和js带参数(形如.css?v=与.js?v=) 复制代码 代码如下: <script type="text/javascript" src="jb51.js?version=1.2.6″></script><link rel='stylesheet' href='base.css?version=2.3.3′ type='text/css' /> 使用参数有两种可能, 第一.脚本并不存在,而是服务端动态生成的,因此带了个版本号,以示

  • 引入JS文件IE6报语法错误或缺少对象问题的解决方法

    解决"引入JS文件IE6报错"的问题 问题描述: 页面引入一个js文件,其中定义了函数或对象,然后在页面中调用函数或对象时,在IE6会报"语法错误"或"缺少对象".在IE6+或者IE7却运行正常. 问题分析: 这个对象在引入的JS文件中是存在的,因为在IE6+以上的浏览器都可以正常运行.这个问题在于文件编码上,如果JS文件编码与当前页面的编码不一致,就可能导致在IE6中页面不能正常获取和解析JS文件中的内容,在IE6中,默认引入的文件和页面的编码

  • 用js实现多域名不同文件的调用方法

    复制代码 代码如下: var partnertop="";  var partnerdomain=escape(document.domain);  var partnerurl=escape(document.URL);  var partnerfoot="";  var partnerad_leave="";  var partnerad_search="";  switch (partnerdomain) { case 

  • 把js文件编译成dll供页面调用的方法

    1. 在解决方案中添加一个项目:JSControl 2. 在这个项目添加一个js文件(JScript1.js) 脚本的内容: function showAlert(){ alert('Today is a good dary'); } 3. 改变JScript1.js的属性,Build Action为Embedded Resource(嵌入的资源) 4. 在JSControl项目的AssemblyInfo.cs文件中添加一行:(注意JSControl.JScript1.js,JSControl是

  • 动态调用CSS文件的JS代码

    复制代码 代码如下: <script type="text/javascript" language="javascript"> var _sn = ["df/common", "df/home2010"]; var _su = "http://www.jb51.net/skin/"; var Swidth = screen.width; var _se, _st; for (i in _sn)

  • js 文件引入实现代码

    也不好麻烦让他们从新写一个方法,由于他们都引用了这个AA.js文件,想在这边在AA.js后执行一个函数自动把jq库引入,于是想到引入js文件方法: 复制代码 代码如下: getScript : function(s,call){ var el = UI.DC('script');         if (call) {             el.onload =el.onreadystatechange=call;         }         UI.A(el,'type','text

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

    我们旺旺需要调用别的 js文件.怎么处理? 看随机抽取这个例子.在一个页面中如下: <html> <head> <title>random number</title> <script type="text/javascript"> //随机抽取人名 </script> </head> <body> <form> <input type="button"

  • 在js文件中引入（调用）另一个js文件的三种方法

    比如我写了一个JS文件,这个文件需要调用另外一个JS文件,该如何实现呢?下面就总结下在js文件中引入另一个js文件的实现 方法一,在调用文件的顶部加入下例代码 function addScript(url){ document.write("<script language=javascript src="+url+"></script>"); } 注:有时你引用的文件还可能需要引用其他的js,我们需要将需要的那个js文件也以同样的方法引用进

  • 一个Js文件函数中调用另一个Js文件函数的方法演示

    我们知道,在html中,利用<script language="javascript" type="text/javascript" src="./script.js"></script>引入的两个js是不可以相互调用的.那么该如何解决呢?当然,你可以将代码通通copy过来,也许你并不喜欢这样. 例如有这样一个html,里面有一个按钮,当按下时调用b.js文件中的方法b().而b()中又要调用a.js文件中的方法a().若

  • 同步异步动态引入js文件的几种方法总结

    动态加载js文件 有时候我们需要根据参数不同来引入不同的js文件,用html直接写标签满足不了我们的需求,总结几种方法,以及同步异步加载的各种需求 一.直接加载 <div id="divId"></div> <script> 二.异步加载,并发执行,但引入js内容不能直接使用 //1.1 直接document.write document.write("<script src='test.js'><\/script>

  • Vue如何引入远程JS文件

    问题 最近在使用 Vue 做东西,用到钉钉扫描登录的功能,这里需要引入远程的 js 文件,因为 Vue 的方式跟之前的不太一样,又不想把文件下载到本地应用,找了一下解决的方法,貌似都需要引入第三方的库,最后找到了解决方案,分享之. 思路 一开始的思路是在 Vue 加载完 Dom 之后(mounted),使用 JavaScript 脚本在 body 中插入远程的脚本文件. 后来发现了 Vue 的 createElement 方法,简单的封装一个组件解决问题. 解决方法 第一版代码(直接在操作 Do

  • vue.js引入外部CSS样式和外部JS文件的方法

    学习Vue.js动画时,需要引入一个animate.css,如何全局引入外部文件呢? 一.引入外部CSS样式文件 1. 在app.vue中<style>下直接引入对应的路径 使用@import引入外部css,作用域是全局的,也可在相应的单vue组件引入,import并不是引入代码到<style></style>里面,而是发起新的请求获得样式资源,并且没有加scoped. <style scoped> @import "../static/font/

  • vue项目中在外部js文件中直接调用vue实例的方法比如说this

    一般我们都是在main.js中引入vue,然后在vue文件中直接使用this(this指向的是vue实例),但是在实际开发中,我们往往会引入外部的js文件使用this,这个this就会指向window,并不是我们期待的vue实例,那么就需要重新引入vue文件(import Vue from 'vue'),这样很麻烦.在目前项目中我使用的方法是mian.js导出vue实例,然后在需要使用的js中引入. 步骤一:main.js导出vue实例 var vue = new Vue({ el: '#app

  • vue组件内部引入外部js文件的方法

    vue组件内部引入外部js文件的方法

    之所以要做这个是因为,在一个组件内部需要引入一个js文件来定位.如果放在index.html,这样每个组件都会有这个js.所以需要在组件内单独引入. 第一种操作 Dom引入js: export default { mounted() { const s = document.createElement('script'); s.type = 'text/javascript'; s.src = '你的需要的js文件地址'; document.body.appendChild(s); }, } 第

  • JS如何实现一个单文件组件

    JS如何实现一个单文件组件

    概述 前端开发人员只要了解过vue.js框架可能都知道单文件组件.vue.js中的单文件组件允许在一个文件中定义一个组件的所有内容.这是一个非常有用的解决方案,在浏览器网页中已经开始提倡这种机制.但是不幸的是,这个概念自从2017年8月被提出以来,到现在没有任何进展,像是已经要消亡了一样.然而,深入研究这个主题并试着使用现有的技术来实现单文件组件是很有趣的,值得尝试. 单文件组件 知道"渐进增强"这个概念的前端开发人员想必也听说过"分层"这个概念.在组件中,同样有这

随机推荐