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文件时，应如何引入？的更多相关文章

  1. Eclipse编辑jsp、js文件时，经常出现卡死现象解决汇总

    使用Eclipse编辑jsp.js文件时,经常出现卡死现象,在网上百度了N次,经过N次优化调整后,卡死现象逐步好转,具体那个方法起到作用,不太好讲.将所有用过的方法罗列如下: 1.取消验证 windo ...

  2. Eclipse编辑jsp、js文件时卡死现象的解决办法汇总

    使用Eclipse编辑jsp.js文件时,经常出现卡死现象,在网上百度了N次,经过N次优化调整后,卡死现象逐步好转,具体那个方法起到作用,不太好讲.将所有用过的方法罗列如下: 1.取消验证 windo ...

  3. 外部调用JS文件时出现中文乱码的解决办法

    若测试网页的编码格式为:gb2312,而调用外部JS文件时出现了乱码(前提是JS文件无错误),则将调用的外部JS文件用记事本打开,然后再保存成编码格式为UTF-8的JS文件即可. 若测试网页的编码格式 ...

  4. JavaScript：引用js文件时的编码格式问题

    JavaScript:引用js文件时的编码格式问题 如果js文件的编码格式是utf-8,并且含有中文,那么按照正常的方法引用,就会出现乱码的情况. 方法/步骤   如果js文件的编码格式是utf-8, ...

  5. webstorm创建js文件时自动生成js注释

    设置webstorm创建js文件时自动生成js注释 settings--Editor--File and Code Temlates 黑色框框里的内容自己填写上去,以下是参考的代码块: /** * @ ...

  6. 360浏览器兼容模式下jsp页面访问不到js文件

    360浏览器兼容模式下jsp页面访问不到js文件 查看自己js中的语法问题,不要用ES6的语法,编译不了故找不到js文件 const var of 码出高效 java 比较 所有整型包装类对象之间值的 ...

  7. 在HTML页面中加载js文件和css文件的方法

    1.在HTML页面加载js文件的方法: function loadScriptFile(filePath){ var script = document.createElement("scr ...

  8. [工具配置]requirejs 多页面，多入口js文件打包总结

    需要明确以下几点: 1.本地前端调试代码肯定是调用原始的路径以及代码,但是线上运行的肯定是通过打包后的另一个路径,这儿就是生成的dist文件夹了. 2.requirejs的引入,线上跟线下的路径怎么控 ...

  9. 一次应用js文件时遇到的怪异现象

    使用thinkphp开发的网页中, 应用js文件 <script  language="JavaScript"  src="__JS__/printer/jquer ...

随机推荐

  1. ACM 媛在努力 华山论剑

    媛在努力 描述在多媒体数据处理中,数据压缩算法尤为重要.小媛上完课后就想自己发明一个数据压缩算法.她想呀想,终于想到一个方法.在多媒体数据中有很多数据都是重复的,所以她想把连续相同的数据用数据出现的次 ...

  2. 前端技术俗语js

    注:原文是英文,本文是我翻译的.有人把我翻译的内容原文照抄,放到他自己的专栏,搞得有人问我是不是我抄袭了……请支持我的劳动成果,花了两个小时翻译的,谢谢.转载请注明译者为方应杭. 嘿,我最近接到一个 ...

  3. WC的基本功能实现.(Java)

    我的GitHub地址:https://github.com/Yuetao1219/lessons WC 项目要求 wc.exe 是一个常见的工具,它能统计文本文件的字符数.单词数和行数.这个项目要求写 ...

  4. airpods2代连接macbook失败

    更新至最新系统(10.14.4),更新完毕,重启电脑再次连接即可. 参考连接: http://dq.tieba.com/p/6082366443

  5. redis整理の走进redis世界

    声明:原文摘自http://weibo.com/u/2446082491,谢谢他的分享! 在当前大型互联网应用以及提供云计算服务的时候,怎样保证系统在海量数据环境下的高性 能.高可靠性.高扩展性.高可 ...

  6. CSS中的一些内容总结

    一.选择器 1.选择器的分组:一个Style可以对多个选择器生效,只用在不同的选择器中间加入逗号即可.如: h1,h2,h3,h4,h5,h6 { color: green; } PS:CSS规定,所 ...

  7. TSQL--可以在触发器中使用COMMIT吗？

    很多场景中,我们使用触发器来回滚一些不满足业务逻辑的修改,这没有问题,问题是我能在触发器中提交事务吗? 这个问题很小白,当也来测试一下 /*测试中创建三种表,对表 TB2 插入时触发触发器,在触发器中 ...

  8. C# 二维码生成——QRCode

    C#二维码生成,这里使用开源的ThoughtWorks.QRCode.dll库. 步骤: 1.下载ThoughtWorks.QRCode.dll库文件,并引用到项目中. 2.创建QRCodeHandl ...

  9. Android View与ViewGroup 关系

    View派生出的直接子类有:AnalogClock,ImageView,KeyboardView, ProgressBar,SurfaceView,TextView,ViewGroup,ViewStu ...

  10. Android 打开URL中的网页和拨打电话、发送短信功能

    拨打电话需要的权限 <uses-permission android:name="android.permission.CALL_PHONE"/> 为了省事界面都写一起 ...