2023前端面试题及答案.docxVIP

PAGE2 / NUMPAGES2 前端面试题 一、HTML/CSS篇 1、如何刷新浏览器的应用缓存？ 【仅供参考】应用缓存通过变更“#”标签后的版本号来刷新，如下所示：CACHE MANIFEST # version 2.0/icketang.css/icketang.js/icketang. pngNETWORK： login. php 2、哪些浏览器支持HTML5？ 【仅供参考】几乎所有的浏览器（如 Safari、 Chrome、 Firefox、 Opera、IE）都支持HTML5 3、HTML5应用程序缓存为应用带来什么优势？ 【仅供参考】应用程序缓存为应用带来3个优势。（1）离线浏览，让用户可在应用离线时（网络不可用时）使用它们。（2）速度，让已缓存资源加载得更快。（3）减少服务器负载，让浏览器将只下载服务器更新过的资源。 4、如何区别HTML和HTML5？ 【仅供参考】用 DOCTYPE声明新增的结构元素和功能元素来区别它们。 5、简述一下你对 HTML 语义化的理解？ 【仅供参考】用正确的标签做正确的事情。html 语义化让页面的内容结构化，结构更清晰，便于对浏览器、搜索引擎解析；即使在没有样式 CSS 情况下也以一种文档格式显示，并且是容易阅读的;搜索引擎的爬虫也依赖于 HTML 标记来确定上下文和各个关键字的权重，利于 SEO;使阅读源代码的人对网站更容易将网站分块，便于阅读维护理解。 6、cookie和 session的区别是什么？ 【仅供参考】区别如下：（1）cookie数据存放在客户的浏览器上， session数据存放在服务器上。（2）cookie不是很安全，别人可以分析存放在本地的 cookie并进行 cookie欺骗。考虑到安全问题应当使用 session。（3）session会在一定时间内保存在服务器上。当访问增多时，会占用较多服务器的资源。为了减轻服务器的负担，应当使用 cookie。（4）单个 cookie保存的数据不能超过4KB，很多浏览器都限制一个站点最多保存20个 cookie。所以个人建议可以将登录信息等重要信息存放在 session中，其他信息（如果需要保留）可以存放在 cookie中。 7、如何实现浏览器内多个标签页之间的通信？ 【仅供参考】在标签页之间，调用 localstorge、 cookies等数据存储，可以实现标签页之间的通信 8、介绍一下你对浏览器内核的理解？ 【仅供参考】主要分成两部分：渲染引擎(layout engineer 或 Rendering Engine)和 JS 引擎。渲染引擎：负责取得网页的内容（HTML、XML、图像等等）、整理讯息（例如加入 CSS 等），以及计算网页的显示方式，然后渲染到用户的屏幕上。JS 引擎则：解析和执行 javascript 来实现逻辑和控制 DOM 进行交互。最开始渲染引擎和 JS 引擎并没有区分的很明确，后来 JS 引擎越来越独立，内核就倾向于只指渲染引擎。 9、如何使用 Canvas和HTML5中的SVG画一个矩形？ 【仅供参考】使用SVG绘制矩形的代码如下：<svg xmlns=/2000/svg version="1.1"><rect style="fill:rgb（255,100，0）；"height=200" width="400"></rect></svg>使用 Canvas绘制矩形的代码如下。<canvas id="myCanvas" width=500" height="500"></canvas>var canvas=document.getElementById（'mycanvas'）；var ctx= canvas.getContext（'2d'）； ctx.rect（100,100,300,200）；ctx fillstyle = 'pink 'ctx. fill() 10、请描述一下 sessionStorage和 localStorage的区别。 【仅供参考】sessionStorage用于在本地存储一个会话中的数据，这些数据只有同一个会话中的页面才能访问，当会话结束后，数据也随之销毀。因此 sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。而 localstorage用于持久化本地存储，除非主动删除数据，否则数据是永远不会过期的。 11、应用缓存中的回退是什么？ 【仅供参考】应用缓存中的回退会帮助你指定在服务器不可访问时，显示某文件。例如在下面的manifest文件中，如果用户输入了“/home”，同时服务器不可到达，“404h