当页面有多个js文件时，应如何引入？
1. 我们知道如果一个页面有多个js文件，并且这些js文件有的还有依赖关系的时候，我们就要特别注意他们之间的引入顺序，否则就会报错。
如：一个js文件依赖jquery，我们就要先引入jquery，然后再引入这个js文件，否则，就会报错$ is not defined。
2. 当一个页面有多个js文件的时候，另一个可能出现的问题就是 window.onload = function() { // doSomething() };这个函数出现了多次，这样，只有最后一次出现的才会执行，而之前被引入的js文件的window.onload 函数会被后面引入的包含的window.onload函数覆盖，这一点需要格外注意。举例如下：
例1：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>window.onload</title>
</head>
<body>
<div class="test">这是一段文字</div>
<script>
var para = document.getElementsByClassName("test")[];
window.onload = function() {
para.style.color = "red";
}
window.onload = function() {
para.style.fontSize = "50px";
}
</script>
</body>
</html>
这时，我们得到的是文字很大（50px），颜色还是默认的黑色。
例2：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>window.onload</title>
</head>
<body>
<div class="test">这是一段文字</div>
<script>
var para = document.getElementsByClassName("test")[];
window.onload = function() {
para.style.fontSize = "50px";
}
window.onload = function() {
para.style.color = "red";
}
</script>
</body>
</html>
这时，我们的到文字是默认的16px，但是颜色已经改变了。
结论： 第二个window.onload确实会覆盖第一个出现的window.onload函数。
解决方法1: 将所有的语句写在一个window.onload函数中
解决方法2: 使用《JavaScript DOM编程艺术》一书中所推荐的方法。
当页面有多个js文件时，应如何引入？的更多相关文章
- Eclipse编辑jsp、js文件时，经常出现卡死现象解决汇总
使用Eclipse编辑jsp.js文件时,经常出现卡死现象,在网上百度了N次,经过N次优化调整后,卡死现象逐步好转,具体那个方法起到作用,不太好讲.将所有用过的方法罗列如下: 1.取消验证 windo ...
- Eclipse编辑jsp、js文件时卡死现象的解决办法汇总
使用Eclipse编辑jsp.js文件时,经常出现卡死现象,在网上百度了N次,经过N次优化调整后,卡死现象逐步好转,具体那个方法起到作用,不太好讲.将所有用过的方法罗列如下: 1.取消验证 windo ...
- 外部调用JS文件时出现中文乱码的解决办法
若测试网页的编码格式为:gb2312,而调用外部JS文件时出现了乱码(前提是JS文件无错误),则将调用的外部JS文件用记事本打开,然后再保存成编码格式为UTF-8的JS文件即可. 若测试网页的编码格式 ...
- JavaScript：引用js文件时的编码格式问题
JavaScript:引用js文件时的编码格式问题 如果js文件的编码格式是utf-8,并且含有中文,那么按照正常的方法引用,就会出现乱码的情况. 方法/步骤 如果js文件的编码格式是utf-8, ...
- webstorm创建js文件时自动生成js注释
设置webstorm创建js文件时自动生成js注释 settings--Editor--File and Code Temlates 黑色框框里的内容自己填写上去,以下是参考的代码块: /** * @ ...
- 360浏览器兼容模式下jsp页面访问不到js文件
360浏览器兼容模式下jsp页面访问不到js文件 查看自己js中的语法问题,不要用ES6的语法,编译不了故找不到js文件 const var of 码出高效 java 比较 所有整型包装类对象之间值的 ...
- 在HTML页面中加载js文件和css文件的方法
1.在HTML页面加载js文件的方法: function loadScriptFile(filePath){ var script = document.createElement("scr ...
- [工具配置]requirejs 多页面，多入口js文件打包总结
需要明确以下几点: 1.本地前端调试代码肯定是调用原始的路径以及代码,但是线上运行的肯定是通过打包后的另一个路径,这儿就是生成的dist文件夹了. 2.requirejs的引入,线上跟线下的路径怎么控 ...
- 一次应用js文件时遇到的怪异现象
使用thinkphp开发的网页中, 应用js文件 <script language="JavaScript" src="__JS__/printer/jquer ...
随机推荐
- Google Tango Java实例程序
Java API:https://developers.google.com/tango/apis/java/reference/ 1. java_augmented_reality_example ...
- 练习题。对DOM中document的深刻理解巩固
//window.onload = modTwo; 1.点击单元格内容 弹窗promrt接收值 将接受的值提换单元格内容 2.点击单元格 出现2个按钮 加粗 字体颜色标红 ...
- 【Linux】GDB查看栈信息（转）
在调试程序的过程中,查看程序的函数调用堆栈是一项最基本的任务,几乎所有的图形调试器都支持这项特性. GDB调试器当然也支持这一特性,但是功能更加灵活和丰富. GDB将当前函数的栈帧编号为0,为外层函数 ...
- LRU缓存介绍与实现 (Java)
引子: 我们平时总会有一个电话本记录所有朋友的电话,但是,如果有朋友经常联系,那些朋友的电话号码不用翻电话本我们也能记住,但是,如果长时间没有联系 了,要再次联系那位朋友的时候,我们又不得不求助电话本 ...
- [转载]Java线程的两种实现方式
转载:http://baijiahao.baidu.com/s?id=1602265641578157555&wfr=spider&for=pc 前言 线程是程序的一条执行线索,执行路 ...
- oracle 触发器序列号自增
步骤:1.创建表 table 2.创建序列 SEQUENCE 3.创建 触发器 截图实例:
- ie8在win7系统下怎么安装或重装？[转载]
(一)对于已卸载了IE8的用户 因为微软并没有提供用于Windows 7系统的IE8独立安装包,Windows 7用户是无法通过下载安装包的方法来重装IE8的,而是默认将IE8的安装程序集成在Wind ...
- leetcode 2 两数相加 JAVA
题目: 给出两个 非空 的链表用来表示两个非负的整数.其中,它们各自的位数是按照 逆序 的方式存储的,并且它们的每个节点只能存储 一位 数字. 如果,我们将这两个数相加起来,则会返回一个新的链表来表示 ...
- [Android] Android MVP 架构下 最简单的 代码实现
Android MVP 架构下 最简单的 代码实现 首先看图: 上图是MVP,下图是MVC MVP和MVC的区别,在于以前的View层不仅要和model层交互,还要和controller层交互.而 ...
- kvm linux虚拟机在线扩展磁盘
说明: 1) vmware ESXi虚拟化平台也支持这台在线扩展磁盘功能. 2) kvm虚拟机也支持在线扩展磁盘功能,在线扩展有特定的使用环境,主要用于不能随便停用的生产环境中. 3) 经过测试KVM ...