JavaScript
zhangyizuishuai
这个作者很懒,什么都没留下…
展开
-
前端常见面试题链接
https://juejin.cn/post/6940945178899251230原创 2023-07-12 11:16:46 · 31 阅读 · 0 评论 -
大文件的断点续传和秒传
将文件拖到此处,或 点击上传 <!-- PROGRESS --><div class="progress"> <span>上传进度:{{total|totalText}}%</span> <el-link type="primary" v-if="total>0 && total<100" @click="handl...原创 2020-11-30 08:16:01 · 195 阅读 · 0 评论 -
cookie隔离
如果静态文件都放在主域名下,那静态文件请求的时候都带有的cookie的数据提交给server的,非常浪费流量和性能.因为cookie有域的限制,因此不能跨域提交请求,故使用非主要域名的时候,请求头中就不会带有cookie数据,这样可以降低请求头的大小,降低请求时间,从而达到降低整体请求延时的目的。同时这种方式不会将cookie传入Web Server,也减少了Web Server对cookie的处理分析环节,提高了webserver的http请求的解析速度。...原创 2020-11-06 18:03:12 · 806 阅读 · 0 评论 -
回流与重绘以及重排的理解
// 回流与重绘// 浏览器渲染html的过程// 浏览器获取到html代码解析成dom树,html代码中的每一个标签都是dom树的一个节点,根节点就是document对象// dom树里面包含了所有的html标签,包括设置了display:none的标签,还有就是js添加的标签,// 浏览器会解析样式,解析出一个样式的结构体,和我们dom树一起结合形成了一个渲染树render tree,// 渲染树有一个特点就是不包含移除隐藏的节点,比如说用了display:none的节点是不包含在渲染树之内的原创 2020-11-06 16:58:35 · 234 阅读 · 1 评论 -
深浅拷贝的理解与实现
赋值的话基本数据类型都会相互影响,注意深浅拷贝和赋值的差别浅拷贝,要实现基本数据类型,互不影响,而引用类型会互相同步影响定义的变量放在栈当中,引用类型放在堆当中浅拷贝的方案// 浅拷贝,要实现基本数据类型,互不影响,而引用类型会互相同步影响// 在引用数据类型当中赋值可以实现浅拷贝的效果var qian={ z:1, x:2, y:3, q:function(){console.log(1)}, r:[1,2,3], t:{a:1,b:2}原创 2020-11-06 16:57:32 · 264 阅读 · 0 评论 -
前端必须懂的盒模型
标准盒模型都有哪些盒子模型标准盒模型box-sizing:content-box标准盒模型当中你写的width是内容的大小计算盒子宽高的时候是:(内容的)width/height+padding+border的,如果你想让你的盒子站位宽度100px,就是需要让width+padding+border的和为100px这就会延伸出一个问题,我们如果想让盒子宽度一百的时候就需要计算border和padding,后面还想加boder padding 这样盒子就会变大 你想让盒子一百,你就要去计算,这样原创 2020-11-04 11:42:24 · 162 阅读 · 0 评论 -
前端须知的xss攻击
xss攻击用户在表单中输入JavaScript脚本,以及a标签并且a标签内部嵌套一个img标签,通过这种方式获取用户的cookie或者写循环导致用户页面卡顿。在提交表单的时候,如果用户在文本框内输入了循环的脚本,比如写了一个定时器死循环,这样把js代码发送到后端或者前端运行的话会导致服务器消耗性能或者前端网页卡顿一般解决这个问题的话,我们前端解决的方案就是编译提交文本框的内容,并且把js脚本转化为文本的形式,或者把一些关键字比如...原创 2020-11-04 11:40:56 · 394 阅读 · 0 评论 -
原生ajax配合Promise封装
封装的采坑总结注意一点就是post请求设置请求头的时候一定要把设置请求头那段代码放到open的后面 // 设置的header头必须要放到open()后面 xhr.setRequestHeader("content-type", "application/x-www-form-urlencoded")下面就是我的原生封装ajax代码啦<script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.0/原创 2020-11-04 11:39:45 · 297 阅读 · 0 评论 -
基于socket.io开发的聊天室demo
WebSocket比较不好的地方就是纯原生实现聊天室// WebSocket的缺点,没有一个广播的事件或者说方法// 需要我们自己去封装一个,封装一个广播事件的方法broadcast函数,并且broadcast函数内部职能发送字符串类型// 如果你发送别的对象数组等等服务端就会报错,所以我们还需要用到JSON.stringify去转换一下发给前端,并且前端还需要哦转// WebSocket的事件非常的少,用来用去就那几个事件方法// 所以我们更多的是用一个框架去开发聊天室类的网站// 我们使用s原创 2020-11-04 11:06:44 · 572 阅读 · 0 评论 -
websocket以及ajax轮询★
ajax轮询是这个意思// 客户端一发送小心给服务器,服务器接收信息,发送给客户端二,客户端二是每隔固定的时间去询问服务端有没有客户端 二的消息,这样很消耗性能// ajax轮询不是实时的,而webSocket是建立长连接,一次连接实时更新信息,没有断连的情况,所以ajax轮询非常消耗性能// http能不能实现聊天室的效果?// http基于 请求 ---->响应// 因为http请求给后端发送一个请求,然后会响应给发送请求者,// 这个响应信息无法发送给另一个人所以http无法做到聊天原创 2020-11-04 11:04:50 · 414 阅读 · 0 评论 -
Promise重修
Promise重修// promise的apifunction getImage(src){ return new Promise(function(res,rej){ var img=new Image() img.onload=function(){ res(src,"img") } img.onerro=function(){ rej("知识错误的内容") }原创 2020-11-04 10:36:13 · 54 阅读 · 0 评论 -
影响页面性能的因素以及终极解决方案
影响页面性能的因素节点的数量过多节点绑定的事件过多,以及多次操作节点………比如一个页面要同时显示五千条数据你要如何去做优化既要让五千条数据在一个页面当中显示又要保证不卡顿?一:用懒加载的方案去实现,加载的时候只显示两屏的内容,超过两屏的内容上面的部分把节点销毁掉,下面实现一个懒加载的功能二:使用canvas画布去渲染,因为一个canvas画布就是一个节点,我们的思路是把五千条数据以一个画布来展示,这样我们就实现了五千条数据只有一个节点就可以显示.减少了DOM节点的数量....原创 2020-11-03 00:50:09 · 595 阅读 · 0 评论 -
getElementByTagName与querySelectorAll的区别
getElementByTagName与querySelectorAll的区别通过getElementByTagName获取的是HTMLCollection是会更新的意思就是你如果后期加入getElementByTagName能选中的标签会进行更新获取的内容数组而querySelectorAll获取的是NodeList节点:如何你后期添加到页面中的符合querySelectorAll能选中的dom元素标签,也不会更新结果数组。点语法和getAttribute(“target”); setAttribu原创 2020-11-03 00:41:41 · 373 阅读 · 0 评论 -
前端闭包的理解
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>闭包的理解</title></head><body></body><sc原创 2020-10-25 12:45:09 · 477 阅读 · 0 评论 -
原生封装电商商城的分页器
前端电商商城项目分页器的原生js封装与使用详解<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>分页器的使用以及封装</title></head>&原创 2020-09-23 20:55:43 · 155 阅读 · 0 评论 -
js全局变量污染问题
js全局变量污染的产生场景js中全局变量污染的场景,当代码非常长,开发周期长,如果不想办法去解决或者防止全局变量污染的问题,就会造成二次赋值同一个之前定义过的变量。(由于项目开发周期过长你又不记得之前是否定义过这个变量,在赋值之前定义过的变量的时候就污染了全局变量。)我们解决方案如下↓1. 使用namespace模式解决全局环境污染。namespace模式就是把变量装在对象里面,在全局定义一个对象,然后把所有的你想写的全局变量定义在对象内部。你可以随时打印对象查询你是否定义过某个变量。var ob原创 2020-09-04 15:37:55 · 2187 阅读 · 0 评论