javascript高级程序设计-第二章

╰+攻爆jí腚メ 2023-07-07 08:22 20阅读 0赞

#### 注 ####

> 没有一节一节写的很详细，就总结一些常用的，给自己或者也一起在学习的朋友一起过过眼瘾，一起理理，喜欢的朋友可以点赞关注哦。

#### script标签位置 ####

> 一般情况下页面加载会有延迟，如果script里面js文件比较大可能会出现网页刚加载时的空白情况，所以为了避免这种问题，通常我们会把script标签放在body元素中，这里面试中有时候会问道，属于比较基础的问题。  
> 示例代码

<!DOCTYPE html> 
    <html> 
     <head> 
     <title>javascript高级程序设计</title> 
     </head> 
     <body> 
      
     <script type="text/javascript" src="xipiker1.js"></script> 
     <script type="text/javascript" src="xipiker2.js"></script> 
     </body> 
    </html>

#### 延迟脚本(defer)和异步脚本(async) ####

> 个人感觉好像真没啥用，听字面意思就是和上一节内容差不多，body元素里面内容先加载，script标签在通过设置defer=“defer”，或者async属性来规定脚本的加载方式，字面意思很好理解，延迟脚本就是在body元素内容加载完后才会运行，提前下载但是延迟执行，加载脚本的顺序是结构化进行的，异步脚本就类似同步加载，不保证按照指定它们的先后顺序执行，书上这么解释”在有两个脚本需要加载的情况下，第二个脚本文件可能会在第一个脚本文件之前执行。因此，确保两者之间互不依赖非常重要。指定 async 属性的目的是不让页面等待两个脚本下载和执行，从而异步加载页面其他内容。  
> 为此，建议异步脚本不要在加载期间修改 DOM。“，总之呢！开心就好管你咋地！

#### 嵌入代码与外部文件 ####

> **可维护性：** 遍及不同 HTML 页面的 JavaScript 会造成维护问题。但把所有 JavaScript 文件都放在  
> 一个文件夹中，维护起来就轻松多了。而且开发人员因此也能够在不触及 HTML 标记的情况下，  
> 集中精力编辑 JavaScript 代码。  
> **可缓存：** 浏览器能够根据具体的设置缓存链接的所有外部 JavaScript 文件。也就是说，如果有两个  
> 页面都使用同一个文件，那么这个文件只需下载一次。因此，最终结果就是能够加快页面加载的  
> 速度。  
> **适应未来：** 通过外部文件来包含 JavaScript 无须使用前面提到 XHTML 或注释 hack。HTML 和  
> XHTML 包含外部文件的语法是相同的。