当用户开始访问，首先下载html资源和外部js资源，在chrome中显示的是html先下载，然后下载外部js，外部js的下载顺序安引用顺序，但是下载到达情况则视情况而定，接着才是图片和其他资源，但是要注意的是，js下载完成之后就开始执行了，也包括<script>块中的语句，此时页面可能还未开始渲染，所以会有白屏，就是js先执行了的原因，还有一点，外部js和<script>里的语句先执行的是外部js，这一点也可以从我们引用各种库的例子得到佐证。可以写一些简单的测试例子：

 <html>

     <head>

         <script type="text/javascript" src="http://localhost/everywhere.js"></script>

         <script type="text/javascript" src="http://localhost/test.js"></script>

         <script type="text/javascript">

         //ready(alert(document.getElementById("hehe")));

         //ready();

         alert("inner")

         alert(document.getElementById("hehe"));

         </script>

     </head>

     <body>

         <p id="hehe">test</p>

     </body>

 </html>

js1：

  alert("out");

  alert(document.getElementById("hehe"));

js2：

 alert("out2")；

通过测试可以很容易的理解其执行顺序。

html和js，外部js 的下载执行顺序的更多相关文章

  1. js 关于setTimeout和Promise执行顺序问题

    js 关于setTimeout和Promise执行顺序问题 异步 -- Promise和setTimeout 执行顺序   Promise 和 setTimeout 到底谁先执行 定时器的介绍 Jav ...

  2. wex5 实战 wex5与js的组件关系与执行顺序（父子与先后）

    初学wex5,先理理让人容易混淆的三个概念: 一 基本概念: 1 wex5组件,顾名思义,在编辑窗口右侧的组件集合里的,都是wex5基于开源自创的组件,并封装了一套自已的方法.目的是为了方便.相关方法 ...

  3. JS的预编译和执行顺序 详析

    原文:JS的预编译和执行顺序 详析 最近在复习javascript的事件处理时发现了一个问题,然后也是我来写javascript的预编译和执行顺序的问题   代码:   复制代码 代码一 <ht ...

  4. JS的预编译和执行顺序 详析(及全局与局部变量)

    最近在复习javascript的事件处理时发现了一个问题,于是总结一下:javascript的预编译和执行顺序的问题:   <html> <head> <title> ...

  5. js函数和变量的执行顺序【易错】

    js函数和变量的声明与执行顺序 一.函数执行顺序 1.正常顺序 function f(){ alert(2); } f(); //alert 2 所有浏览器都能测试通过. 2.倒序调用 f(); // ...

  6. JS day01——window对象、执行顺序、线程模型

    1.window对象 window对象表示当前浏览器的窗口,它是一个顶级对象,我们创建的所有对象.函数.变量都是window对象的成员. window对象自带了一些非常有用的方法.属性. window ...

  7. JS中同名函数有效执行顺序

    html中如果出现函数同名时:如果有多个外部引入的js文件,例如a.js和b.js(引入顺序假定是a.js,然后是b.js),同时html中本身也有内部的js.那么针对 出现函数名一样的情况时,无论他 ...

  8. JS 的预编译和执行顺序

    脚本执行js引擎做的工作: 语法分析 预编译 解释执行

  9. JS之预编译和执行顺序（全局和函数）

    预编译的两种情况 全局: 1.全局 直接是script标签中的代码,不包括函数执行 执行前: 1.首先生成一个GO(global object)对象,看不到,但是可以模拟出来用来分析 2.分析变量声明 ...

随机推荐

  1. linux开发调试工具---GDB的使用

    编译 gcc  -g  xxx.c  -o xxxgdb gdb  xxxgdb 进入gdb调试界面 查看代码 list   ==>  l 设置断点   可以以函数为断点 /  行数 break ...

  2. 初探linux子系统集之led子系统(二)

    巴西世界杯,德国7比1东道主,那个惨不忍睹啊,早上起来看新闻,第一眼看到7:1还以为点球也能踢成这样,后来想想,点球对多嘛6比1啊,接着就是各种新闻铺天盖地的来了.其实失败并没有什么,人生若是能够成功 ...

  3. netlink组播的使用

    Linux的netlink机制是非常好的Linux内核与应用层进行双向交互数据的方式.其常用的单播方式可以实现内核为服务端,应用层为客户端的通信方式.如果需要实现应用层为服务端,内核为客户端的通信方式 ...

  4. ruby创建某些“关键字”方法别名的语法

    begin和end是ruby的关键字,但是Range中也有名称为begin和end的实例方法.现在问题来了:怎么创建它们的别名方法? 如果用class Range;alias begin_x begi ...

  5. Unity脚本编程之——协程（Coroutine）

    本文翻译自Unity官方文档:https://docs.unity3d.com/Manual/Coroutines.html 专有名词: Coroutine 协程 Alpha 不透明度 当你调用一个函 ...

  6. OpenLayers3的轨迹回放

    OpenLayers3实现轨迹回放需要动画操作,官网上的例子用的是postcompose,但是还可以使用javascript中setInterval和setTime. 我的例子是按官网上来的http: ...

  7. lua函数随记

    在大多数Lua语法分析中可以获得这些标准Lua函数. 无可争辩, 我们可以查阅Lua网站, 但是一些少了的函数被Blizzard进行了调整. 下面列出了所有Lua函数. WoW API中的Lua注意在 ...

  8. Word中去除/删除/删掉Equation Chapter (Next) Section 1

    实际问题如图显示 Equation Chapter (Next) Section 1 . 具体操作步骤如下: 1.Word的"格式"菜单--"样式和格式",出现 ...

  9. 黄文俊：Serverless小程序后端技术分享

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 黄文俊,现任腾讯云SCF无服务器云函数高级产品经理,多年企业级系统开发和架构工作经验,对企业级存储.容器平台.微服务架构.无服务器计算等领域 ...

  10. 如何在python脚本开发做code review

    在软件项目开发中,我们经常提到一个词“code review”.code review中文翻译过来就是代码评审或复查,简而言之就是编码完成后由其他人通过阅读代码来检查代码的质量(可编译.可运行.可读. ...