1.浏览器对script引用的js文件分两步,下载,下载完毕后马上执行;这两步都会阻塞浏览器继续解析。

2.加入defer属性,<script defer type="text/javascript" src="some.js" ></script>,浏览器会异步加载js,待DOMContentLoaded后顺序执行js。

3.预加载js,自定义执行时机。

<script language="javascript" type="text/javascript">
    function cachejs(script_filename){
        var cache = document.createElement('object');
        cache.data = script_filename;
        cache.id = "coolshell_script_cache_id";
        cache.width = 0;
        cache.height = 0;
        document.body.appendChild(cache);
    }
 
    function loadjs(script_filename) {
        var script = document.createElement('script');
        script.setAttribute('type', 'text/javascript');
        script.setAttribute('src', script_filename);
        script.setAttribute('id', 'coolshell_script_id');
 
        script_id = document.getElementById('coolshell_script_id');
        if(script_id){
            document.getElementsByTagName('head')[0].removeChild(script_id);
        }
        document.getElementsByTagName('head')[0].appendChild(script);
    }
 
    function LoadJS(){
        var script = './alert.js';
        loadjs(script);
    }
 
</script>
 
 
...
 
<p style="cursor: pointer" onclick="LoadJS()">Click to load alert.js </p>
 
...
...
<script>
    cachejs('./alert.js');
</script>

4.seajs和requirejs

seajs是执行到引用文件代码,再去引用下载,慢。

requirejs也是如此。

希望有什么选项能给个选择,指定哪些文件要预加载,哪些文件是需要时才去加载。

参考链接:

http://coolshell.cn/articles/9749.html

http://www.cnblogs.com/coco1s/p/4010310.html

http://www.cnblogs.com/tiwlin/archive/2011/12/26/2302554.html

js文件的装载和执行的更多相关文章

  1. 引入js文件,ajax不执行操作

    今天写了一个页面,在页面中写的可以执行,但是放到js里面,引入到页面,ajax却不执行了,仔细一看原来是路径的原因 ${pageContext.request.contextPath} 为获取项目名称 ...

  2. AJAX载入外部JS文件到页面并让其执行的方法(附源码)

    一. 向HTML页面中动态添加JS文件(从外部载入)并让其执行的两种方法 1.只适用于IE浏览器的简单方法: 先在文档中放置一张JS"空床"并添加ID:<script id= ...

  3. js文件引用方式及其同步执行与异步执行

    详见: http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp74   任何以appendChild(scriptNode) 的方式引入 ...

  4. JQuery 加载 CSS、JS 文件

    JS 方式加载 CSS.JS 文件: //加载 css 文件 function includeCss(filename) { var head = document.getElementsByTagN ...

  5. 自己编写jQuery动态引入js文件插件 (jquery.import.dynamic.script)

    这个插件主要是结合jquery或者xhr异步请求来使用的,它可以把已经引入过的js文件记录在浏览器内存中,当下次再引入相同的文件就忽略该文件的引入. 此插件不支持浏览器刷新保存数据,那需要利用cook ...

  6. Jmeter_前端RSA加密下的登陆模拟_引用js文件实现

    版权声明:本文为博主原创文章,未经博主允许不得转载. 在一次项目实战中,前端登录使用了RSA加密,使用LoadRunner压测的第一步,就是模拟用户登录,可惜loadRunner11并不能录制前端的加 ...

  7. HTML引入JS文件

    浏览器解析HTML文件时,先判断script 标签中是否有src属性,有则执行指定路径下的JS文件,没有则执行script标签中的js脚本. 1. HTML内嵌JS head里面添加script元素, ...

  8. Jmeter_前端RSA加密下的登陆模拟_引用js文件实现(转)

    在一次项目实战中,前端登录使用了RSA加密,使用LoadRunner压测的第一步,就是模拟用户登录,可惜loadRunner11并不能录制前端的加密过程,并且安装的LR是基于C语言版,网络上关于RSA ...

  9. 解决eclipse js文件报错(转)

    在我们将项目导入Eclipse后,配置好各种编译条件.加载好jar包.配置好tomcat后发现项目还是报错,(前提是项目本身并没有错误,而是我们在初次导入到Eclipse中的时候报错),那是什么原因引 ...

随机推荐

  1. innodb的锁时间

    观察innodb的锁时间,需要关注: mysqladmin extended-status -r -i 1 -uroot | grep "Innodb_row_lock_time" ...

  2. arduino 蓝牙控制RGB LED灯

    /* 日期:2016.9.2 功能:arduino 蓝牙控制RGB LED灯 元件: 跳线公公头 * 8 rgbled, 220欧电阻 蓝牙模块 接线: 蓝牙模块VCC,GND分别接5V,GND;TX ...

  3. ARM、Intel、MIPS处理器啥区别?看完全懂了【转】

    转自:http://news.mydrivers.com/1/472/472317.htm 安卓支持三类处理器(CPU):ARM.Intel和MIPS.ARM无疑被使用得最为广泛.Intel因为普及于 ...

  4. ServiceStack.Redis常用操作 - 事务、并发锁_转

    一.事务 使用IRedisClient执行事务示例: using (IRedisClient RClient = prcm.GetClient()) { RClient.Add("key&q ...

  5. PDA调用WCF服务引用

    在 http://www.cnblogs.com/yiping06993010/archive/2009/11/01/1593912.html 中,的作者提到使用NetCFSvcUtil.exe生成代 ...

  6. Oracle PL/SQL之LOOP循环控制语句

    在PL/SQL中可以使用LOOP语句对数据进行循环处理,利用该语句可以循环执行指定的语句序列.常用的LOOP循环语句包含3种形式:基本的LOOP.WHILE...LOOP和FOR...LOOP. LO ...

  7. iOS开发必备HUD(透明指示层)

    iOS开发必备HUD(透明指示层) 字数421 阅读2123 评论1 喜欢51 1.MBProgressHUD GitHub地址:https://github.com/jdg/MBProgressHU ...

  8. 20145227 《Java程序设计》第2周学习总结

    20145227 <Java程序设计>第2周学习总结 教材学习内容总结 3.1 类型.变量与运算符 1.基本类型:在java中基本类型主要分为整数.字节.浮点数.字符与布尔. 整数:分为s ...

  9. ACM题目————二叉树的遍历

    一.二叉树的后序遍历: 题目描述 给定一颗二叉树,要求输出二叉树的深度以及后序遍历二叉树得到的序列.本题假设二叉树的结点数不超过1000 输入 输 入数据分为多组,第一行是测试数据的组数n,下面的n行 ...

  10. CI框架分页类

    分页类1.分页类参数说明 'base_url' => 指向你的分页所在的控制器类/方法的完整的 URL, 'total_rows' => 数据的总行数, 'per_page' => ...