前端校招面试题目合集练习-9

最新推荐文章于 2024-05-15 12:18:12 发布

Yisonj

最新推荐文章于 2024-05-15 12:18:12 发布

阅读量171

点赞数

分类专栏： web前端面试题合集文章标签：前端面试

本文链接：https://blog.csdn.net/weixin_45554136/article/details/112722829

版权

web前端面试题合集专栏收录该内容

15 篇文章 0 订阅

订阅专栏

本文概述了HTML5 dragapi的事件流程和HTTP2.0的多路复用、首部压缩等优势，同时解析了HTTP状态码400-403及fetch的双请求行为。对比了Cookie、sessionStorage和localStorage，并介绍了WebWorker在性能提升中的应用。

摘要由CSDN通过智能技术生成

题目来自于牛客网题库-前端校招面试题目合集。
该题库共501题
学习目标：题库501道题目学习一遍。

学习目标：

学习进度：90/501

学习内容：

说一下HTML5的drag api
dragstart：事件主体是被拖放元素，在开始拖放被拖放元素时触发。
darg：事件主体是被拖放元素，在正在拖放被拖放元素时触发。
dragenter：事件主体是目标元素，在被拖放元素进入某元素时触发。
dragover：事件主体是目标元素，在被拖放在某元素内移动时触发。
dragleave：事件主体是目标元素，在被拖放元素移出目标元素是触发。
drop：事件主体是目标元素，在目标元素完全接受被拖放元素时触发。
dragend：事件主体是被拖放元素，在整个拖放操作结束时触发
谈谈HTTP2.0
HTTP基于HTTP1.0.它允许多路复用，即允许同时通过单一的HTTP/2连接发送多重请求-响应信息。首部压缩，报文更紧凑，更快速传输，有利于移动网络环境。由服务器端推送。提升了访问速度，比HTTP1.0请求资源所需时间更少，访问速度更快。将所有传输的信息采用二进制编码为更小的信息或者帧，
谈谈400和401，403状态码
400：产生原因：前端提交的数据字段名称和字段类型与后台实体未保持一致。即请求报文中存在语法错误。
401：当前请求需要得到用户验证。
403：服务器已得到请求，但拒绝执行。
fetch发送2次请求的原因。
fetch对get请求不会发送2次请求。
fetch发送post请求时，总是发送2次，第一次状态码是404，第二次才成功。因为fetch的post请求会导致fetch第一次发送一个potions请求，询问服务器是否支持修改的请求头，如果服务器支持，则在第二次中发送真正的请求。
cookie,sessionStorage和localStorage的区别.
cookies：在浏览器端存储数据，内存比较小，并且有条件限制，会被发往服务器端。会被发送到服务器端。有个数限制
sessionStorage:只在session中有效，内存比较大，存储在本地不会发送到服务端，当本浏览器窗口被关闭，就会被删除。
localStorage：永久存储，总体数量无限制。浏览器窗口关闭不会删除。
谈谈web worker
如何创建web worker：
检查浏览器对web worker的支持性后，创建Web worker文件，后创建其对象。
web worker用来解决js运行拖累浏览器运行速度的问题。使js运行在服务器端，不影响性能。
谈谈HTML语义化标签。
HTML语义化便于开发者阅读和写出更优雅的代码，同时让浏览器的爬虫和机器很好的解析。可以在没用css的情况下，使页面也能呈现很好的内容结构和代码结构。有利于SEO，和搜索引擎建立良好沟通，有助于爬虫爬取更多信息。便于团队开发和维护，语义化更有可读性。
iframe是什么？有什么缺点？
iframe元素会创建包含另一个文档的内联框架。
缺点：
1.会产生很多页面，不容易管理。
2.iframe框架结构有时会让人感到迷惑，如果框架个数多的话，可能会出现上下、左右滚动条，会分散访问者的注意力，用户体验度差。
3.代码复杂，无法被一些搜索引擎索引到，这一点很关键，现在的搜索引擎爬虫还不能很好的处理iframe中的内容，所以使用iframe会不利于搜索引擎优化。
4.很多的移动设备（PDA 手机）无法完全显示框架，设备兼容性差。
5.iframe框架页面会增加服务器的http请求，对于大型网站是不可取的。
Doctype的作用？严格模式和混杂模式如何区分？它们有何意义？
Doctype声明位于文档中的最前面，处于标签之前。告知浏览器的解析器，用什么文档类型规范来解析这个文档。
严格模式的排版和JS 运作模式是以该浏览器支持的最高标准运行。在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
Doctype不存在或格式不正确会导致文档以混杂模式呈现。
Cookie如何防范XSS攻击？
XSS即跨站脚本攻击，是指攻击者在返回的HTML中嵌入JS脚本，为减少攻击，可以在HTTP头部配置，set-cookie值：
httponly：防止XSS攻击，禁止JS脚本来访问Cookie
,secure:仅在HTTPS时发送Cookie。