HTML面试题总结
1. 对 HTML 语义化的理解
- 去掉或者丢失样式的时候能够让页面呈现出清晰的结构;
- 代码结构清晰,方便团队的管理和维护,并且语义化更具有可读性,减少差异化;
- 提升用户体验;
- 例如:
title、alt
用于解释名词或者图片信息、label
标签的活用
- 例如:
- 有利于SEO优化,提升搜索引擎排名;
- 和搜索引擎建立良好沟通,有助于爬虫抓取更多的有效信息;
- 爬虫依赖于标签来确上下文和关键字的权重;
- 方便其他设备的解析(屏幕阅读器、盲人阅读器、移动设备等等);
2. H5新增特性
-
语义化更好的标签:
-
header、nav、aside、article、section、footer
;
-
-
音视频标签:
-
audio、video
; - 如果浏览器不支持自动播放怎么办?
- 在属性中添加
autoplay
(谷歌浏览器不支持音频自动播放,但是视频支持静音自动播放);
- 在属性中添加
-
-
以
data-
开头的自定义属性; -
本地存储:
-
localStorage、sessionStorage
;
-
-
表单控件;
- 给
type
属性设置值; -
url、search、file、email、date、number、month、color、tel
;
- 给
-
画布;
-
Canvas
;
-
-
拖拽释放:
-
drag、drop
;
-
-
新技术:
- 浏览器多线程:
webWorker
; - 前后台持久化通信技术:
webSocket
;
- 浏览器多线程:
3. HTML5常用的结构标签有哪些,它替换了之前的哪些标签?
header、nav、main、article、aside、footer、section
<div class="header">、<div class="nav">、<div class="main">...
4. HTML文档采用 UTF-8编码集 的优势是什么?
-
utf-8:
- 使用3个字节表示一个符号,基本上可以覆盖世界上所有的语言;
-
优势:
- 与传统的
gb2312、gbk
相比,可识别的字符集更多,也是行业界推荐的;
- 与传统的
5. 标签中常用的属性有哪些?
-
id、class、title、style
;
6. 标签中的 title属性 和 alt属性 的区别是什么?
-
title
:- 是标签的描述属性,当鼠标移入时,稍等一会儿就会出现
title
属性的属性值;
- 是标签的描述属性,当鼠标移入时,稍等一会儿就会出现
-
alt
:- 用在可置换元素上,当外部资源无法正确加载时,
alt
属性的属性值就会显示在占位符上;
- 用在可置换元素上,当外部资源无法正确加载时,
7. 什么是置换元素 和 非置换元素,每种类型至少举出三个例子
-
置换元素:
- 置换元素的内容来自外部,该元素仅是外部资源的占位符;
-
<img>、<video>、<audio>...
;
-
非置换元素:
- 非置换元素内容来自当前文档,必须使用双标签;
-
<p>、<h1> ~ <h6>、<ul>...
;
8. 标签中的 href属性 和 src属性 有什么区别?
- 二者都是对外部资源的引用;
-
href
:- 用于超文本或样式,用在
<link>
标签 和<a>
标签上;
- 用于超文本或样式,用在
-
src
:- 用在外部资源占位符上,如
<img>、<iframe>、<script>、<video>...
;
- 用在外部资源占位符上,如
9. iframe标签有什么优缺点?
-
优点:
- 重载页面时不需要加载整个页面,只需要重载页面中的一个框架页,从另一方面来说,减少数据的传输,加快了网页下载速度;
- 技术易于掌握,使用方便,可主要使用于不需要搜索引擎来搜索的页面;
- 当前页面,直接加载其他页面,而不必发生跳转;
-
缺点:
-
iframe
会阻塞主页面中的Onload
事件; - 会产生很多页面,不容易管理;
- 多框架的页面会增加服务器的http请求,影响页面的并行加载;
- 并行加载:同一时间针对不同域名下的请求,iframe和所在页面在同一个域下面,而浏览器的并行加载的数量是有限制的;
-
10. 表单中的按钮有几种,常用的标签有哪几个?
- 按钮有三种:
- 普通按钮、提交按钮、重置按钮;
- 常用标签:
<input type="button" /> <input type="submit" /> <input type="rest" /> <button />
11. 表单数据的提交方式有几种,分析使用场景?
-
POST:
- 表单数据通过请求体发送;
-
GET:
- 表单数据通过URL地址栏发送;
12. 什么是 重绘 和 重排?
-
重绘:
- 当元素的一部分属性发生改变,如外观、背景、颜色等不会引起布局变化,只需浏览器根据元素的新属性重新绘制,使元素呈现新的外观叫做重绘;
-
重排:
- 和重绘相反,当改变布局的时候,就会引起重排;
- 重绘不一定需要重排(比如颜色的改变),重排必然导致重绘(比如改变网页位置);
文章来源地址https://www.toymoban.com/news/detail-839909.html
文章来源:https://www.toymoban.com/news/detail-839909.html
到了这里,关于前端面试题 ===> 【HTML】的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!