1、页面直接就有,或者document.write页面加载同步输出

其实就是当script是页面初始加载的一部分的情况,script是同步的,只有在上一个加载并执行完才会进行下一个script加载。
当然,可手动设置异步:async="async",页面加完,循序依次执行

<script src="http://localhost:8083/-0test/test.js?1"></script>
<script src="http://localhost:8083/-0test/test.js?2"></script>
<script src="http://localhost:8083/-0test/test.js?3"></script>
<script src="http://localhost:8083/-0test/test.js?4"></script>
<script src="http://localhost:8083/-0test/test.js?5"></script>
<script src="http://localhost:8083/-0test/test.js?6"></script>

2、页面中只有js增加的script,或是说是页面加载好后再js增加script

js全部执行完后,并且script已全部成功添加,新增的script才会执行,并且依次顺序执行。
所有ie也是如此

html文件

<div id="info"></div>
<script>
var s = document.createElement('script');
s.src = 'http://localhost:8083/-0test/test.js?5';
document.body.appendChild(s);
var s = document.createElement('script');
s.src = 'http://localhost:8083/-0test/test.js?6';
document.body.appendChild(s);
</script>

test.js文件

var s = document.getElementsByTagName('script');

s = s[s.length - 1];

document.getElementById('info').innerHTML +='<p>'+ s.src;

输出

http://localhost:8083/-0test/test.js?6
http://localhost:8083/-0test/test.js?6

3、js同时增加多个script,页面中已存在其它script

这种情况比较复杂,而且一般不会发生

只有在所有页面中的script加载并执行完后,新增的script才会执行,并且依次顺序执行。
但,确实是在?2位置被增加的,也就是说,document.body.appendChild并没有什么特殊情况,依然与文档加载同步进行,加载到哪里便在哪处理。

ie全系列(此时最高为11)中有些无规律,也许是appendChild先执行,也许是文档中存在的先执行,但肯定是?2之后。

html文件

<div id="info"></div>
<script src="http://localhost:8083/-0test/test.js?1"></script>
<script src="http://localhost:8083/-0test/test.js?2"></script>
<p>一点内容</p>
<script>
var s = document.createElement('script');
s.src = 'http://localhost:8083/-0test/test.js?5';
document.body.appendChild(s);
var s = document.createElement('script');
s.src = 'http://localhost:8083/-0test/test.js?6';
document.body.appendChild(s);
</script>
<script src="http://localhost:8083/-0test/test.js?3"></script>
<script src="http://localhost:8083/-0test/test.js?4"></script>
<script src="http://localhost:8083/-0test/test.js?7"></script>
<p>一点内容2</p>

test.js文件 同上

输出

http://localhost:8083/-0test/test.js?1
http://localhost:8083/-0test/test.js?2
一点内容
http://localhost:8083/-0test/test.js?3
http://localhost:8083/-0test/test.js?4
http://localhost:8083/-0test/test.js?7
一点内容2
http://localhost:8083/-0test/test.js?7
http://localhost:8083/-0test/test.js?7

多个相同script引用探索的更多相关文章

  1. .Net Core 项目中的包引用探索(使用VSCode)

    本文组织有点乱,先说结论吧: 1 在 project.json 文件中声明包引用. 而不是像以前那样可以直接引用 dll. 2 使用 dotnet restore 命令后,nuget 会把声明的依赖项 ...

  2. 脚本引用中的defer和async的用法和区别

    之前的博客漫谈前端优化中的引用资源优化曾经提到过脚本引用异步设置defer.async,没有细说,这里展开一下,谈谈它们的作用和区别,先上张图来个针对没用过的小伙伴有个初始印象: 是的,就是在页面脚本 ...

  3. Bootstrap引用

    <!--设置移动设置页面标准-->        <meta name="viewport" content="width=device-width,i ...

  4. MVC模式下My97DatePicker日期控件引用注意事项

    My97DatePicker日期控件之前在用webform模式开发的时候,只要 <script language="javascript" type="text/j ...

  5. javascript学习笔记(一):基础、输出、注释、引用、变量、数据类型

    javascript脚本必须位于<script></script>之间,<script>标签可以位于<head>中,也可以位于<body>中 ...

  6. ASP.NET中母版页引用外部js或css文件无效,提示对象未定义解决方法

    最近做网站用了一个js+css实现的带有二级菜单的导航条,在母版页创建好后,子页面调用出现了许多奇怪的问题,多方查证后的最终解决方案和大家分享下.... 1.路径问题 如果是一个单独的aspx页面调用 ...

  7. js script type 部分属性值分析

    1. text/javascript: (1)<script type="text/javascript" src="Js/jquery-1.10.2.min.js ...

  8. vue 引用其他组件

    1.在components 目录下新建Test.vue 文件 <template> <div class="test"> <h1>{{ msg ...

  9. vue 不用npm下载安装包 该如何引用js

    公司电脑不让用npm  ,vue的项目要使用moment.js, 用了各种script 引用,总是报错 正确的方式应该为: import {moment} from ‘moment.js ’ 不可以全 ...

随机推荐

  1. Android Checkbox Example

    1. Custom String 打开 “res/values/strings.xml” 文件, File : res/values/strings.xml <?xml version=&quo ...

  2. iOS开发——动画总结OC篇&所有常用动画总结

    所有常用动画总结 先来装下B,看不懂没关系,其实我也看不懂-

  3. android 下修改 hosts文件 及 out of memory的解决

    因为android模拟器host文件无法修改,导致无法通过域名使用http方法调用内网服务,因此从网上大量转载的一种方法,这种方法: 1. 通过emulator -avd avdName -parti ...

  4. linux 内核参数VM调优 之 参数调节和场景分析

    1. pdflush刷新脏数据条件 (linux IO 内核参数调优 之 原理和参数介绍)上一章节讲述了IO内核调优介个重要参数参数. 总结可知cached中的脏数据满足如下几个条件中一个或者多个的时 ...

  5. QT 操作oracle数据库遇到的问题

    一.首先参考官方文档: http://qt-project.org/doc/qt-4.8/sql-driver.html#qoci 二.编译驱动: http://www.tuicool.com/art ...

  6. oracle视图总结

    视图简介: 视图是基于一个表或多个表或视图的逻辑表,本身不包含数据,通过它可以对表里面的数据进行查询和修改.视图基于的表称为基表.视图是存储在数据字典里的一条select语句. 通过创建视图可以提取数 ...

  7. Spring MVC 中 HandlerInterceptorAdapter的使用--转载

    原文地址:http://blog.csdn.net/liuwenbo0920/article/details/7283757 一般情况下,对来自浏览器的请求的拦截,是利用Filter实现的,这种方式可 ...

  8. 16g u盘变 成1g u盘 解决方案,使用驱动器中的光盘之前需要将其格式化

    1\ 计算机----管理------磁盘管理  有一个黑色区域是未分配的 2\ 1)进入cmd 命令行窗口2)输入 diskpart,并回车.弹出系统提示,选是即可.3)输入 list disk,并回 ...

  9. LeetCode50 Pow(x, n)

    题目: Implement pow(x, n). (Medium) 分析: 实现库函数求幂运算,遍历一遍是超时的,用快速幂,就是分治的思想,每次把n去掉一半. 注意:n的取值范围,n = MIN_IN ...

  10. Java SE --- 自增自减

    关于变量的自增与自减运算.   1) int b = a++,作用是将a的值先赋给b,然后再让a自增1.   2) int b = ++a,作用是将a的值先自增1,然后将自增后的结果赋给b. 直接上例 ...