- 博客(22)
- 收藏
- 关注
原创 js常用工具函数
1.邮箱 export const isEmail = (s) => { return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s) } 2.手机号码 export const isMobile = (s) => { return /^1[0-9]{10}$/.test(s) } 3.电话号码 export const isPhone = (s) => {
2022-03-01 16:50:30
165
原创 flex集成
/* 弹性布局 */ .flex-box{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .jc-center{ -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } .jc-felx-end{ -webki
2021-07-16 14:56:59
141
原创 css3面试题
1-display有哪些属性。 2-用css隐藏div有哪些方法,区别是什么。 3-让一个盒子水平垂直居中有哪几种方案。 4-css清除浮动有哪几种方案 5-说说position属性 6-说说flex布局 7-
2021-04-18 17:09:47
136
原创 vue面试题整理
1-vue生命周期 2-vue导航钩子 3-vue双向绑定的原理 4-讲讲vuex 5-vue计算属性和watch的区别是什么。 6-vue属性改变却没有渲染的解决方案。 7-v-show和v-if区别 8-vue怎么实现权限控制 9-$route和$router区别 10- ...
2021-04-18 16:55:50
182
原创 js面试题整理
1-js的数据类型 基本数据类型包含number,string,null,undefined,boolean,以及es6新增的symbol 引用类型 object 2-基本数据类型和引用类型的区别 存放方式不同,基本数据类型存放在栈中,引用类型存放在堆中 3-回流和重绘。 4-浏览器的渲染过程。 5-行内元素和块级元素的区别,以及它们之间的转换 6-选择器的优先级 7-说说bfc 8-清除浮动的方法 9-什么是盒模型 10- 垂直水平居中的实现方案。 11-link和@import
2021-04-18 16:55:00
145
1
原创 js知识点
1-js的数据类型 引用类型-number,string,null,undefined,boolean,symbol 引用类型-object 2-判断变量的类型 typeof-typeof对大多数的类型判断都是正确的,返回的都是小写的字符串类型,但是无法区分数组,null,和真正的Object,它的判断都是object Object.prototype.toString.call() instanceof 3-数据类型转换 4-原型和原型链 5-闭包,闭包的优缺点 闭包就是能够读取其他函数内
2020-08-18 15:54:27
138
原创 css隐藏div三种方法
1-display:none 设置为display:none;的元素将不会再占用页面空间,其占用的空间会被其他元素所占有,从而会引起浏览器的重排和重汇。 2-visibility: hidden 虽然能够隐藏元素,但是该元素仍会占用页面空间,因此只会导致浏览器的重汇而不会引起重排。 3-opacity:0 设置元素透明度opacity属性为0,也可以隐藏页面元素,在呈现上与visibility:hidden;方式一样,同样会占据页面空间。 差异性 display:none;的元素会直接从页面上
2020-07-30 15:20:06
1455
原创 盒子水平垂直居中的五大解决方案
通过定位有三种解决方式 1-必须知道具体宽高 <style> html, body{ height: 100%; overflow: hidden; } body{ position: relative; } #box{ width: 100px; height: 50px; background: #f30303; position: absolute;
2020-07-22 18:35:53
339
原创 css清除浮动
1-添加空标签,并设置样式:clear:both <div style="clear: both;"></div> 2-在要清除浮动的父级元素,添加样式:overflow:hidden <style> .wrap{ overflow: hidden; } .left,.right{ width: 200px; height: 200px; } .left{ float: le
2020-07-13 15:26:37
139
原创 jquery移动端分页上拉加载
$(function(){ let pageNo = 1 //定义页数 let pageSize = 10 //定义加载条数 showDate() //执行加载数据函数第一页 //滚动条触底判断 $(window).scroll(function(){ let scrollTop = Math.ceil($(this).scrollTop()) //滚动条与顶部的高度 let curHeight = $(this).height() .
2020-07-12 21:03:54
979
原创 图片懒加载
为什么要使用图片懒加载 当我们进入到某个页面的时候,会有许多图片,有些图片可能在下面,当我们点进页面没有滑动全部展示时,其实下面的图片是没有作用的。而且还降低了网页的加载速度,懒加载就是只有滚动到可视区域时才加载当前的图片。也就是说不是一次性加载所有的图片,从而在一定程度上减少服务端的请求和带宽。 懒加载的优点 提高前端性能,图片在需要加载的时候才加载,减少服务端的负担,提高页面加载速度,减少带宽请求。 懒加载的实现原理 图片的加载都是由src的值引起的,当对src赋值时浏览器会请求图片资源,基于
2020-07-12 17:06:41
149
原创 防抖和节流
1-防抖:指触发事件后,在n秒内函数只执行一次,若在n秒内再次触发则重新计算,防抖debounce一般常用解决办法有两种 延迟执行,操作结束后到指定时间才执行 function debounce(func,wait) { let timeout return function() { if(timeout) clearTimeOut(timeout) timeout = setTimeout(function(){ func.app
2020-07-12 15:05:45
152
原创 es6的一些常用新特性
1-变量let,const 不存在变量提升 同一个作用域下不能重复定义同一个名称 有着严格的作用域 const声明的变量只可读,不可改变值,let可以。 2-箭头函数=> 一行代码可以不写return 不用重新绑定this指向 3-参数展开和扩展 ... 的运用 收集剩余的参数 function show(a,b,...args){ console.log(args) } 展开参数 function show (...args){} show(12,5,6,7) //...
2020-07-12 14:43:36
175
原创 js事件冒泡
js冒泡指的就是js事件的向上传导,当后代元素上的事件被触发时,祖先元素的相同事件也会被触发。 冒泡可以通过事件对象来取消冒泡以下为两种方法 event.cancelBubble = true event.stopPropagation() ...
2020-07-11 23:51:06
145
原创 this和arguments
在调用函数时,解析器每次都会传递进两个隐含的参数this和arguments this为函数的上下文对象 以函数的形式调用时,this永远都是window 以方法的形式调用时,this指向的是调用方法的对象 以构造函数的形式调用,this是新创建的那个对象 使用call和apply调用时,this是指定的那个对象 arguments为封装实参的对象,arguments是一个类数组,可以通过索引来操作也可以获取长度,调用函数时传递的实参都会在arguments中保存,里面有一个属性叫callee,就
2020-07-11 23:44:56
385
原创 js函数执行call()和apply()
call()和apply()的共同点 1-都是函数对象的方法,需要通过函数对象调用。 2-当函数调用call()和apply()都会执行 3-在调用call()和apply()时,可以将一个对象指定为第一个参数传进去,此时这个对象会变成函数执行时的this call()和apply()的区别 call()可以将参数实参在对象之后依次传递,列如下 fun.call(obj,2,3,3) apply()需要将实参封装到一个数组中统一传递,列如下 fun.apply(obj,[2,3,3])
2020-07-11 23:33:03
354
原创 js垃圾回收
js垃圾回收机制 1-当一个对象没有任何的变量或属性对它引用,此时我们将永远无法操作该对象,此时这种对象就是一个辣鸡,这种对象过多会占 用大量的内存空间,导致程序运行变慢,这种辣鸡必须清理。 2-js有自动垃圾回收机制,会自动将这些垃圾对象从内存中销毁。我们不需要也不能进行垃圾回收操作。 3-我们需要做的只是将不再使用的对象设置为null即可。 ...
2020-07-11 23:21:10
107
原创 js原型-prototype
原型定义 1-创建的每一个函数,解析器都会向函数中添加一个属性prototype。这个属性对应着一个对象,这个对象就是所谓的原型对象。 2-当函数以构造函数的形式调用时,它所创建的对象中都会有一个隐含的属性,指向构造函数的原型对象,我们可以通过 __proto__来访问该属性。 3-原型对象相当于一个公共的区域,所有同一个类的实例都可以访问到这个原型对象,我们可以将对象中共有的内容,统一设置到原型对象中。 4-当我们访问对象的一个属性或方法时,它会先在对象自身中寻找,如果有则直接使...
2020-07-11 23:03:15
116
原创 vue商品添加至购物车的下落动画
html和css部分 <div class="ball-curve"> <transition @before-enter="beforeEnter" @enter="enter" @after-enter="afterEnter"> <div class="ball" v-show="ball.show"> <div class="animationes">
2020-05-17 15:25:49
509
原创 transition与display冲突问题
记录一下,一次vue项目中,写添加购物车小球下落动画的时候,刚好碰到过因为操作display来显示隐藏小球而导致transition动画没效果,后面改用v-if或v-show来实现显示隐藏,动画完美实现。
2020-05-17 15:05:57
222
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人