- 博客(14)
- 资源 (4)
- 收藏
- 关注
RSS订阅原创 点击无限滚动效果实现
原理，先在元素后面创建一个新的dom，再通过left改变，去移动整体。缺点：创建了一个无限长度的父级元素，一直点击理论上创建了无限个子元素。
2022-08-07 14:51:54
154
原创 封装的ajax，原生的fetch，更强大的axios
今天整理下常用的三种请求数据的方法首先是最基础的ajax请求方式function core(defaultOption, resolve, reject) { // 解构赋值获取对象里的数据 let { data, url, method, async, headers, success, error, responseType } = defaultOption; // 创建ajax let xhr; if (window.XMLHttpRequest) {
2021-09-04 21:25:23
183
原创 关于数组的方法sort()的扩展
sort（）是数组常用来做冒泡排序的方法之一，但是实际上利用他的return可以实现更多功能首先最简单的就是从大到小和从小到大的排序了//从小到大var points = [40, 100, 1, 5, 25, 10];points.sort(function(a, b){return a - b}); //从大到小var points = [40, 100, 1, 5, 25, 10];points.sort(function(a, b){return b - a}); 当sor.
2021-09-01 23:07:51
246
原创 关于vue生命周期几个钩子函数
我们看完<keep-alive>的简单示例之后，让我们一起来分析下源码中它是如何进行组件缓存和缓存优化处理的。1. 首次渲染：vue在模板 -> AST -> render() -> vnode -> 真实Dom这个转化过程中，会进入patch阶段，在patch阶段，会调用createElm函数中会将vnode转化为真实dom。function createPatchFunction (backend) { ... //...
2021-09-01 17:01:01
415
原创 关于图片格式的选择，jpg、png、gif、svg
JPEG是不是很多同学经常看到图片文件的后缀名有时候是 .jpeg 有时候又是 .jpg 了，其实这两个就是一回事。JPEG 格式是一种有损的图片压缩格式，它用算法尽量去除冗余的图像和色彩数据，在图片文件较小的情况下可以得到比较高质量的图片。PNGPNG 图片格式采用的是无损压缩，和 JPEG 相比文件的体积是会大一些的，但是图片质量非常好，而且还支持 Alpha 通道，也就是说 PNG 可以存部分区域透明的图片。GIF热爱斗图的中国人应该都不陌生，我们聊天时看到的动图其实都是 GIF
2021-08-31 00:37:01
1828
原创 vue中路由的几种传参方式
首先声明式导航（如下图）本质就是调用了router.push来实现的，这个方法会向 history 栈添加一个新的记录，所以，当用户点击浏览器后退按钮时，则回到之前的 URL。<router-link :to="...">今天朱老板带大家简单的看下router.push（）的传参方法。首先他能传参的范围是一个描述地址的对象或者字符串，如下图// 字符串router.push('home')// 对象router.push({ path: 'home' })// 命
2021-08-29 22:08:27
480
原创 JS的盒模型，以及根据JS盒模型来定制的图片懒加载和资源懒加载是怎么实现的
盒子模型内容的宽度和高度:我们设置的width/ height这两个样式就是内容的高和宽, 如果没有设置height, 容器的高度会根据里面内容自己进行适应, 这样获取的值就是真实的内容; 如果设置固定的高度了, 不管内容是多了还是少了, 其实我们内容的高度指的都是设定的那个值;真实内容的宽度和高度:这个代指的是实际内容的宽高(和我们设置的height没有必然的联系), 例如: 我设置高度为200px, 如果内容溢出, 那么真实内容的高度还要加上我们溢出的高度client获取当前元素可视
2021-08-26 17:47:52
138
原创 前端安全问题XSS攻击
XSS攻击通常指的是通过利用网页开发时留下的漏洞，通过巧妙的方法注入恶意指令代码到网页，使用户加载并执行攻击者恶意制造的网页程序。这些恶意网页程序通常是JavaScript，但实际上也可以包括Java、 VBScript、ActiveX、 Flash 或者甚至是普通的HTML。攻击成功后，攻击者可能得到包括但不限于更高的权限（如执行一些操作）、私密网页内容、会话和cookie等各种内容。xss的分类xss的分类有，反射型、存储型、DOM型。具体就不做解释，师傅们应该也都懂，不懂的师傅百度上也很容易查
2021-08-19 17:23:28
351
原创 spa单页应用的优缺点以及如何改善
优点：1.用户体验好、快，内容的改变不需要重新加载整个页面2.良好的前后端分离，分工更加明确3.后期维护成本相对容易缺点：1.不利于SEO2.首次渲染速度相对较慢解决缺点的方案：1.不利于SEO优化的改进方法方法一：SSR服务端渲染：将组件或页面通过服务器生成html，再返回给浏览器，如nuxt.js方法二：静态化目前主流的静态化主要有两种：（1）一种是通过程序将动态页面抓取并保存为静态页面，这样的页面的实际存在于服务器的硬盘中（2）另外一种是通过
2021-08-16 10:19:25
308
原创 浅谈vue的路由几种模式
1.hash路由hash路由是依据‘#’后的地址进行监听跳转的，通过location.hash来获取当前的hash值，通过hashchange事件进行监听，相同的hash地址不会触发该事件。2.history该模式是利用h5新增的pushstate和replacestate将地址直接压入历史记录栈中，通过popstate进行监听实现页面跳转的。该模式如果访问的相同的地址会导致404报错，需要后端进行相应的配置3.abstract该种模式支持js运行环境，比如在nodejs中。当识别不
2021-08-14 11:44:07
918
原创 浅论localstorage，sessionstorage和cookie储存方法和区别
1.本地储存//通过key获取存储的valuelocalStorage.getItem("key")//设置本地存储对象localStorage.setItem("key","value")//移除对应的key valuelocalStorage.removeItem("key")//清除所有的对应储存 localStorage.clear()相同的sessionStorage也同样的拥有以上方法2.cookie//读取 cookie 的内容使用 `document.c
2021-08-13 23:42:51
155
原创 如何解决跨域问题
列出4种常用的解决跨域的方法1.浏览器插件安装谷歌浏览器插件Allow Cros，注意开启此插件后不可以使用file协议打开文件。2.后端响应头后端设置通配符响应头允许跨域即可，Access-Control-Allow-Origin：‘*’3.JSONP方法通过动态创建script标签，利用src属性进行访问服务器，服务器需要响应一个前端约定好的函数进行调用并传参，前端定义的函数中接受数据即可。注意该方法只支持get请求。4.代理服务器前端在config文件中添加devser
2021-08-12 14:41:25
189
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人