
aliven的专栏
有关前端的学习笔记
aliven1
前端工程师,技术栈:PS、AI、H5、CSS3、JS、TS、jQuery、vue、react、微信小程序、node、express、svn、git、webpack
展开
-
敏捷开发角色流程图
敏捷开发角色流程图原创 2022-11-25 09:39:27 · 299 阅读 · 0 评论 -
数组的扩展,es6的扩展运算符(...)
转载 2018-06-14 08:28:54 · 337 阅读 · 0 评论 -
ie获取全局样式currentStyle的问题
getStyle=function(obj,attr){ //获得对象的属性值,含单位 if(obj.currentStyle){ //ie作为属性存在 return Number.parseFloat(obj.currentStyle[attr]); }else{ return Number.parseFloat(getComputedStyle(obj,100)[attr]);//...原创 2018-05-30 14:52:11 · 980 阅读 · 0 评论 -
键盘键值表
转载 2018-05-11 09:55:38 · 692 阅读 · 0 评论 -
jq中prop和attr的区别
prop()函数的结果: 1.如果有相应的属性,返回指定属性值。 2.如果没有相应的属性,返回值是空字符串。attr()函数的结果: 1.如果有相应的属性,返回指定属性值。 2.如果没有相应的属性,返回值是undefined。对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方...原创 2018-05-02 17:02:45 · 335 阅读 · 0 评论 -
array五种迭代方法every() /filter() /forEach() /map() /some()
1.every() 和 some()every()是对数组中的每一项运行给定函数,如果该函数对每一项都返回true,则返回true。some()是对数组中的每一项运行给定函数,如果该函数对任一项返回true,则返回true。every()和some()很相似,他们都用于查询数组中的项是否满足某个条件,对every()来说,传入的函数必须对每一项都返回true,这个方法才返回true;否则,则返回f...转载 2018-04-24 15:32:12 · 221 阅读 · 0 评论 -
webpack加载公共js--减少请求优化代码
原创 2018-04-19 16:53:26 · 1047 阅读 · 0 评论 -
input中type为date时value无法赋值问题
为data的时候,value赋值,中间的日期间隔符号用“-”,而不是“/”,否则初始化赋值原创 2018-04-13 17:01:26 · 11934 阅读 · 0 评论 -
webpack4的写法注意点
先全局安装,再在项目中安装,用webpack -v检查是否安装成功,如果提示不是内部命令,就要配置环境变量和用户变量由于webpack 默认的入口文件是从./src/index.js,输出是./dist/main.js 。因此可以直接 webpack --mode developmenthttps://segmentfault.com/a/1190000014142975WARNING in co...原创 2018-04-12 16:14:36 · 704 阅读 · 0 评论 -
npm配置全局路径和webpack使用问题
npm安装好以后可以配置根据npm包安装插件的路径webpack不是内部命令的解决方法:然后再根据这个路径配置系统变量:NODE PATH:D:\Program Files\nodejs\node_global 用户变量:PATH:D:\Program Files\nodejs\node_global如果安装的是最新的web...原创 2018-04-12 13:07:22 · 2209 阅读 · 0 评论 -
require主入口写法1
加载模块的路径还是根据baseUrl来写,加载模块数组中的顺序不影响执行,模块内部的图片路径不根据baseUrl来写,而是根据注入页面的index来写define(),定义块的时候,第一个参数还是数组形式,里面可以传入依赖模块.路径以当前路径为准-----------------------------------------------------------------------------...原创 2018-04-11 20:23:46 · 522 阅读 · 0 评论 -
图片懒加载案例
运用插件实现图片懒加载https://www.cnblogs.com/liliangel/p/6122836.html转载 2018-04-11 09:14:57 · 764 阅读 · 0 评论 -
apply和call的用法
每个JavaScript函数都会有很多附属的(attached)方法,包括toString()、call()以及apply()。听起来,你是否会感到奇怪,一个函数可能会有属于它自己的方法,但是记住,JavaScript中的每个函数都是一个对象。Function.apply(obj,args)方法能接收两个参数obj:这个对象将代替Function类里this对象args:这个是数组,它将作为参数传...原创 2018-04-04 08:50:57 · 273 阅读 · 0 评论 -
鼠标右键弹框事件,阻止默认自定义函数
方法一$(function () { $ ( "p" ).contextmenu(function() { alert( "Hello World!" ); return false; }); })方法二:function rightclick(rela_node,leftn,topn){ docu...原创 2018-04-03 17:04:18 · 1199 阅读 · 0 评论 -
webpack入门资料
入门好文:https://www.jianshu.com/p/42e11515c10f注册:2227969247生产的时候,仍然需要用的东西用–save;不需要的一些包,只是在开发时借用环境什么的,可以直接用–save-dev本地安装的重要性: 因为我们需要的包可能有十个,他们之间相互依赖的,如果我们使用全局包,那么每次包的升级、更新等就会影响你的多个项目,那么依赖关系就会被破...原创 2018-03-30 18:07:55 · 190 阅读 · 0 评论 -
margin和padding的坑
有些情况,元素设置的padding部分,不会触发元素绑定的一些事件,像click等,但是如果换成子元素的margin,就没问题了原创 2018-03-29 15:04:37 · 2486 阅读 · 0 评论 -
用js onselectstart事件鼠标禁止选中文字
<div style="width:100px" onselectstart="return false">这里面的文字是不能被鼠标选中的</div>$(this).get(0).onselectstart=function(){return false;};原创 2018-03-29 14:59:16 · 1167 阅读 · 0 评论 -
动态加载模块
js中加载动态加载css,依赖require中的css.js转化css,动态加载js,js需要用define定义模块,并且通过一个对象返回,需要调用的地方,用如下方式调用,当然也可以用getScript的方式调用:...原创 2018-03-28 10:12:46 · 1101 阅读 · 0 评论 -
highstock中配置rangeSelector(时间周期按钮的样式)(二)
图标设置日期跨度的样式和事件按钮的样式:原创 2018-03-23 14:55:28 · 1676 阅读 · 0 评论 -
highstock中配置rangeSelector(时间周期按钮的样式)
修改按钮的样式https://code.hcharts.cn/shuang123/rKET8W$(function(){ $("#container").highcharts("StockChart",{ chart : { animation :false, width:765, height:345, ...原创 2018-03-23 14:07:01 · 2862 阅读 · 0 评论 -
js逻辑与逻辑或
&&:与运算符如果两边的操作数,一个不是布尔值,与运算就不一定返回布尔值;1.第一个操作数是对象,则返回第二个操作数;var a={}&&5a=5;2.第二个操作数是对象,则第一个操作数返回true时,才返回第二个对象,否则返回false;3.有一个操作数是null(undefined),则返回null(undefined);4.与操作符属于短路操作,如果第...原创 2018-03-15 17:15:50 · 1904 阅读 · 0 评论 -
RequireJS按需加载样式文件
https://segmentfault.com/a/1190000002390643转载 2018-03-08 15:20:35 · 1131 阅读 · 1 评论 -
webpack中的html-wepack-plugin中设计的ejs链接
https://www.jianshu.com/p/81ea81d291fd<%=title%>加了等号是取值<%for(var key in arr){%> 不加等号是运行js <%=key%><%}%>原创 2018-02-27 16:28:37 · 788 阅读 · 0 评论 -
base64图片存储超过2M的解决方案
toDataURL():我们要获取 canvas 中图片的信息,用 toDataURL 就可以转换成上面用到的 DataURL // dataURL 的格式为 “data:image/png;base64,****”,逗号之前都是一些说明性的文字,我们只需要逗号之后的就行了,所以用img.split获得逗号后面的字符串在javascript中如何使用Base64转码var str = 'javas...转载 2018-02-26 15:10:06 · 33214 阅读 · 0 评论 -
jsonp跨域的问题
dataType:jsonp跨域请求,只能用get方式请求;转载 2018-02-26 10:58:48 · 179 阅读 · 0 评论 -
highchart画完表之后,把图片变成base64字符串,存后台,在其它地方调用
1.使用highchart自带exporting.js中getSVG()方法获取(需引入exporting.js);这种方式获取的数据较完整,或根据画布大小等因素自动适应,图表不会变形,渲染较好var chartData = $("#container").highcharts().getSVG();2.引入canvg.调用canvg,用canvg将svg数据转换到canvas中原创 2018-02-02 18:51:48 · 2208 阅读 · 2 评论 -
操作数组的变异方法和非变异方法
变异方法 (mutation method),顾名思义,会改变被这些方法调用的原始数组push()pop()shift()unshift()splice()sort()reverse()也有非变异 (non-mutating method) 方法,例如:filter(),concat()和slice()。这些不会改变原始数组,但总是返回一个新数组。当使用非变异方法时原创 2018-01-30 17:14:35 · 4733 阅读 · 0 评论 -
requirejs的用法
/*没有用require中的define,用普通方式定义的函数,在requirejs中怎么使用*/function hello(){console.log('hello,大家好ffffffffff');}function hello2(){console.log('hello2,大家好hhhhhhhh');}1.直接应用即可原创 2018-01-18 16:49:16 · 298 阅读 · 0 评论 -
jquery中的data和给原生dom绑定变量类似
jquery中的data:$("div").data("blah"); // undefined$("div").data("blah", "hello"); // blah设置为hello$("div").data("blah"); // hello$("div").data("blah", 86); // 设置为86$("div").data("blah"); //原创 2018-01-17 16:59:21 · 925 阅读 · 0 评论 -
JSON.parse和JSON.stringify转化失败的原因
1.所转化的内容是否为严格的json格式:例如: var text = "{"alpha_list": [NaN, NaN,NaN], "tracking_error_list": [0.0, 0.06, 0.044, 0.115, 0.1, 0.091, 0.091, 0.085, 0.317, 0.347, 0.332, 0.318]}";如果后台生成数据的时候,把应该是数字的字段生成为N原创 2018-01-17 15:34:02 · 17818 阅读 · 2 评论 -
rem单位的使用,做响应式网站
var fun = function(doc, win) {var docEl = doc.documentElement, resizeEvt = 'orientationchange'in window ? 'orientationchange' : 'resize', recalc = function() {var clientWidth = d转载 2017-12-29 20:13:01 · 3298 阅读 · 1 评论 -
判断多选框等是否是选中状态
$.each(checkboxall,function(){var that=$(this);console.log('1')if(that.is(':checked')){console.log('c')};});翻译 2017-12-28 16:38:35 · 2651 阅读 · 0 评论 -
require的用法
1.require.js会在加载完成以后通过回调方法去加载这个data-main里面的js文件;2.在path配置了一个模块ID和路径的映射,这样在后续的所有函数中就可以直接通过模块ID来引入依赖,而不用再多次引入依赖多次输入路径带来的麻烦;require.config( { paths: { 'jquery':转载 2017-12-23 14:19:36 · 3837 阅读 · 0 评论 -
requirejs的优势
异步“加载”。我们知道,通常网站都会把script脚本的放在html的最后,这样就可以避免浏览器执行js带来的页面阻塞。使用RequireJS,会在相关的js加载后执行回调函数,这个过程是异步的,所以它不会阻塞页面。按需加载。通过RequireJS,你可以在需要加载js逻辑的时候再加载对应 的js模块,这样避免了在初始化网页的时候发生大量的请求和数据传输,或许对于一些人来说,某些模块可能他根本就不转载 2017-12-23 14:06:59 · 743 阅读 · 0 评论 -
获得时间戳转为北京时间
function toggleTstamp(timestamp){/*1.重写了toLocaleString方法*/Date.prototype.toLocaleString = function() { return this.getFullYear() + "年" + (this.getMonth() + 1) + "月" +原创 2017-12-21 17:14:52 · 5240 阅读 · 0 评论 -
在router中设置store中的数据
router的index文件中:1.import store from '../store/index'2.router.beforeEach((to,from,next)=>{ store.dispatch('updateUrl',from.path); next(); })3.store中:...原创 2019-07-30 15:08:15 · 8728 阅读 · 1 评论 -
qrcodejs2生成支付二维码
这里推荐使用vue-qriously生成二维码在一次开发中需要前端自己生成二维码图片,所以使用了qrcode.js 这个插件原创 2019-07-18 17:17:43 · 2482 阅读 · 0 评论 -
vue编程式导航传参和获取参数
转载 2019-07-17 08:47:37 · 2847 阅读 · 0 评论 -
vue自定义正在加载动画
loadingTimer(){ clearInterval(this.$el.loading_timer); const rotate_angle=30,speed=90; this.$el.loading_timer=setInterval(()=>{ const rotate_el=this.$el.querySelector('.rotate'); ...原创 2019-07-15 17:39:53 · 1885 阅读 · 0 评论 -
前端MD5加密
https://www.youkuaiyun.com/gather_22/MtTaAgwsNzQxNS1ibG9n.html转载 2019-07-08 15:04:21 · 938 阅读 · 0 评论