zoukankan      html  css  js  c++  java
  • script标签中的async和defer

      在程序中代码是一行一行执行的,html标签都是由渲染引擎来执行,代码执行时从上往下一行一行执行,当执行到alert(如下图),alert会阻塞后面代码的执行,当点击完确定之后,代码继续往下执行。

      javascript的内容同样可在外部进行引用,如下图所示,正常情况下执行结果和上面的内容相同,但当我们给html的script标签中加入async或者defer属性时,代码的执行过程也将会随之改变。

      async 为异步,顾名思义就是多个人同时做多件事,这里区分sync,sync为同步,就是一个人有序的做多件事情。因此在script标签中加入async属性后,程序执行时,外部引用的js文件内容和html中的代码同时进行。在这里需要注意,因为代码的执行速度不同,显示的效果有可能不同,在此是js内容被下载完成后立即执行。

      defer也会异步的下载去执行js内容,当然script标签中不会有两个相同功能的属性,它和async的区别是什么呢?defer和async的区别就是defer下载完js的内容后不会立即执行,直到html文档加载解析完成后才执行,下图就是使用defer的过程,代码虽然简单,但是这样可以清晰的表达defer的作用。

    总结:前端项目中肯定少不了多多少少的js文件,defer和async就给我们在程序执行过程中提供了很方便的引用,更方便我们维护代码,避免代码中这一个那一个的js引用。

  • 相关阅读:
    踏实每一个脚印——2019年12月复盘
    修改博客园markdown编辑器代码高亮风格的方法
    Hyperion: Building the Largest In memory Search Tree
    C++11——智能指针
    拷贝控制
    分布式系统常见概念
    extern和static使用
    APUE—UNIX文件系统
    C++的一些细节
    fork和僵尸进程
  • 原文地址:https://www.cnblogs.com/Codegenius/p/5835635.html
Copyright © 2011-2022 走看看