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用来设置图片尺寸零界点