自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(10)
  • 收藏
  • 关注

原创 Vue项目优化(代码优化)

一、代码优化1、使用keep-aliive包裹动态组件在动态组件中的应用:<keep-alive :include="whiteList" :exclude="blackList" :max="amount"> <component :is="currentComponent"></component></keep-alive>在vue-router中的应用:<keep-alive :include="whiteList"

2020-10-30 11:38:34 453

原创 简单了解CSS Hack

什么是CSS Hack?一般来说,CSS Hack 就是针对不同的浏览器写不同的css。CSS Hack常见的有三种形式:属性Hack、选择符Hack、条件注释Hack (Hack主要针对IE浏览器)例:1、条件Hack条件注释只有在IE浏览器下才能执行,这个代码在非IE浏览下被当做注释视而不见。可以通过IE条件注释载入不同的CSS、JS、HTML和服务器代码等。<!--[if IE]> <p>你在非IE中将看不到我的身影</p><!

2020-10-29 08:32:38 509

原创 事件委托

概念:事件委托 又称 事件代理,就是利用事件冒泡,将子元素的事件绑定到父元素上,如果子元素阻止了事件冒泡,那么事件委托也无法进行。优点:提高性能;减少事件绑定,从而减少内存占用。案例我们经常遇到Vue中v-for一个列表,列表的每一项都绑定了@click处理事件。我们都知道绑定这么多监听,从性能方面来说是不太好的。那我们我们可以通过把每个item的click事件委托给父元素的形式来实现。例如:获取item元素中title值为edit的id//html<table @click="e

2020-10-28 10:32:16 324

原创 Null 与 Undefind 的区别

null表示没有对象,可能将来要赋值一个对象1、 作为函数的参数,表示该函数的参数不是对象2、作为对象原型链的终点undefind表示缺少值,即此处应该有值,但没有定义1、定义了形参,没有传实参,显示undefined2、对象属性名不存在时,显示undefined3、函数没有写返回值,即没有写return,拿到的是undefined4、写了return,但没有赋值,拿到的是undefinednull和undefind的相同点在javaScript中null和Undefind几乎相等

2020-10-28 09:31:14 351

原创 for···in 与 for···of 的区别

for···in 取 key,for···of 取 value遍历数组:for···in 遍历的是key(下标),for···of 遍历的是value(数组的值);var arr = [99,88,66,77];for(let i in arr){ console.log(i); //0,1,2,3}for(let i of arr){ consoel.log(i); //99,88,66,77}遍历字符串: 同遍历数组一样;遍历对象:for···in 遍历的是

2020-10-28 08:58:13 363

原创 常见浏览器内核

浏览器/RunTime内核(渲染引擎)Chrome谷歌之前Webkit,已改Blink内核FireFox火狐GeckoSafari苹果WebkitIETridentOpera欧朋现已改用Google Chrome的Blink内核

2020-10-26 09:36:15 115

原创 文字超过一行(两行)显示省略号

//一行white-space:nowrap;overflow:hidden;text-overflow:ellipsis;//两行 text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;

2020-10-15 10:03:38 522

原创 闭包——解决闭包缺陷

什么是闭包?可以把闭包简单理解成“定义在一个函数内部的函数”。 即函数嵌套函数,内部函数可以访问外部函数的变量为什么要使用闭包?javascript语言的特殊处就是函数内部可以读取全局变量。我们有时候需要得到函数内的局部变量,但是在正常情况下,这是不能读取到的,这时候就需要用到闭包。闭包的应用场景1、封装对象的私有属性和方法(隐藏数据,做一个简单的缓存工具)2、闭包作用回调函数3、函数节流防抖函数节流:是确保函数特定的时间内最多执行一次。函数防抖:是函数在特定的时间内不被再调用后

2020-10-15 09:51:15 467

原创 图片懒加载原理

什么是图片懒加载?当打开一个有很多图片的页面时,先只加载页面上可视区域的图片,等滚动到页面下面时,再加载所需的图片。这就是图片懒加载。图片懒加载的作用减少或延迟请求数,缓解浏览器的压力,增强用户体验。图片懒加载的基本原理1、设置图片src属性为同一张图片,同时自定义一个data-src属性来存储图片的真实地址2、 页面初始化显示的时候或者浏览器发生滚动的时候判断图片是否在视野中3、 当图片在视野中时,通过js自动改变该区域的图片的src属性为真实地址1.document.documentEl

2020-10-06 08:20:36 243 5

原创 小程序生命周期

可参考:https://www.cnblogs.com/fozero/p/7868560.htmlonLaunch : function () { // 生命周期函数--监听初始化(全局只触发一次)onLoad: function () { // 生命周期函数--监听页面加载 onReady: function () { // 生命周期函数--监听页面初次渲染完成 }, onShow: function () { // 生命周期函数--监听页面显示 }, onHide: f

2020-10-05 09:28:23 118

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除