分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 技术分享

JS 之 script标签

发布时间:2023-09-06 02:16责任编辑:蔡小小关键词:script

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标签

原文地址:https://www.cnblogs.com/aizzz/p/9726591.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved