前端八股文(一)HTML 持续更新中。。。

html常见八股

1.src和href的区别？

src：

• 用于js脚本，img、iframe、script等标签

• 加载时会阻塞主线程，将资源内容嵌入到当前标签所在的位置，将其指向的资源下载应用到文档内

href：

• 用于链接a、link等标签

• href指向外部资源所在的位置，和当前元素位置建立链接，将其下载的时候不会阻止其他资源的加载解析

2.h5有哪些新增特性？

1. 新增语义化标签：header、footer

2. 新增表单类型属性：placeholder、type：number、email等

3. 新增音频、视频标签：video、audio

4. 新增浏览器存储：sessionStorage、localStorage

5. 新增websocket通信等

3.html语义化？

• 使用语义化标签，使代码具有良好的结构

• 有利于seo爬虫

• 有利于团队开发和维护

4.iframe的优点和缺点？***

iframe通常用来加载外部链接，不会影响网页内容的加载。

优点

• 可以将网页原封不动的加载进来

• 增加代码的可用性

• 用来加载显示较慢的内容，如广告、视频等

缺点

• 加载的内容无法被浏览器引擎识别，对SEO不友好

• 会阻塞onload事件加载

• 会产生很多页面，不利于管理

5.script标签中defer和async的区别

他俩都是表示异步加载外部JS脚本 ，不会阻碍页面的加载解析。 区别

• 执行顺序：有多个async标签不能保证先后加载顺序，而多个defer标签可以按先后顺序加载。

• 是否立即执行：async加载完脚本后会立即执行 ，defer是要等文档解析完成后才执行。

6.行内元素和块级元素 举例几个

• 行内元素：span、input、a、img、strong

• 块级元素：div、h1、p、ul、li、dl、dt、dd

7.怎样查找、创建、添加、移动、复制、移除节点

• 查找节点：document.querySelectorAll()、document.querySelector()、document.getElementByClassname()、document.getElementById()、document.getElementByTagName()

• 创建节点：document.createElement()

• 添加节点：document.appendChild()

• 移动节点：document.appendChild()

• 复制节点：dom.cloneNode(true)

• 移除节点：document.removeElement()