![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
javascript
肖ZE
这个作者很懒,什么都没留下…
展开
-
JSON
const obj = JSON.parse(jsonStr)const jsonStr = JSON.stringify(obj)但是以上方法存在弊端,要求 jsonStr 是严格的 json 格式解决:const a = '{\'a\': 1}';console.log(JSON.parse(a)); // 错误(非严格 json 格式)// 正确console.log(eval('(' + a + ')'));console.log((new Function('return '原创 2020-09-03 16:19:50 · 172 阅读 · 0 评论 -
js 下载 base64 格式的图片
download() { this.resultDialog.picture.map((res, i) => { this.downloadFile(`证据 ${i + 1}.png`, res) // 此处 res 为 base64 数据图片 }) }, downloadFile(fileName, content) { ...原创 2020-02-23 12:52:55 · 3282 阅读 · 1 评论 -
模糊搜索高亮显示
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...原创 2020-01-01 20:27:33 · 544 阅读 · 0 评论 -
canvas 实现拖拽选框、放大缩小等功能
<template> <div class="edit-anchor-zone"> <div class="edit-toolbar"> <span class="toolbar-icon-wrap" :class="{'icon_active': isAnchorActive}"> <el-toolt...原创 2019-12-19 18:42:16 · 3577 阅读 · 2 评论 -
js——Fetch
关于 fetch取消 FetchES6以后Promise 出现解决地狱回调等不优雅的代码风格。个人理解这个更像是一个生产者和消费者的关系,查看 Promise文档,有以下两个方法Promise.race([promise1,promise2]) 传入多个Promise对象,等待最快对象完成Promise.all([promise1,promise2]) 传入多个Promise 对象,等待...原创 2019-11-21 09:58:01 · 190 阅读 · 0 评论 -
js——设计模式
设计模式设计模式是一种在长时间的经验与错误中总结出来可服用的解决方案。设计模式主要分为3类:创建型设计模式:专注于处理对象的创建Constructor构造器模式,Factory工厂模式,Singleton单例模式,builder生成器模式结构型设计模式:对象间组合,建立对象之间的关系Decorator装饰者模式,Facade外观模式,Flyweight享元模式,Adapter适配...原创 2019-08-17 14:37:03 · 205 阅读 · 0 评论 -
百度地图点聚合优化重写
/** * @fileoverview MarkerClusterer标记聚合器用来解决加载大量点要素到地图上产生覆盖现象的问题,并提高性能。 * 主入口类是<a href="symbols/BMapLib.MarkerClusterer.html">MarkerClusterer</a>, * 基于Baidu Map API 1.2。 * * @author B...原创 2019-11-10 11:00:09 · 667 阅读 · 0 评论 -
js——replace (驼峰式命名规则转换)
驼峰式命名规则转换function camelize(str) { return str.replace(/-(\w)/g, function (_, c) { return c ? c.toUpperCase() : '' })}console.log(camelize('hello-world')); // helloWorldreplacestr...原创 2019-11-10 00:02:17 · 1348 阅读 · 0 评论 -
js——获取标签的方法
var tag=document.getElementById('id'); //[i]:代表获取第几个同名标签 var tag=document.getElementsByClassName('className')[i]; //className:类名 var tag=document.getElementsByTagName('tagName')[i]; //tag...原创 2018-08-26 11:12:37 · 2973 阅读 · 0 评论 -
js——自定义:checkValidity( )和setCustomValidity( )
checkValidity( ):input元素中的数据合法返回true,反之返false setCustomValidity( ):设置validationMessage属性值,用于自定义提示 validationMessage:输出提示<body><p>输入数字并点击验证按钮:</p><input type="number" id="nu"...原创 2018-08-26 10:55:48 · 4147 阅读 · 0 评论 -
js——undefined null 和forms[ ]用法
undefined和null undefined:变量、属性和方法 null:对象对象只有被定义才有可能为null,否则为undefined//测试p是否存在if(p !== null &amp;&amp; typeof p !== 'undefined')//错误if(typeof p !== 'undefined' &amp;&amp; p !== null)//正确 先用ty...原创 2018-08-26 10:34:26 · 134 阅读 · 0 评论 -
js——Math对象 Date对象
Math对象:var value=Math.PI;var value=Math.sqrt(15);对象属性E——返回算术常量 e,即自然对数的底数(约等于2.718)。 LN2——返回 2 的自然对数(约等于0.693)。 LN10——返回 10 的自然对数(约等于2.302)。 LOG2E——返回以 2 为底的 e 的对数(约等于 1.414)。 LOG10E——返回以 1...原创 2018-08-26 09:59:02 · 266 阅读 · 0 评论 -
js/vue/jq——事件委托
事件委托好处: 1,性能好 2,新添加的元素还会有之前的事件js事件委托window.onload = function(){ var Ul = document.getElementById(&quot;ul&quot;); var Li = oUl.getElementsByTagName(&quot;li&quot;);/*event:事件源,在哪个事件中,操作的那个元素就是事件源ie浏览器:windo...原创 2018-08-26 09:32:20 · 825 阅读 · 0 评论 -
js——属性和属性节点 样式操作
属性: 对象身上保存的变量就是属性ele[attr];//获取属性ele[attr]=value;//设置属性属性节点: 在html添加的属性就是属性节点,保存在attributes里面ele.getAttribute(attr);//获取属性节点ele.setAttribute(attr,value);//设置属性节点...原创 2018-08-25 16:25:31 · 1757 阅读 · 0 评论 -
js——添加或删除元素节点(append 和 innerHtml) 节点访问关系 节点属性
1、append原理: //添加 var para=document.createElement('p');//创建新的p标签 var node=document.createTextNode('这是一个段落');//创建一个文本节点 para.appendChild(node);//向p追加此文本节点 para.className=&amp;amp;quot;lucky&amp;amp;quot;;//向...原创 2018-08-24 12:32:21 · 10661 阅读 · 0 评论 -
js/jq——事件触发方式 事件冒泡捕获 阻止冒泡和默认事件
1、标签(不推荐,要将script放在页面最后且不能onload)&amp;amp;lt;body&amp;amp;gt;&amp;amp;lt;button onclick=&amp;quot;clickEvent()&amp;quot;&amp;amp;gt;click&amp;amp;lt;/button&amp;amp;gt;&amp;amp;lt;原创 2018-08-26 11:53:32 · 4911 阅读 · 0 评论 -
js——大小写转换 (URI、base64)编解码 定时器 防抖 节流
大小写转换.toUpperCase();//转换大写.toLowerCase();//转换小写URL编解码 URL编码(给服务器看的)var text1=&amp;amp;quot;https://www.baidu.com/?tn=78000241_12_hao_pg中国&amp;amp;quot;;var encode=encodeURIComponent(text1);console.log(encode); //...原创 2018-08-26 16:47:30 · 811 阅读 · 0 评论 -
js——闭包的排他思想
window.onload=function () { var btn=document.getElementsByTagName('button'); for(var i=0;i&lt;btn.length;i++){ (function (index) { btn[index].onclick=fu...原创 2018-08-27 20:23:40 · 337 阅读 · 0 评论 -
js——键盘点击事件 闭包函数
键盘点击事件 document.onkeypress=function(ev){ var e=ev||window.event; console.log(e.keyCode);//获取所点击的ASC码 }闭包函数特点: 可以读取函数内部的变量 让这些变量的值始终保持在内存中作用: 1、外部引用局部变...原创 2018-08-27 20:11:32 · 720 阅读 · 0 评论 -
js——放大镜效果
放大镜公式:bgx=( smx * bgi ) / smi; //in smb.onmouseover = function () { mask.style.display = 'block'; bgb.style.display = 'block'; //move s...原创 2018-08-27 19:01:58 · 264 阅读 · 0 评论 -
js——倒计时实现
倒计时 1、统一把时间转换毫秒(ms)计算,更精确 2、用将来时间 - 现在时间 = 剩下时间 var time=document.getElementById('time'); setInterval(function(){ var future=new Date('2090/1/1 00:00:00'); v...原创 2018-08-27 17:02:52 · 134 阅读 · 0 评论 -
js——构造函数 面向对象 继承
构造函数约定( 首字母大写 ) 1、(注:此方法渐渐淘汰了) //创建构造函数 function Person(){ var obj=new Object(); //属性 obj.name=null; obj.age=null; obj.sex=null; //方法 ...原创 2018-08-27 11:03:41 · 309 阅读 · 0 评论 -
js——回调函数
回调函数:利用一个函数调用函数 例如: function f1(n) { if (n === 1 || n === 2) return 1; return f1(n - 1) + f1(n - 2); } console.log(f1(8));//1 1 2 3 5 8 13 21(最终输出21) ...原创 2018-08-27 10:27:47 · 123 阅读 · 0 评论 -
js——计算一些特殊规律 函数转换规则(toString()、parseInt()、Number())
1、非Number运算,会将这些值转换Number类型true+100=101; true+false=1; null+10=10;2、任何值和NaN运算 转换为NaN3、%取余:100%0=NaN; 0%100=0;NaN !== NaN; //true4、正负运算符(y=+/- x):非Number转换Number5、a*=100+30 等于 a=a*(100+30)6...原创 2018-08-27 10:12:19 · 632 阅读 · 0 评论 -
js——BOM操作相关方法
window.open();//打开新窗口 window.close();//关闭当前窗口 window.moveTo();//移动当前窗口 window.resizeTo();//调整当前窗口 //可用屏幕宽/高 screen.availWidth; screen.availHeight; screen.colorDepth;/...原创 2018-08-26 21:53:33 · 463 阅读 · 0 评论 -
js——onload和DOMContentLoaded入口函数方法
onload方法会等到dom元素都加载完毕,并且还会等到资源也加载完毕才会执行 DOMContentLoaded事件只会等到dom元素加载完毕,性能比onload更好 // window.onload=function(ev){ // var res=document.querySelectorAll('div'); // console.log(res...原创 2018-08-23 14:17:52 · 447 阅读 · 0 评论 -
js—— call、bind 和 apply 、 真数组和伪数组互相转换及函数柯里化
apply和call方法的作用: 专门用于修改方法内部的this格式: call(对象,参数1,参数2,…) apple(对象,[数组]) 注:数组也可以是arguments function test(){ console.log(this); } test();//window的对象 var obj={'name':...原创 2018-08-21 17:23:09 · 1590 阅读 · 0 评论 -
模块动态引入
/** * test.js * 可以用于异步挂载的路由 * 动态需要根据权限加载的路由表 */const modulesFiles = require.context('./z-test', true, /\.js$/)const routesModules = []// 自动引入 z-test 目录下的所有模块modulesFiles.keys().reduce((module...原创 2019-10-11 14:15:31 · 489 阅读 · 0 评论 -
base64 与 file 互转
将图片转换为Base64function getImgToBase64(url,callback){ var canvas = document.createElement('canvas'), ctx = canvas.getContext('2d'), img = new Image; img.crossOrigin = 'Anonymous'; img.onlo...原创 2019-09-20 12:55:25 · 460 阅读 · 0 评论 -
js——Array写法和寻址方法、Object创建和寻址方法
Array写法 1、 var cars=new Array(); car[0]='one'; car[1]='two'; 2、var cars=new Array('one','two');3、常用方法var cars=['one','two'];寻址方法:car=cars[0];Object创建 1、var peopel={name:'tom',age...原创 2018-08-14 15:36:55 · 448 阅读 · 0 评论 -
js——全局变量和局部变量、常用事件、转义字符、绝对相等
局部变量:函数内部用var声明的变量 全局变量:函数外部声明变量 注:将值赋给未声明的变量,该变量将被自动作为window的一个属性(非严格模式下,给未声明变量赋值创建的全局变量,是全局变量可配置属性,可以删除)html中,全局变量是window对象;所有数据变量都属于window对象(例如:a=5;document.write(window.a)常用事件 onchange —— 用...原创 2018-08-14 16:36:02 · 355 阅读 · 0 评论 -
js——条件运算符、条件语句、循环语句
条件运算符(三目) var check=(condition)?value1:value2; check=value1:condition为真 check=value2:condition为假条件语句 1、if(condition){ }2、if(condition){ } else { }3、if(condition){ } else if(condition1){ } ...原创 2018-08-14 17:11:58 · 2814 阅读 · 0 评论 -
js——正则表达式 (引用菜鸟教程)
正则表达式 /正则表达式主体/修饰符(可选) 修饰符: i —— 大小写不敏感匹配 g —— 全局匹配 m —— 多行匹配 常用 (正则内容换为字符串也可以,正则搜索功能更强大) 检索段落.search(/abc/!) ——检索与正则匹配字符串,并返回起始位置(数字) 检索段落.replace(/abc/!,‘def’) ——检索‘abc’字符串,并替换为‘def’ 检索段落.m...原创 2018-08-15 21:42:45 · 4073 阅读 · 0 评论 -
js——js错误(throw、try、catch)、debugger、浮点数据使用注意
js错误 try —— 语句测试代码块的错误。catch —— 语句处理错误。throw —— 语句创建自定义错误。在下面的例子中,我们故意在 try 块的代码中写了一个错字。 catch 块会捕捉到 try 块中的错误,并执行代码来处理它。try { adddlert("Welcome guest!"); }catch(err) { txt="本页有一个...原创 2018-08-16 09:41:46 · 661 阅读 · 0 评论 -
js——九宫格算法(定位) 瀑布流布局
/** * 实现瀑布流布局 */ function waterFull(parent, child) { //father auto //get allBox and boxWidth var father = document.getElementById('box'); var allBox = fat...原创 2018-08-16 15:32:21 · 1589 阅读 · 0 评论 -
js——封装函数(包括动画封装)
//json封装 /** * 获取滚动的头部距离和左边距离 * 用法scroll().top/scroll().left * @returns {{top: number, left: number}} */ function scroll() { if (window.pageXOffset !== null)...原创 2018-08-16 15:37:30 · 376 阅读 · 0 评论 -
js——如何获取data-id中的值
转载出处:https://blog.csdn.net/ke3863834/article/details/76944265 一般data-id用于一些菜单栏的匹配,例如下面这个:12 //一级菜单 &amp;lt;div class=&quot;wrap&quot; id=&quot;test&quot;&amp;gt; &amp;lt;原创 2018-08-17 10:55:25 · 36139 阅读 · 0 评论 -
js——ajax封装
原理&amp;amp;amp;amp;lt;script&amp;amp;amp;amp;gt; window.onload=function (ev) { var btn=document.querySelector('button'); btn.onclick=function () { //1.创建一个异步对象 var ...原创 2018-08-18 13:11:42 · 997 阅读 · 0 评论 -
js——ajax 传递 json 数据
json数据{&amp;amp;amp;amp;amp;amp;amp;quot;name&amp;amp;amp;amp;amp;amp;amp;quot;:&amp;amp;amp;amp;amp;amp;amp;quot;sdfad&amp;amp;amp;amp;amp;amp;amp;quot;,&amp;amp;amp;amp;amp;amp;amp;quot;age&amp;amp;am原创 2018-08-18 13:15:39 · 11617 阅读 · 1 评论 -
js——获取对象长度
对象长度.length不可用 可以原生jsvar objLength=Object.keys(json).length;原创 2018-08-18 13:39:12 · 3582 阅读 · 0 评论