HTML知识点复习
1.src 和 href 的区别
src：表示对资源的引用， src指向的内容会嵌入到其标签里。
当浏览器解析到该元素时候，会暂停其他资源的下载和处理， 直到将该资源加载、编译、执行完毕，所以js脚本一般会放在页面底部
href：表示超文本引用， 它指向一些网络资源。
当浏览器识别到href指向的文件时， 会并行下载资源， 不会停止对当前文档的处理。
常用在a、link等标签上
2.对HTML语义化的理解
语义化是根据内容的语义化，选择合适的标签（代码语义化）。
通俗来讲就是用正确的标签做正确的事情。
语义化的优点如下：
~对机器友好， 更适合搜索引擎爬虫爬取有效信息；
语义类还支持读屏软件，根据文章可以自动生成目录
~对开发者友好，语义类标签增强了可读性，结构更加清晰
便于开发者清晰地看出网页的结构，便于团队开发和维护
3.DOCTYPE（文档类型）的作用
DOCTYPE是HTML5中一种标准通用标记语言的文档类型声明，
目的是告诉浏览器应该以什么样（html或xhtml）的文档类型定义来解析文档，不同的渲染模式会影响浏览器对css代码甚至JavaScript脚本的解析。DOCTYPE必须声明在html文档的第一行。
浏览器渲染页面的两种模式可以通过document.compatMode获取。如语雀官网的文档类型是 CSS1Compat
~CSS1Compat：标准模式（Strict Mode），默认模式，浏览器使用W3C标准解析渲染页面。在标准模式中，浏览器以其支持的最高标准呈现页面。
~BackCompat：怪异模式（Quick mode），浏览器使用自己的怪异模式解析渲染页面。在怪异模式中， 页面以一种比较宽松的向后兼容的方式显示。
4.script标签中defer和async的区别
如果没有defer或者async属性，浏览器会立即加载并执行相应的脚本。
不会等待后续加载的文档元素，读取到就会开始加载和执行，这样会阻塞后续文档的加载。
直观看三者之间的区别：
蓝色：js脚本网络加载时间；
红色：js脚本执行时间；
绿色：html解析
defer和async都是一部加载外部的js脚本文件，都不会阻塞页面的解析，其区别如下：
~执行顺序：多个带async属性的标签不能保证加载的顺序；多个defer属性的标签按照加载顺序执行
~脚本是否并行执行：
async属性，表示后续文档的加载和执行与js脚本的加载和执行时并行进行的，即异步执行；
defer属性，加载后续文档的过程和js脚本的加载（此时仅加载不执行）是并行进行的，
js脚本需要等到文档所有元素解析完成之后才执行
5.常用的meta标签有哪些，作用分别是什么
meta标签由 name 和 content 属性定义，用来描述网页文档的属性， 比如网页的作者，网页描述，关键词等，
除了http标准固定了一些name作为大家使用的共识，开发者还可以自定义name。
常用的meta标签：
6.img的srcset属性的作用：
响应式页面中经常用到根据屏幕密度设置不同的图片。这是就用到了 img 标签的 srcset 属性。
srcset 属性用于设置不同屏幕密度下，img自动加载不同的图片，用法如下：
使用上面的代码，就能实现在屏幕密度为1x的情况下加载image - 128.png，屏幕密度为2x时加载image-256.png
按照上面的实现， 不同的屏幕密度都要设置图片地址，目前的屏幕密度有1x，2x，3x，4x四种，如果灭一个图片都设置4张图片，
加载就会很慢。所以就有了新的srcset标准。代码如下：
其中srcset指定图片的地址和对应的质量。sizes用来设置图片尺寸零界点
原文地址：https://blog.csdn.net/weixin_74009702/article/details/145243077
免责声明：本站文章内容转载自网络资源，如侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！