zhanghaifeng999-CSDN博客

原创 vue路由导航守卫

vue的路由导航守卫分为:全局守卫，路由独享守卫，组件内守卫全局守卫:router.beforeEach(全局前置守卫)，router.beforeResolve(全局解析守卫)，router.afterEach(全局后置钩子) ,参数为to,from,nextto：即将要进入的目标路由对象from ：当前导航正要离开的路由next ：进行管道中的下一个钩子。如果全部钩子执行完了，则导航的状态就是 confirmed (确认的)。next(false): 中断当前的导航。如果浏览器的 URL

2020-06-06 16:08:22 454 1

原创 vue声明周期及钩子函数

关于vue的声明周期，话不多说先上图由图中可看出红色框的为vue的生命周期的钩子函数。共八个，分别为1.beforeCreated,2.created,3.beforeMount,4.mounted,5.beforeUpdate,6.undated,7.beforeDestroy,8.destroyed关于声明周期的理解，代码如下:<div id="app"> {{ msg }} </div>var vm = new Vue({

2020-06-06 11:06:05 192

原创关于迭代器和生成器

1.迭代器迭代器是一种特殊对象，它具有一些专门为迭代过程设计的专有接口，所有的迭代器对象都有一个next()方法，每次调用都返回一个结果对象。结果对象有两个属性：一个是value，表示下一个将要返回的值；另一个是done，它是一个布尔类型的值，当没有更多可返回数据时返回true。迭代器还会保存一个内部指针，用来指向当前集合中值的位置，每调用一次next()方法，都会返回下一个可用的值。　　如果...

2020-03-22 19:18:17 108

原创 es5,es6jQuery的差集,补集，并集，交集

1.es5var arr1 = [1, 2, 3, 5, 9, 7, 4] var arr2 = [1, 2, 3, 10, 20, 5, 4] // 交集 var intersec = arr1.filter(val => arr2.indexOf(val) > -1) console.log(intersec)...

2020-03-22 18:33:12 189

原创 ajax的get和post请求

（1）get请求没有请求头，post请求要有请求头，请求会带上content—type告诉服务器post过去的数据格式和url的参数的数据一样（2）post发送的数据在请求体中，用户看不到；get发送的数据在地址栏中，用户能看到，不安全（3）涉及隐私数据的时候用 post 请求比较安全，发送大量数据的时候用 post,发送少量数据用get1.get请求(1) 创建var xhr = nu...

2020-03-15 12:15:54 428

原创 jQuery的效果

1.fadeIn 和 fadeOut$(selector).fadeIn(speed,easing,callback);$(selector).fadeOut(speed,easing,callback);可选的 speed 参数规定效果的时长。它可以取以下值：“slow”、“fast” 或毫秒。可选的easing参数"swing" - 在开头/结尾移动慢，在中间移动快，“linear”...

2020-03-10 21:07:21 76

原创 js的时间线及异步加载

js时间线dom解析中1.创建document对象浏览器解析html。 document.readyState = “loading”;2.当遇到外部资源(外部js文件,外部css文件，外部图片，a标签，iframe标签)的时候,除了script标签中的src（当没有设置async，defer）为同步的，其余的全部为异步（主线程去调度子线程完成）,有且只有这一个script 标签中的s...

2020-03-10 18:52:16 109

原创弹性布局和设置百分比的宽高的布局

1.弹性布局（圣杯布局）<div class="wapper"> <div class="header"></div> <div class="contain"> <div class="left"></div> <div class="center"></div> ...

2020-01-14 19:10:10 2856 1

原创城市三级联动

省：<select id="provice"> <option>--请选择--</option> </select> 市：<select id="city"> <option>--请选择--</option> </select> 区：<select id="area...

2020-01-13 21:01:23 131

原创 css3点击切换和普通css移入切换

1.css点击切换先要搞清楚:not选择器和:target选择器:not 比如 :not(p) 为每个并非<p>元素的设置样式target : URL后面跟锚点#，指向文档内某个具体的元素。这个被链接的元素就是目标元素(target element)，:target选择器用于选取当前活动的目标元素<a href="#u1">a</a> ...

2020-01-13 20:28:01 500 1

原创未知高度宽度垂直水平居中

1.弹性盒子<div class="father"> <div class="child">3132</div> </div> .father { width: 200px; height: 200px; border: 1px solid red;...

2020-01-12 20:34:24 103

原创原生js轮播图

<div class="box"> <img src="imgs/1.jpg" alt=""> <div class="gt"> > </div> <div class="lt"> < ...

2020-01-09 20:53:45 82

原创 bootstrap的响应式

Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列栅格系统（官方解释）栅格系统用于通过一系列的行（row）与列（column）的组合来创建页面布局，你的内容就可以放入这些创建好的布局中。下面就介绍一下 Bootstrap 栅格系统的工作原理：“行（row）”必须包含在 .container （固定宽度）或...

2020-01-09 19:56:15 341

原创响应式布局

所谓响应式布局，就是指同一个网页，在不同的终端上的显示效果不同，但是访问的确实是同一个页面，只是因为浏览器会根据终端的不同（例如屏幕宽度、横竖屏、移动端还是pc端等）选择的渲染方式也不同响应式布局常用的方法有媒体查询和bootstrap的栅格化系统(一套代码响应大中小不同屏幕的尺寸，当然界面的布局也有所变化)媒体查询body { margin: 0; padding: 0;...

2020-01-08 20:14:33 78

zhanghaifeng999的博客