前端面试题日积月累
作者：互联网
这里写自定义目录标题
HTML
1.你是怎么理解HTML语义化
(1).语义化是指用合理的HTML标签以及其特有的属性去格式化文档内容，比如段落用P标签，标题用H1~H6标签，文章用article标签
(2).合理使用语义化可以增加访问性、可检索性、国际化、互用性，有利于SEO
2.你用过哪些HTML 5标签
<header> <main> <article> <section> <aside> <footer>
<aside> 可用于文章侧边栏
3.meta viewport是做什么用的，怎么写
是为了在移动端不让用户缩放页面使用的
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale-1, minimum-scale=1">
device-width:将布局视窗的宽度设置为设备屏幕分辨率的宽度
initial-scale=1:页面初始缩放比例为屏幕分辨率的宽度
maximum-scale=1:用户能够放大的最大比例
minmum-scale=1:用户能够缩小的最大比例
4.H5是什么
微信上一种移动营销页面（区别于HTML 5）
5.行内元素有哪些
<a> <span> <br> <i> <em> <strong> <label> <q> <var> <cite> <code>
<q>:表示文本的短引用
<p>
她说:<q>今晚一起吃饭
</p>
她说:“今晚一起吃饭”
6.如何禁用href跳转页面
(1).e.preventDefault()
(2).href=“javascript:void(0)”
7.canvas在标签上设置宽高和在style中设置宽高有什么区别
<canvas> 的width和height是画布的实际宽度和高度，style的width和height是canvas在浏览器中被渲染的宽度和高度。如果canvas的width和height没指定或者值不正确，就被设置成默认值
8.你做的哪些页面在哪些浏览器测试过？这些浏览器的内核分别是什么
1.IE：trident
2.Firefox：gecko
3.Safari：webkit
4.Opera：Blink
5.Chrome：Blink
9.Iframe有哪些缺点
(1).会产生很多页面，不易于管理
(2).代码复杂，不利于搜索引擎优化
(3).移动设备兼容性差
(4).会增加http请求，对大型网站不可取
10.HTML 5新特性
(1).本地离线存储 localStorge 长期存储数据，浏览器关闭后不丢失
(2).sessionStorge 数据在浏览器关闭后自动删除
11.HTML 5离线储存
用户不联网时可以正常访问站点或应用，用户联网时更新用户机器上的缓存文件
原理: HTML5 的离线存储是基于一个新建的 .appache 文件的缓存机制，通过这个文件上的结息清单离线存储资源，这些资源就会像cookie一样被存储下来。之后当网络处于离线状态时，浏览器会通过被离线存储的数据进行页面展示
12.浏览器是怎么对HTML5的离线存储资源进行管理和加载的呢
在线情况下，浏览器发现html头部有manifest属性就会请求manifest文件；
如果第一次访问app，浏览器就会根据manifest文件的内容下载相应的资源并且进行离线存储；
如果已经访问过app并且资源已经离线存储了，那么浏览器就会使用离线的资源加载页面，然后浏览器会对比新旧manifest文件，如果文件没有发生改变就不做任何操作，如果文件改变了，就会重新下载文件中的资源并进行离线存储；
离线情况下，浏览器就直接使用离线存储的资源；
13.Doctype的作用是什么，严格模式与混杂模式如何区分，他们有什么意义
<!DOCTYPE> 声明位于文档的最前面，在 <html> 之前。告知浏览器以何种模式来渲染
严格模式: 排版和JS运作模式以该浏览器最高标准运行
混杂模式: 页面以宽松的向后兼容方式显示，模拟老是浏览器的行为以防止站点无法工作
<!DOCTYPE> 不存在或者格式不正确会导致文档以 混杂模式 呈现
14.你知道多少种Doctype类型
HTML4.01规定了 3 种文档类型
(1).过度的 一种要求不很严格的DTD，允许在页面中使用HTML4.01的标识（符合xhtml语法标准）
(2).严格的 一种要求严格的DTD，不许使用任何表现层的标识和属性
(3).框架的 一种专门针对框架页面所使用的DTD，当页面中含有框架元素时就要采用这种DTD
HTML5 只规定了一种 <!DOCTYPE html>
15.HTML与XHTML有什么区别
基础语言不同
XHTML 是可扩展标记语言（XML）
HTML 是标准通用标记语言（SGML）
语法严格程度不同
XHTML 语法严格存在DTD定义规则
HTML 语法比较松散
可混合应用不同
XHTML 可以混合各种XML应用
HTML 不能混合其他XML应用
大小写敏感不同
XHTML 对大小写敏感，标准的XHTML应该用小写
HTML 对大小写不敏感
公布时间不同
XHTML 是2000年W3C公布的
HTML4.01是1999年W3C推荐标准
JS
1.说说Cookie的优缺点
优点
- (1).数据持久性
- (2).不占用服务器资源。cookie储存在客户端并在发送后由服务器读取
- (3).可配置过期规则控制生命周期
- (4).通过加密和安全传输技术（SSL）较少cookie被破解的可能性
缺点
-
(1).cookie有数量和长度的限制
- IE6或者更低版本最多 20 个
- IE7和之后版本最多可以有 50 个
- Firefox最多可以有 50 个
- Chrome和Safari没有做限制
- 每个cookie长度 不能超过4KB ，否则会被拦截
-
(2).安全风险较大，可能被拦截、篡改， 如果被拦截可获取所有的session信息
-
(3).用户可以禁用cookie从而限制这个功能的使用
-
(4).有些状态不能保存在客户端，比如防止重复提交表单在服务器端保存的计数器
2.简单说一下浏览器本地存储是则那样的
(1).Cookie存储，明文，大小限制4KB
(2).localStorge，持久化存储之一，不用两端之间传输，限制大小为10M
(3).sessionStorge，会话级存储方式，浏览器关闭数据立刻丢失
(4).indexDB，浏览器端数据库
标签：面试题,浏览器,前端,离线,存储,HTML,XHTML,日积月累,页面 来源： https://blog.csdn.net/weixin_45770477/article/details/112427702