自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

人间草木

这个世界哪有什么好人,不过就是坏的程度不一样而已

原创 前端开发过程中需要优化的问题

(1) 减少http请求次数:css script,data uri (2) JS,CSS源码压缩 (3) 前端模板 JS+数据,减少由于HTML标签导致的带宽浪费,前端用变量保存AJAX请求结果,每次操作本地变量,不用请求,减少请求次数 (4) 用innerHTML代替DOM操作,减少DO...

2019-02-26 15:41:44 154 0

原创 封装个人积累的Tool工具插件(vue)——JavaScript排序算法~~冒泡排序,选择排序,插入排序,希尔排序,归并排序,堆排序,快速排序

1.新建一个tool.js文件,写入如下代码,放入 plugins 文件夹内 const tool = {} // 数组排序 (冒泡排序) 方法1 // *简明解释* // 通过依次比较、交换相邻的元素大小(按照由小到大的顺序,如果符合这个顺序就不用交换)。 // 1次这样的循环可...

2019-02-14 13:44:19 120 0

原创 封装个人积累的Tool工具插件(vue) ——持续更新中~~~

1.新建一个tool.js文件,写入如下代码,放入 plugins 文件夹内 const tool = {} // 设置cookie tool.setCookie = (name, value) => { let Days = 30 let exp = new Da...

2019-02-13 19:00:22 185 0

原创 前端开发细节总结 未完待续.........

1、搜索时,文本输入框的内容一般去掉前后空格 let arr = " 2018-11-11 05 " console.log(arr) // 清除左右空格 console.log(arr.trim()) console.log(arr.replace(/(^\s*)|(\s...

2019-01-28 14:45:11 216 0

原创 JS正则表达式(火星文)

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>正则表达式(火星文)</title&...

2020-05-13 13:39:17 513 0

原创 vue方法同步(顺序)执行:async/await使用

项目中有一个地方需要获取到接口返回值之后根据返回值确定之后执行的步骤,使用async搭配await实现,await函数不能单独使用。方法如下: // 车辆布控的详情 通过id 查询 gcbh async getBkxx(id)...

2020-04-24 17:37:18 67 0

原创 input输入框输入小写字母自动转换成大写字母

input输入框输入小写字母自动转换成大写字母有两种方法 1.用js onkeyup事件,即时把字母转换为大写字母: html里input加上 <input type="text" id="txt1" value="" on...

2020-04-22 16:29:21 97 0

原创 vue组件中父子传值双向绑定

效果图 父组件页面 父组件页面引用子组件 父组件用 :parentmessage.sync="hphm" 传递 hphm 给子组件并接收子组件更新过的 hphm <its-hphmInput class="filter-input"...

2020-04-21 17:41:16 44 0

原创 Vue 点击组件外部隐藏组件自身

在开发组件的时候,点击组件外部隐藏组件自身的这种情况很长见到,例如:时间选择框组件,下拉选件等。 示图:点击外层元素隐藏自定义车牌选择框 代码如图中所写: 核心: 1、最外层div中添加一个@click.stop(取消事件冒泡),可以不添加事件名。 2、在mo...

2020-04-15 14:12:23 46 0

原创 记好这 24 个 ES6 方法,用来解决实际开发的 JS 问题

记好这 24 个 ES6 方法,用来解决实际开发的 JS 问题 本文主要介绍 24 中 es6 方法,这些方法都挺实用的,本本请记好,时不时翻出来看看。 1.如何隐藏所有指定的元素 consthide=(...el)=>[...el].forEach(e=>(e.style...

2020-03-12 10:52:19 79 0

原创 12 种使用 Vue 的最佳做法

12 种使用 Vue 的最佳做法 随着 VueJS 的使用越来越广泛,出现了几种最佳实践并逐渐成为标准。在本文中,主要分享在平时开发中一些有用资源和技巧,废话少说,我们开始吧。 1.始终在 `v-for` 中使用 `:key` 在需要操纵数据时,将key属性与v-for指令一起使用可以让...

2020-03-12 10:44:56 49 0

原创 JavaScript的各种日期操作【值得收藏】

前言 虽然现在处理日期方面已经有了很成熟的也很好用的库,例如(momentjs和date-fns),但是在实际开发中,我们有时候可能并不需要整个库。 所以我就在下面整理了在前端开发时对日期时间的各种操作,也算是比较全的了。其中一部分来自自己,还有一部分来源于我们万能的网友~ 获取当前时间戳 ...

2020-01-13 09:52:28 63 0

转载 JavaScript 那些写出来会被同事揍的骚操作

JavaScript 那些写出来会被同事揍的骚操作 Vue社区今天 关注Vue社区,回复“加群” 加入我们一起学习,天天进步 布拉德特皮 juejin.im/post/5e044eb5f265da33b50748c8 前言 曾经,我接手了一份大佬的代码,里面充满了各种“骚操作...

2019-12-30 10:56:15 64 0

原创 ES6入门——前端知识点总结

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" ...

2019-12-06 15:23:25 42 0

原创 ES6字符串新增的 startsWith(), endsWith(),includes()三种实例化方法比较

startsWith()方法 该方法判断一个字符串是否在另一个字符串的头部,返回一个布尔值,true表示存在 let str = 'hello word' console.log(str.startsWith('he')) // true ...

2019-12-05 17:34:51 55 0

原创 DOM 高级工程师不完全指南

“前端框架真的太香了,香到我都不敢徒手撕 DOM 了!” 虽然绝大多数前端er都有这样的困扰,但本着基础为大的原则,手撕 DOM 应当是一个前端攻城狮的必备技能,这正是本文诞生的初衷 —— DOM 并没有那么难搞,如果能去充分利用它,那么你离爱上它就不远了。 三年前我初入前端坑的时候,发现了一...

2019-12-05 10:59:11 46 1

原创 vue中8种组件通信方式, 值得收藏! (面试必问)

vue是数据驱动视图更新的框架, 所以对于vue来说组件间的数据通信非常重要,那么组件之间如何进行数据通信的呢?首先我们需要知道在vue中组件之间存在什么样的关系, 才更容易理解他们的通信方式, 就好像过年回家,坐着一屋子的陌生人,相互之间怎么称呼,这时就需要先知道自己和他们之间是什么样的关系。v...

2019-12-05 09:47:00 48 0

原创 CSS 动画:纯 CSS 实现 loading 效果

效果 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="view...

2019-12-03 10:05:32 32 0

原创 JS中test match replace的三个方法的用法区别

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" ...

2019-12-02 17:28:15 22 0

原创 如何使用原生CSS在DIV层中画一条线?

效果图 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="vie...

2019-11-28 16:25:59 223 0

原创 Vue组件常用的六种通信方式

Vue.js 组件实例的作用域是相互独立的,不同组件之间的数据不能互相访问,组件有父级组件、子级组件、兄弟组件,如何选择组件之间的通信方式?针对常用的 props、$emit/$on、vuex、$parent/$children、$attrs/$listeners、provide/inject 进...

2019-11-22 17:13:34 44 0

原创 div背景框自定义 而且高度自适应 CSS原生实现

效果 代码实现 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name=&quo...

2019-11-21 17:42:05 31 0

原创 JavaScript数组,数组对象去重

数组去重 let arr2 = ['小王', '小王', '小张'] let newArr2 = [...new Set(arr2)] console.log("TCL: newArr2",...

2019-11-14 14:17:01 38 0

原创 iframe 的页面方法调用学习

外部调用iframe里的方法 document.getElementById('test21').contentWindow.saveData() window.test21.saveData(); // test21是iframe的name值 iframe里的界面...

2019-11-12 17:03:23 44 0

原创 Javascript 中的 ...(展开运算符)

曾几何时,ES6/ES2015 对 Javascript 语言进行了重大升级。它引入了许多不同的新功能。其中之一就是我们可以用在任何兼容容器(对象、数组、字符串、集合、映射)前面的三个连续点。这些小点使我们能够编写更加优雅和简洁的代码。在本文中我将会解释这三个点的工作原理,并展示最常见的例子。 ...

2019-11-11 11:11:14 73 0

原创 CSS3 动画(圆点闪烁动画效果的实现)

代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport&q...

2019-11-07 17:13:11 1597 1

原创 JS中获取元素属性的8大方法

在Web前端开发中经常用到的技术:获取元素属性的一系列方法【innerHTML、outerHTML、innerText 、outerText、value、text()、html(),val()】 这些方法,大家应该用过,如果让你说出它们的一些区别和联系,能答得上来吗?接下来让我们一起来温故下。 ...

2019-11-04 18:00:00 115 0

原创 JS 进阶需要掌握的 12 个概念

本文介绍 JS 比较重要的12个概念,但绝对不是说 JS开发人员只需要知道这些就可以了。 1.变量赋值 (值 vs 引用) 理解 JS 如何给变量赋值可以帮助我们减少一些不必要的bug。相反,如果,不理解这一点,可能很容易地编写被无意中更改值的代码。 JS 总是按照值来给变量赋值。这一部分非...

2019-10-29 09:34:25 27 0

原创 Moment.js常用API速查

日常开发经常会用Moment.js来处理时间,现对频繁使用的几个API做下整理,以便日后查阅。 获取时间 moment().valueOf() // 获取时间戳(以毫秒为单位) moment().startOf('day') // 获取今天0时0分0秒 mome...

2019-10-17 10:14:16 26 0

原创 vue中nextTick()方法的使用学习

nextTick() 用于在下次DOM更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的DOM nextTick()是属于异步更新队列 应用场景 在Vue生命周期的created钩子函数进行的DOM操作一定要放在vue.nextTick()的回调函数中 在数据变化后...

2019-10-15 10:23:58 39 0

原创 vue中mixin (混入) 的学习

混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。 index.vue <template> <div class="...

2019-10-11 16:22:52 35 0

原创 移动Web开发小结2

不用说我也知道,此类文章太多太多了,常见的譬如: viewport、强制浏览器全屏、IOS的Web APP模式、可点击元素出现阴影(这个我觉得真没必要去掉,用户点击是需要反馈的,而这个背景色刚刚好提供了一种反馈)等等,太多啦,这些相信大家百度一下就可以查到很多资料???? 本篇文章主要是讲一些...

2019-10-10 16:29:53 44 0

原创 ES6中的var, let, const

var, let, const 这三个东西, 经常会被问到。 汇总一下,基本上就是: var, let, const有什么区别? let, const 有没有变量提升(hosting) ? 什么是TDZ? 首先, 我们先整体的看下区别: 针对这几点, 我们一个个看。 首先, 我们...

2019-10-10 09:55:59 25 0

原创 JS正则表达式大全

正则 迅雷链接 /^thunder:\/\/[a-zA-Z0-9]+=$/ ed2k链接(宽松匹配) /^ed2k:\/\/|file|.+|\/$/ 磁力链接(宽松匹配) /^magnet:\?xt=urn:btih:[0-9a-fA-F]{40,}.*$/ 子网掩码 /...

2019-09-29 15:50:17 68 0

原创 JS Math 对象常用方法 ES5

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <...

2019-09-29 15:12:41 73 0

原创 JS遍历方法大总结

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" co...

2019-09-29 11:57:53 46 0

原创 JS字符串常用方法 ES6

字符串的遍历器接口 ES6为字符串添加了遍历器接口(详见《Iterator》一章),使得字符串可以被for...of循环遍历。 for (let codePoint of 'foo') { console.log(codePoint) } // "f&quo...

2019-09-29 10:55:15 33 0

原创 JavaScript里处理数字的一些常用方法

1.toString()把数值转换为字符串。 let num = 123; console.log(typeof(num)); //number console.log(typeof(num.toString())) //string typeof() 判断数据类型 2.toLocaleSt...

2019-09-29 10:27:48 61 0

原创 Javascript基础——this指向

Javascript的this指向问题,有些人可能觉得很简单,有些人却觉得扑朔迷离,看完本文之后相应会对this的掌握有一个直观的判断,而不是"开局全靠猜"。 敲黑板 function函数this指向由调用方式确定,跟定义环境无关。 箭头函数this指向由定义环境决定,与...

2019-09-27 17:18:20 29 0

原创 vue-router query和params传参(接收参数)$router $route的区别

1.query方式传参和接收参数 传参: this.$router.push({ path:'/xxx', query:{ id:id } }) 接收参数: this.$route.qu...

2019-09-26 16:47:24 59 0

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