HTML面试题总结

1. 对 HTML 语义化的理解

1. 去掉或者丢失样式的时候能够让页面呈现出清晰的结构；
2. 代码结构清晰，方便团队的管理和维护，并且语义化更具有可读性，减少差异化；
3. 提升用户体验；
   • 例如：title、alt用于解释名词或者图片信息、label标签的活用
4. 有利于SEO优化，提升搜索引擎排名；
   • 和搜索引擎建立良好沟通，有助于爬虫抓取更多的有效信息；
   • 爬虫依赖于标签来确上下文和关键字的权重；
5. 方便其他设备的解析（屏幕阅读器、盲人阅读器、移动设备等等）；

2. H5新增特性

1. 语义化更好的标签：
   • header、nav、aside、article、section、footer；
2. 音视频标签：
   • audio、video；
   • 如果浏览器不支持自动播放怎么办?
     • 在属性中添加autoplay(谷歌浏览器不支持音频自动播放，但是视频支持静音自动播放)；
3. 以 data- 开头的自定义属性；
4. 本地存储：
   • localStorage、sessionStorage；
5. 表单控件；
   • 给 type 属性设置值；
   • url、search、file、email、date、number、month、color、tel；
6. 画布；
   • Canvas；
7. 拖拽释放：
   • drag、drop；
8. 新技术：
   • 浏览器多线程：webWorker；
   • 前后台持久化通信技术：webSocket；

3. HTML5常用的结构标签有哪些，它替换了之前的哪些标签？

• header、nav、main、article、aside、footer、section
• 、

  、

  ...

4. HTML文档采用 UTF-8编码集 的优势是什么？

1. utf-8：
   • 使用3个字节表示一个符号，基本上可以覆盖世界上所有的语言；
2. 优势：
   • 与传统的gb2312、gbk相比，可识别的字符集更多，也是行业界推荐的；

5. 标签中常用的属性有哪些？

• id、class、title、style；

6. 标签中的 title属性 和 alt属性 的区别是什么？

1. title：
   • 是标签的描述属性，当鼠标移入时，稍等一会儿就会出现title属性的属性值；
2. alt:
   • 用在可置换元素上，当外部资源无法正确加载时，alt属性的属性值就会显示在占位符上；

7. 什么是置换元素 和 非置换元素，每种类型至少举出三个例子

1. 置换元素：
   • 置换元素的内容来自外部，该元素仅是外部资源的占位符；
   • 、；
2. 非置换元素：
   • 非置换元素内容来自当前文档，必须使用双标签；

   • 、

     ~

     、

     ...；

8. 标签中的 href属性 和 src属性 有什么区别？

1. 二者都是对外部资源的引用；
2. href：
   • 用于超文本或样式，用在 标签 和 标签上；
3. src：
   • 用在外部资源占位符上，如、