在使用js展开式菜单时，发现只有加载完页面包含的js文件时，展开菜单才能折叠起来。

查找了一下原因：是因为js页面加载使用的是同步模式，又称阻塞模式，会阻止浏览器的后续处理，停止后续的解析，只有当当前加载完成，才能进行下一步操作。所以默认同步执行才是安全的。但这样如果js中有输出document内容、修改dom、重定向等行为，就会造成页面堵塞。所以一般建议把<script>标签放在<body>结尾处，这样尽可能减少页面阻塞。

(function(){

    var scriptEle = document.createElement("script");

    scriptEle.type = "text/javasctipt";

    scriptEle.async = true;

    scriptEle.src = "http://localhost/jquery.min.js";

    var x = document.getElementsByTagName("head")[0];

    x.insertBefore(scriptEle, x.firstChild);

 })();
应用该方法，便可以很好的避免页面必须加载完所有js文件才能响应菜单折叠的事件。

JS的同步加载、异步加载的更多相关文章

  1. 【转】【玩转cocos2d-x之二十三】多线程和同步03-图片异步加载

    原创作品,转载请标明:http://blog.csdn.net/jackystudio/article/details/15334159 cocos2d-x中和Android,Windows都 一样, ...

  2. js文件 与 css文件 异步加载

    使用lazyload 异步加载css js 文件. 提升页面初始化的速度,减少卡顿时间 , 下面是 使用方法 与 lazyload.js 源码 (中文注释) 调用方法后. 会追加到 head 标签末尾 ...

  3. JS的同步和异步加载

    引言 JS的“加载”不能理解为下载,它是分为两个部分:下载,执行.默认的JS加载是同步的,因为浏览器需要一个稳定的DOM结构,而执行JS时可能会对DOM造成改变,所以在执行JS时一定会阻塞HTML的渲 ...

  4. javascript 同步加载与异步加载

    HTML 4.01 的script属性 charset: 可选.指定src引入代码的字符集,大多数浏览器忽略该值. defer: boolean, 可选.延迟脚本执行,相当于将script标签放入页面 ...

  5. Javascript 文件的同步加载与异步加载

    HTML 4.01 的script属性 charset: 可选.指定src引入代码的字符集,大多数浏览器忽略该值.defer: boolean, 可选.延迟脚本执行,相当于将script标签放入页面b ...

  6. angularJS1笔记-(19)-angular异步加载包的方式

    我们平时写的导入包的方式都是同步方式,有时候会显得过于卡顿,这样我们就可以使用异步加载的方式. script.js方式: 执行结果为: 异步加载还可以加载多个即为script([,,,],functi ...

  7. Unity中场景异步加载

    引入命名空间 using UnityEngine.UI; using UnityEngine.SceneManagement; using System.Collections; using Syst ...

  8. AssetBundle异步加载被中断的问题

    刘 刘泰言创建于 1 年前 在使用异步接口 yield return AssetBundle.ASyncLoad的时候,难免会想到:这个异步处理完之前如何Cancel掉这个任务?也就是一个AssetB ...

  9. QFramework 使用指南 2020（九）：Res Kit（3）异步加载 与 异步队列加载

    在上一篇我们了解了 Res Kit 的一些背后设计原理,讲解了一些概念,比如:开发阶段.真机阶段等. 在这一篇,我们回到 Res Kit 使用细节上. 在 Res Kit 的第一篇,我们介绍了 Res ...

  10. js 异步加载和同步加载

    异步加载 异步加载也叫非阻塞模式加载,浏览器在下载js的同时,同时还会执行后续的页面处理.在script标签内,用js创建一个script元素并插入到document中,这种就是异步加载js文件了: ...

随机推荐

  1. HDU 2567 寻梦（字符串，插入）

    #include<iostream> #include<stdio.h> #include<string.h> #include<cmath> usin ...

  2. 百度之星资格赛 2016 Problem 1002

    本文链接:http://www.cnblogs.com/Ash-ly/p/5494623.html 题意: 度熊面前有一个全是由1构成的字符串,被称为全1序列.你可以合并任意相邻的两个1,从而形成一个 ...

  3. 用JDBC操作MySQL——大量数据库操作时使用批处理提速

    之前所有的操作由于数据量很小,所以没有进行批处理的优化,性能也没有出现明显的恶化,但是随着我用java处理数据量的大幅提高,频繁使用静态SQL语句的方法严重降低了处理效率,这里总结一下JDBC批处理的 ...

  4. 二维树状数组+差分【p4514】上帝造题的七分钟

    Description "第一分钟,X说,要有矩阵,于是便有了一个里面写满了\(0\)的\(n\times m\)矩阵. 第二分钟,L说,要能修改,于是便有了将左上角为\((a,b)\),右 ...

  5. ( 转 ) 数据库BTree索引、Hash索引、Bitmap位图索引的优缺点

    测试于:MySQL 5.5.25 当前测试的版本是Mysql 5.5.25只有BTree和Hash两种索引类型,默认为BTree.Oracle或其他类型数据库中会有Bitmap索引(位图索引),这里作 ...

  6. [BZOJ4896][THUSC2016]补退选(Trie)

    4896: [Thu Summer Camp2016]补退选 Time Limit: 20 Sec  Memory Limit: 512 MBSubmit: 653  Solved: 228[Subm ...

  7. 【匈牙利算法】BZOJ1059-[ZJOI2007]矩阵游戏

    [题目大意] 给出一个局部染色的矩阵,问能否通过交换行或者列使得最后又一条对角线全部被染色过? [思路] 无论如何交换,同一行的格子依然在同一行,同一列的格子依然在同一列.所以只需找出n个行号列号均不 ...

  8. 你真的懂ThreadPoolExecutor线程池技术吗？看了源码你会有全新的认识

    Java是一门多线程的语言,基本上生产环境的Java项目都离不开多线程.而线程则是其中最重要的系统资源之一,如果这个资源利用得不好,很容易导致程序低效率,甚至是出问题. 有以下场景,有个电话拨打系统, ...

  9. Java高级架构师（一）第15节：带查询的分页、修改和删除页面

    @RequestMapping(value="toList",method=RequestMethod.GET) public String toList(@ModelAttrib ...

  10. MetaWeblog是什么

    MetaWebBlog API(MWA)是一个Blog程序接口标准,允许外部程序来获取或者设置Blog的文字和熟悉.他建立在XMLRPC接口之上,并且已经有了很多的实现. 所以现在很多博客系统都支持这 ...