- 博客(32)
- 资源 (1)
- 收藏
- 关注
原创 数组常见操作,功能扩展(兼容不支持ES6浏览器)
(function (_array) { _array.prototype.forEach = _array.prototype.forEach || function (func) { if (typeof func !== 'function') return; for (var i = 0, len = this.length; i < len...
2019-12-19 13:12:25
313
原创 给input框加 text-overflow:ellipsis在ie浏览器失效 解决方法
最近做一个toB的项目,各种输入框input,要求输入内容超出部分省略号显示, 大概这个效果(项目使用vue框架):代码:<input :title="动态获取对应的value..." style="text-overflow:ellipsis">在火狐, 谷歌 都是差不多如上图的效果, 乖乖 到了ie浏览器变成如下:按理说所有浏览器对text-overflo...
2019-11-09 16:06:57
1481
转载 关于事件冒泡和事件捕获
事件流 JavaScript与HTML之间的交互是通过事件实现的。事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间。可以使用侦听器来预订事件,以便事件发生时执行相应的代码。 事件流的起源:就是在浏览器发展到第四代的时候,浏览器开发团队遇到一个问题:页面的哪一部分会拥有某个特定的事件?要明白这个问题问的是什么,可以想象画在一张纸上的一组同心圆。如果你把手指放在圆心上,那么你的手指指向的...
2019-10-29 17:16:08
177
转载 CSS 中的层叠,层级关系
CSS 中的层叠和块级格式化上下文 1. 层叠上下文 (Stacking Context) 2. 层叠等级 (Stacking Level) 3. z-index 4. 层叠顺序 (Stacking Order) 5. 文档流 (Document Flow) 5.1 常规流 (Normal flow) 5.2 浮动 (Floats) 5.3 绝对定位 (A...
2019-10-11 13:16:06
3364
转载 Vue.js双向绑定的实现原理
Vue.js双向绑定的实现原理 Vue.js 最核心的功能有两个,一是响应式的数据绑定系统,二是组件系统。本文仅探究双向绑定是怎样实现的。先讲涉及的知识点,再用简化得不能再简化的代码实现一个简单的 hello world 示例。 参考文章:https://segmentfault.com/a/1190000006599500一、访问器属性 访问器属性是对...
2019-09-11 10:42:13
174
转载 JavaScript 高性能数组去重
看到个比较数组去重效率的文章蛮有意思的一、测试模版数组去重是一个老生常谈的问题,网上流传着有各种各样的解法为了测试这些解法的性能,我写了一个测试模版,用来计算数组去重的耗时// distinct.jslet arr1 = Array.from(new Array(100000), (x, index)=>{ return index})let arr2...
2019-07-29 13:39:16
170
原创 Vue 使用 vue-cropper实现图片裁剪
1.安装vue-cropper使用npm本地安装vue-croppernpm install vue-cropper --save-dev2.实现代码<template> <div> <div> <div class="pos movediv" :style="cutPhotomodel?'z-index:10':'z-in...
2019-07-26 10:03:26
2187
原创 Vue 项目中 使用 CryptoJS 对请求后端接口获得的数据实现前端加密解密
用到了axios 和CryptoJS, 基本的安装啥的就不废话了直接上封装的代码:import CryptoJS from 'crypto-js/crypto-js'import axios from 'axios';const CancelToken = axios.CancelToken// **************************** 加密代码 *******...
2019-07-25 13:23:33
2018
原创 Vue项目中 国际化 使用Vue-i18n 与 iview不兼容问题解决
最近在使用Vue-i18n做项目国际化, 项目中也使用了iview, 出现以下报错:查看iview源码后发现以下代码:function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var format = (0, _format2.de...
2019-07-16 14:17:46
1586
1
转载 vue中使用Echarts饼图(环状图)
在项目中步骤:<div id="pieChart" class="chart-container"></div>created () { this.initEchart()},methods: { initEchart () { axios.get('/echart').then((res) => { ...
2019-07-05 15:59:31
8335
原创 多行文字,最后一行显示不下省略 纯css
css 代码:多行:overflow : hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; //显示的行数-webkit-box-orient: vertical; 顺便放下单行的:text-overflow: ellipsis;white-space: no...
2019-06-27 18:12:36
1192
原创 ios中 safari浏览器,js时间操作getTime(),getFullYear()等返回显示NaN的解决办法
查了下原因大概是:在IOS5以上版本(不包含IOS5)中的Safari浏览器能正确解释出Javascript中的 new Date('2013-10-21') 的日期对象。但是在IOS5版本里面的Safari解释new Date('2019-5-21') 就不正确,在IOS5的Safari中返回的永远是"Invalid Date"。后来我在网上查找了资料,原来是低版本的Safari解释new ...
2019-05-22 11:23:16
3280
1
原创 js财务金额千位小数格式化 vue
//财务金额千位小数格式化 Vue.prototype.formatSalary = function(num) { // console.log("进来的num",num); num = parseFloat(num).toFixed(2).toString().split("."); // console.log("第一次处理后的num",num); num[0] = n...
2019-03-19 13:43:37
1186
转载 解析vue2.0的diff算法
前言我的目标是写一个非常详细的关于diff的干货,所以本文有点长。也会用到大量的图片以及代码举例,目的让看这篇文章的朋友一定弄明白diff的边边角角。先来了解几个点...1. 当数据发生变化时,vue是怎么更新节点的?要知道渲染真实DOM的开销是很大的,比如有时候我们修改了某个数据,如果直接渲染到真实dom上会引起整个dom树的重绘和重排,有没有可能我们只更新我们修改的那一小块do...
2019-03-15 10:56:46
306
原创 好用的前端相关的网站汇总
1.UEditorhttps://ueditor.baidu.com/website/index.html是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码... 特别适合多文本的页面生成等2.http://hao.shejidaren.com/设计,前端等...
2019-03-05 11:13:34
333
转载 为什么使用v-for时必须添加唯一的key?
v-for中的key使用v-for更新已渲染的元素列表时,默认用就地复用策略;列表数据修改的时候,他会根据key值去判断某个值是否修改,如果修改,则重新渲染这一项,否则复用之前的元素;我们在使用的使用经常会使用index(即数组的下标)来作为key,但其实这是不推荐的一种使用方法;举个
2019-02-20 15:26:41
395
转载 js 的filter()方法
js 的filter()方法filter()方法使用指定的函数测试所有元素,并创建一个包含所有通过测试的元素的新数组。 filter()基本语法: arr.filter(callback[, thisArg]) filter()参数介绍: 参数名 说明 callback 用来测试数组的每个元素的函数。调用时使用参数 (elem...
2019-02-13 19:26:39
1164
转载 margin-left: auto;为什么可以使元素靠右
div { width: 100px; margin-left: auto;}上面的代码可以使得div靠近浏览器的右侧显示是为什么?有点弱智的问题,竟然现在才知道...记录一下The following constraints must hold among the used values of the other properties:'margin-left' ...
2019-02-12 19:52:53
13104
原创 Vue.js 监听路由变化的各种方法
方法一:通过 watch 1 2 3 4 5 6 // 监听,当路由发生变化的时候执行 watch:{ $route(to,from){ console.log(to.path); } }, 或 1 2 3 4 5...
2019-01-28 14:44:32
3514
1
转载 锚点定位 锚点导航 iView3.x Anchor(锚点)组件
首先在main.js中引入iview 3.x我使用部分引用组件的方法所以要单独引入Anchor组件import {Anchor} from 'iview' Vue.component('Anchor', Anchor) // 这两句就可以在页面中使用组件了接着在要使用锚点的页面中引入组件注意:在页面中这里引用的是AnchorLink原因是在页面中Anchor 被渲染成了...
2019-01-22 15:25:52
1673
原创 Vue中用v-model实现父组件和子组件之间的数据通信
<template> <div> <span class="injobs" >{{title}}:</span> <DatePicker type="month" :placeholder="placeholder" v-model="tt"></DatePicker> </div>&l...
2019-01-17 20:14:01
410
原创 注册登录模块常用的正则表达式
邮箱验证:let regExp = /^[A-Za-z\d]+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,4}$/;简洁: .*@.*\..*密码 (长度为为8~32) :let regExp = /^[a-z0-9A-Z_~!@#$^&*,.]{8,32}$/;验证密码只能包含字母数字以及!@#$%^&...
2019-01-15 19:04:48
659
原创 form表单内的button标签自动提交表单,刷新页面
问题描述: (表象)页面内form表单中的button标签,点击后会刷新页面,问题本质: form表单下的按钮在没有指定type类型的时候,如果我们同时给其添加了点击事件的话。会发现我们在点击的时候回默认的把表单也给提交了。问题原因: button标签 Internet Explorer 的默认类型是 "button",而其他浏览器中(包括 W3C 规范)的默认值是 "submit"。...
2019-01-10 14:28:31
1718
原创 Input框内的提示文字变化效果
大致效果如下:点击前,灰色的placeholder的效果(其实不是写在placeholder里的)点击后效果,变小 上移 代码如下:Html:(都是重复的这里就贴了其中一行的)<div> <div class="floatText">手机号</div> <input id="mobileNum" cla...
2018-11-01 15:08:23
3316
原创 浅析 Vue 的生命周期
vue官网的Lifecycle Diagram:Vue实例有一个完整的生命周期,也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、销毁等一系列过程,我们称这是Vue的生命周期。通俗说就是Vue实例从创建到销毁的过程,就是生命周期。它可以细分为8个阶段:beforeCreate(创建前),created(创建后),beforeMount(载入前),mo...
2018-10-09 16:07:42
157
转载 jQuery中事件绑定到bind、live、delegate、on方法的探究
转自https://www.cnblogs.com/EnSnail/p/5838630.html1. 给页面上的某个元素绑定事件,最初采用下面的方式实现: $(‘selector’).click(function(){ //code});缺点:不能同时绑定多个事件,不能绑定动态的元素。后来接触到了on、bind、live、delegate,以下是对它...
2018-09-02 19:48:33
176
原创 网页里的各种宽,高,距离小汇总(offsetHeight,offsetWidth, scrollWidth,scrollHeight...)
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offsetWidth (包括边线的宽);网页可见区域高: document.body.offsetHeight (包括边线的宽);网页正文全文宽: document.body.scrollWidt...
2018-09-02 17:03:46
274
原创 不同的页面加载方式小总结
1.点击按钮,显示一句话,无页面加载事件:$("#btn").click(function () { console.log("Hello"); });2.DOM中的页面加载事件: DOM中页面加载事件,页面全部加载完毕才触发(标签,文字,图片,引入的文件)window.onload=function () { console.log("你好");};3...
2018-09-01 16:45:51
368
原创 浮动,清除浮动
由来浮动最早是用来控制图片,以便达到其他元素(特别是文字)实现“环绕”图片的效果。 后来发现浮动有个很有意思的事情:就是让任何盒子可以一行排列,因此我们就慢慢的偏离主题,用浮动的特性来布局了.什么是浮动元素的浮动是指设置了浮动属性的元素会脱离标准普通流的控制,移动到其父元素中指定位置的过程。在CSS中,通过float属性来定义浮动:选择器{float:属性值(left,righ...
2018-08-30 20:33:56
144
转载 Java语言基础组成:关键字、标识符、注释、常量和变量、运算符、语句、函数、数组
Java语言基础组成:关键字、标识符、注释、常量和变量、运算符、语句、函数、数组一. 关键字【注】关键字的所有的字母都是小写1. 用于定义数据类型的关键字基本数据类型数值型整数:byte(字节) short(短整型) int (整型) long(长整型)浮点数: float(单精度浮点数) double(双精度浮点数)
2017-02-20 05:59:05
550
转载 Java while,do while, for 循环浅析
Java 循环结构 - for, while 及 do...while顺序结构的程序语句只能被执行一次。如果您想要同样的操作执行多次,,就需要使用循环结构。Java中有三种主要的循环结构:while 循环do…while 循环for 循环在Java5中引入了一种主要用于数组的增强型for循环。while 循环while是最基本的循环,
2017-02-12 12:24:11
2243
量子计算 快速傅里叶算法笔记
2018-09-01
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人