1.script标签
  1.js代码的解析(包括下载js文件)会阻塞页面加载
  2.当js文件放在头部,页面必须等所有js代码都被下载,解析和执行完成后才开始呈现页面内容(遇到body标签才呈现),对于那些需要很多js文件的页面来说,会有很大的延迟,浏览器页面空白时间,              所以尽量把全部js文件引用放在body标签内的最底部,先呈现内容,用户体验更好
2.defer延迟脚本
  script标签加上defer属性,浏览器会异步地下载该文件,不会影响后续dom的渲染,如果有多个defer的script标签,则会按顺序执行所有的script;defer脚本会在文档渲染完毕后,DomContentLoad前执行
Dom文档加载步骤:
(1)解析html结构

(2)加载外部脚本和样式表文件

(3)解析并执行脚本代码

(4)构造HTML DOM模型 //DOMContentLoaded执行点

(5)加载图片等外部文件

(6)页面加载完毕 //load

3.async异步脚本
  告诉浏览器异步下载async属性文件,async不保证脚本的执行顺序,先加载完先执行

4.嵌入代码与外部文件
  外部文件优点:
  (1)可维护性:不必触及html标记,专心编辑js
  (2)可缓存: 引用同一个外部文件可被浏览器缓存,只需下载一次
  (3)适应未来

JS 之 script标签的更多相关文章

  1. JS之script标签

    1.script标签的位置 script标签可以在head标签中,也可以在body标签中 2.async属性 async的目的是不让页面等待js文件的下载和执行,从而异步加载页面中的其他内容.只支持外 ...

  2. 在html代码中js的script标签建议放在那里?

    今天编写了一个简单的js代码,F12有错误,然后发现是<script>放的位置有问题.之前在我的印象当中,说的是这个标签放在哪里都可以,然而...并不是这样的,例如我现在练习的这个代码,写 ...

  3. JS删除script标签

    可以试试以下方法 var deleteJs = document.getElementById('xxx'); var otherJs = document.getElementsByTagName( ...

  4. GZip压缩的js文件IE6下面不能包含<script>标签

    IE6下面,GZip压缩的js文件,如果js中包含<script>标签,一遇到这样的标签,后面的内容居然都截断了,狂晕! 花了我一个晚上来找原因.. 需要将字符串'<script&g ...

  5. js中的script标签

    在页面中用script标签引入javascript文件(<script type="text/javascript" src="js文件地址">&l ...

  6. 为什么不能在 body 标签的前面的 script 标签中定义 JS 全局变量?

    <!DOCTYPE html> <!-- 为什么不能在 body 标签的前面的 script 标签中定义 JS 全局变量? 在全局环境下的代码就是在页面加载阶段从上到下一边加载一边执 ...

  7. js 手动插入meta标签和script标签

    // 插入 meta 标签 var oMeta = document.createElement('meta'); oMeta.content = 'width=device-width, initi ...

  8. 在JS文件中,不需要<script>标签

    在JS文件中,不需要<script>标签\

  9. js 引入外部文件之 script 标签

    在我的理解看来,html 就是一个单纯的管显示问题,js就是单纯的管动作问题,css就是单纯的管布局问题,这三个构成了一个网页 在HTML中,经常会用到引入js 文件. 引入js的方法很简单: 1. ...

随机推荐

  1. 错误 java.lang.ClassCastException: com.xx cannot be cast to ResourceBundle

    出现错误: java.lang.ClassCastException: com.xxx cannot be cast to ResourceBundle 百度搜索错误,没有结果.谷歌搜索:http:/ ...

  2. Multi label 多标签分类问题(Pytorch,TensorFlow,Caffe)

    适用场景:一个输入对应多个label,或输入类别间不互斥 调用函数: 1. Pytorch使用torch.nn.BCEloss 2. Tensorflow使用tf.losses.sigmoid_cro ...

  3. dedecms首页入口的详细注释

    今天闲来无事,就拿来dede首页的文件给大家详细解释一遍,以便于新手学习,注释过程非常非常非常的详细,里面解释到dede表前缀#@__代替的原理.解释到dede很多自定义函数的具体位置和具体作用等等疑 ...

  4. Centos6.5安装Apache ab性能测试工具

    ab简洁: ab是apache自带的压力测试工具,ab是apachebench命令的缩写. ab不仅可以对apache服务器进行网站访问压力测试,也可以对或其它类型的服务器进行压力测试. ab是一个h ...

  5. BZOJ5291/洛谷P4458/LOJ#2512 [Bjoi2018]链上二次求和 线段树

    原文链接http://www.cnblogs.com/zhouzhendong/p/9031130.html 题目传送门 - LOJ#2512 题目传送门 - 洛谷P4458 题目传送门 - BZOJ ...

  6. 框架MyBatis

    ByBatis MyBatis是Apache的一个开源项目iBatis,iBatis3.x 正式更名为MyBatis ,代码于2013年11月迁移到Github.它是一个基于Java的持久层框架(连数 ...

  7. 048 SparkSQL自定义UDAF函数

    一:程序 1.需求 实现一个求平均值的UDAF. 这里保留Double格式化,在完成求平均值后与系统的AVG进行对比,观察正确性. 2.SparkSQLUDFDemo程序 package com.sc ...

  8. JavaEE 之 log4j

    1.log4j a.概念:一个非常优秀的开源日志记录工具 b.配置: ①src同目录下建立log4j.properties文件,书写: log4j.rootLogger=debug,appender1 ...

  9. 牛客练习赛A 【BFS】

    <题目链接> 题目大意: 给出一张图,问你其中 ' # ' 加上那些不能够到达边界的 ' . ' 的点的个数,' # ' 会起阻挡作用. 解题分析: 本题很好做,无非就是将所有能够由边界上 ...

  10. POJ 3020 Antenna Placement (二分图最小路径覆盖)

    <题目链接> 题目大意:一个矩形中,有N个城市’*’,现在这n个城市都要覆盖无线,每放置一个基站,至多可以覆盖相邻的两个城市.问至少放置多少个基站才能使得所有的城市都覆盖无线? 解题分析: ...