
前端
doctoroyy
这个作者很懒,什么都没留下…
展开
-
跨域的几种常见实现方法
一、什么是跨域?先来了解2个概念1. 浏览器的同源策略出于安全的考虑,同源策略控制了从一个源加载的文档或脚本如何与来自另一个源的资源进行交互,例如使用XMLHttpRequest时就会受到同源策略的约束。2. 同源的定义只有当两个站点的协议,主机,端口号全部相同才算是同源,下表是同源策略的检测示例:URL结果原因http://store.company.com/...原创 2020-01-15 16:51:54 · 1018 阅读 · 1 评论 -
【前端】模拟实现JavaScript中的apply, call函数
1.apply(thisArg, [argsArray])在实现之前,首先看一下MDN上关于apply函数的说明:apply() 方法调用一个具有给定this值的函数,以及作为一个数组(或类似数组对象)提供的参数。apply函数会将当前调用函数的this绑定在thisArgs上,我们知道,在JavaScript中,常见的函数绑定this的方法除了apply,call之外,还会在函数被当做...原创 2019-12-24 23:55:52 · 167 阅读 · 0 评论 -
一次网站性能优化经历
六月份开始搭建的自己的第一个网站:书虫小说。在经历前端页面重写后,网站首屏加载速度有了一定提升,之后发现小说目录详情页白屏时间竟然高达1-2s,拖了一段时间,打算解决这个问题,我用Chrome调试抓包发现json数据包大小竟然有200多KB,测试了一下加载时间大概在700ms-1500ms,由于章节列表的生成依赖于这个数据,所以自然会产生很长一段时间的白屏,我打算先解决这个问题。server传...原创 2019-11-05 13:39:59 · 204 阅读 · 0 评论 -
【前端】可视化之快速排序
在线体验设计思路1. 排序算法部分快速排序的思想就是在序列中选择一个支点pivot, 让小于pivot的元素放在它的左边,不小于(说大于的话不准确)它的元素放在它的右边。visualgo.net 的实现,维护三个序列,s1, s2, unknowns1中存放小于的元素,s2中存放不小于支点的元素,unknown是未排序序列(具体的区分在动画中很清楚)function partiti...原创 2019-11-01 00:16:42 · 402 阅读 · 0 评论 -
【前端】可视化之冒泡排序
实现思路使用js移动元素位置,利用css的transition属性实现过渡动画。在线体验创建一个数组arr,数组的每一项保存着节点元素的文本值(innerText)和元素在节点列表中的索引nodeIndex, 因为接下来的并不是真的交换两个节点,而是交换两个节点的位置(可能有点不好理解)。function init() { let fragment = document.create...原创 2019-10-25 17:03:52 · 375 阅读 · 0 评论 -
【前端】水平垂直居中的几种方式
1. flex 布局flex布局也叫弹性布局,我认为flex box布局是一种十分优雅的布局方式,兼容性一般,使用起来非常简单。display: flex;// flex-direction默认是rowjustify-content: center; //水平居中align-items: center; //垂直居中2. 绝对定位 + margin 负边距给元素设置定位absolu...原创 2019-10-03 01:01:06 · 3167 阅读 · 1 评论 -
【前端】如何用CSS画一个三角形?
首先观察测试如下代码:<style type="text/css"> div { width: 100px; height: 100px; border-color: red orange yellow green; border-width: 20px; border-style: solid; b...原创 2019-07-20 17:52:39 · 1146 阅读 · 0 评论 -
Vue.js学习手记
目录入门Vuex如何让Vue项目打包后显示favicon?入门6月22日开始学习Vue,总的来说感觉这是一个比较好上手的框架。但是刚刚遇到一个坑,在使用router-link组件给:to传一个对象时,发现不能生成正确的路径。打开Chrome调试工具,看到下面这一行,我的标签是这样写的<router-link :to="{name:'sign-up'}">...原创 2019-06-27 21:03:52 · 173 阅读 · 0 评论