javascript
慕水渔
这个作者很懒,什么都没留下…
展开
-
js实现AES加密
安装第三方加密包npm i crypto-js加密代码let str = '****';// 需要加密的字符串let keyStr = '****';// 密钥let ivStr = '****';// iv偏移量const key = CryptoJS.enc.Utf8.parse(keyStr); // 十六位十六进制数作为密钥const iv = CryptoJS.enc.Utf8.parse(ivStr); // 十六位十六进制数作为密钥偏移量let srcs = Crypt原创 2022-01-26 10:39:15 · 10871 阅读 · 0 评论 -
js获取系统及版本
// 获取系统版本export function getOsVersion() { var u = navigator.userAgent, version = '' if (u.indexOf('Mac OS X') > -1) { // ios var regStr_saf = /OS [\d._]*/gi var verinfo = u.match(regStr_saf) version = 'IOS' + (verinfo +原创 2021-12-27 20:34:30 · 1274 阅读 · 0 评论 -
使用rollup打包应用
Rollup 是一个 JavaScript 模块打包器,可以将小块代码编译成大块复杂的代码。他与webpack的最大区别如下: 特性: rollup 所有资源放同一个地方,一次性加载,利用 tree-shake特性来 剔除未使用的代码,减少冗余 webpack 拆分代码、按需加载 webpack2已经逐渐支持tree-shake rollup: 1.打包你的 js 文件的时候如果发现你的无用变量,会将其删掉。 2.可以将你的 js 中的代码,编译成原创 2021-07-02 19:06:40 · 1621 阅读 · 0 评论 -
安卓部分浏览器长按保存图片问题
在安卓部分浏览器上长按查看base64图片一片空白,点击保存图片也提示保存失败,加入以下代码即可解决。1.页面上创建一个canvas容器,设置其隐藏<canvas v-show="false" ref="picture"></canvas>2.使用canvas重新绘制并赋值 this.imgUrl = "data:image/jpeg;base64," + res.content.base64_image;//这个路径只能苹果保存 let img = new Ima原创 2021-04-08 18:32:41 · 1443 阅读 · 0 评论 -
requestAnimationFrame详解
为什么要说它,源于看到的一道面试题:问题是用js实现一个无限循环的动画。首先想到的是定时器<!doctype html><html lang="en"><head> <title>Document</title> <style> #e{ width: 100px; height: 100px; background: red;转载 2020-12-15 09:40:48 · 262 阅读 · 0 评论 -
js调用微信支付
公众微信号调起微信支付的时候,有的时候调起支付成功,有的时候调起支付失败。利用抓包工具抓取数据显示授权和调用后台的微信预支付订单接口都成功并且都返回正确的数据。但是调起支付的时候传入的data老是弹出{‘isTrusted:false’},正常的data应该是调用生成预支付订单的返回数据,即后台给返回的调起微信支付所需要的数据参数。我的代码:<script src="./js/jquery.js"></script><script src="http://res2.wx.q原创 2020-12-09 15:32:13 · 3249 阅读 · 0 评论 -
HTML中显示代码高亮及行号
下载相关js和css文件首先进入highlightjs官网https://highlightjs.org/根据自己的需求勾选需要高亮的语言点击下方下载按钮。然后下载添加行号js文件https://github.com/wcoder/highlightjs-line-numbers.js/将相关文件复制到项目中下载的两个文件解压后将default.css、dark.css、highlight.pack.js、highlightjs-line-numbers.min.js复制到项目文件中..原创 2020-10-13 10:22:44 · 6166 阅读 · 4 评论 -
谈谈axios配置请求头content-type
现在前端开发中需要通过Ajax发送请求获取后端数据是很普遍的一件事情了,鉴于我平时在撸码中用的是vue技术栈,今天这里来谈谈我们常用的发Ajax请求的一个插件—axios。现在网上可能发送Ajax请求有很多种插件,每种用法可能略有差异,大家只需挑选一种自己喜欢的即可。毕竟现在还有很多人使用jQuery,$.ajax用法也是很多了。开始因为需要用到axios插件,所以我们现在项目种下载依赖npm install axios -Saxios虽然是一个插件,但是我们不需要通过Vue.use(axio转载 2020-09-21 17:46:20 · 1383 阅读 · 0 评论 -
正则表达式
字面量方法创建正则表达式var reg=/abc/;var reg=/abc/;构造函数方式创建正则表达式var reg=new RegExp(“abc”);操作正则的方法:字符串:match、search、replace、split正则:test、exec修饰符:g表示全局匹配,i表示忽略大小写、y表示起始位置、m表示匹配多行test判断是否含有正则内容,有就返回true,无就...原创 2019-08-26 21:29:07 · 180 阅读 · 0 评论 -
三大家族
offSet家族offsetWidth 和 offsetHeight获取对象自身的宽度和高度 ,包括内容、边框和内边距,即:offsetWidth = width + border + paddingoffsetLeft 和 offsetTop*距离第一个有定位的父级盒子左边和上边的距离*父级盒子必须要有定位,如果没有,则最终以body为准!*offsetLeft和offsetTop...原创 2019-09-07 07:52:21 · 127 阅读 · 0 评论 -
ajax_post
//创建xhr对象 var xhr=new XMLHttpRequest(); //监听请求 xhr.onreadystatechange=function(){ if(xhr.readyState!==4){ console.log(xhr.readyState); return; } if(xhr.status>=200&&am...原创 2019-04-27 09:28:49 · 258 阅读 · 0 评论 -
回调函数、闭包、this
回调函数:回调函数:把一个函数当做参数传递就是回调函数使用:1.不能复用的函数可以放到回调函数中2.可以解决异步调用的顺序问题闭包:闭包就是能读取其他函数内部变量的函数,可以理解为定义在一个函数内部的函数function foo(){var a=10;return function bar(){ //这个函数就是闭包console.log(a);}}foo()();既可以...原创 2019-08-12 19:56:14 · 184 阅读 · 0 评论 -
关于闭包中变量的储存
//前言闭包,这个概念对于每位JSer而言都不陌生,它几乎伴随着每个前端入门者的初学阶段,重要到几乎每家公司面试都会问。关于闭包究竟是什么,闭包干嘛用的,网上各种回答也是五花八门,动不动就扯到隐匿变量/内存泄漏这些概念,让没有C基础的初学者越看越晕,我不能说那些是错的,不过显然对新手不太友好。曾几何时我也是被那些个故作高深的概念绕得七荤八素云里雾里,那今天这篇文章以一个简单到80岁老太都看得懂...原创 2019-08-12 19:55:26 · 1857 阅读 · 5 评论 -
字符串、数组、自定义属性
自定义属性. 获取属性. 只能获取到默认的属性[][]有利于属性传参操作css(elem,‘background’,‘yellow’);function css(el,attr,color){el[‘style’][attr]=color;//al.style[attr]=color;}getAttribute和setAttribute//getAttribute获取自定...原创 2019-08-12 19:54:26 · 432 阅读 · 0 评论 -
ajax_get
发送get请求分为四步:1.创建ajax对象2.打开这个对象3.发送请求4.监听请求但是监听请求还要监听对象的打开发送情况,所以监听请求要放在创建对象的后边 //创建ajax对象 var xhr=new XMLHttpRequest(); //监听请求 xhr.onreadystatechange=function(){ //xhr对象的readysta...原创 2019-04-24 08:45:15 · 337 阅读 · 0 评论 -
promise解决回调地狱
使用的函数的回调,当函数异步进行时,前边的函数并未执行完,后边的函数调用前边的函数就会出现undefind,后边以此类推,就会出现回调地狱问题var promise=new Promise(function(resolve,reject){ setInterval(function(){ var num=Math.floor(Math.random()*100); if(n...原创 2019-04-24 08:39:05 · 160 阅读 · 0 评论 -
原型与继承
构造函数继承:构造原函数对象 function perset(name,age){ this.name=name; this.age=age; this.cage=function(){ console.log("今年是"+this.age+"岁"); } }在student中调用perset,并把per...原创 2019-04-24 08:24:46 · 120 阅读 · 0 评论 -
正则表达式
字面量方法创建正则表达式var reg=/abc/;构造函数方式创建正则表达式var reg=new RegExp(“abc”);g表示全局匹配,i表示忽略大小写test判断是否含有正则内容,有就返回true,无就返回false,例如:var reg=/abc/; var flag=reg.test(str); console.log(flag);match 默...原创 2019-04-21 15:40:12 · 143 阅读 · 0 评论 -
js实现图片轮播
在页面中添加图片盒子和切换按钮<div style="width: 500px;height: 300px;margin:0px auto;" id=""> <img style="width: 100%;height: 100%;" id="img" src="../img/1.jpg"/> </div> <p align="center...原创 2019-04-08 10:34:52 · 154 阅读 · 0 评论 -
javascript实现省市县联动
在页面中添加三个下拉框: <select id="co" "onchang(this)"> //onchange当前内容改变时触发事件 <option value="-1">-请选择-</option> <option value="0">河南省</option> <option value="1"&...原创 2019-04-08 10:20:03 · 447 阅读 · 0 评论 -
javascript实现二叉树
具体代码如下:var root=null; //定义全局变量,为树根 function treenode(key){ //定义数的结构 this.key=key; //树的根节点 this.left=null; //树的左节点 this.r...原创 2019-04-08 09:35:56 · 219 阅读 · 0 评论 -
js数据类型、运算符
1、数据类型变量命名规则不能使用关键字和保留字关键字:已有的语法保留字:还没有使用的关键字首字母可以是字母、下划线、$符,不能是数字、运算符适合多个单词定义变量:驼峰命名,第二个单词首字母大写匈牙利命名法,单词前添加数据类型辨识,如iNum下划线命名,通过下划线连接多个单词折行显示当引号内的代码片段需要折行,例如:'<ul><li></li&...原创 2019-08-11 19:51:05 · 162 阅读 · 0 评论 -
流程控制和DOM操作
流程控制顺序结构顺序结构就是程序从上到下、从左到右一句一句的去执行。选择结构单向选择:if(){}双向选择:if(){}else{}多向选择:switch(判断值){case 验证值:语句;break;default:语句;}任何值都可以作为判断条件当是两个值比较是,就要按条件比较两个值如果是一个值,只有一下几种情况为假,其他情况全为真:false 0 ...原创 2019-08-11 19:51:48 · 218 阅读 · 0 评论 -
隐性转换
算数运算时的隐性转换1+1 //2true+true //21+true //2第一行是两个布尔值相加,第二行是数值与布尔值相加。这两种情况,布尔值都会自动转成数值,然后再相加。‘a’+‘bc’ //‘abc’如果是两个字符串相加,这时加法运算符会变成连接运算符,返回一个新的字符串,将两个原字符串连接在一起。1+‘a’ //‘1a’fals...原创 2019-08-12 19:53:28 · 354 阅读 · 0 评论 -
DOM和BOM宽高等属性
元素位置:offsetleft、offsetTop 在所有祖先节点中没有定位模式的时候,是到html的距离。祖先元素有定位就是相对于祖先元素的距离。elem.offsetParent : 找到离elem最近的具有定位属性的祖先元素,跟css定位属性很像,如果嵌套的元素没有定位,就会得到body拓展:封装元素距左侧的距离函数function pox(elem){var result=0;...原创 2019-08-15 19:40:34 · 166 阅读 · 0 评论 -
节点操作
createElement语法前面只能是documentvar li=document.createElement(‘li’);li.innerHTML=‘111’;通过appendChild、insertBefore把创建的节点添加到页面中appendChild : 把一个节点添加在指定节点里的最后var ul=document.querySelector(‘ul’);ul.appe...原创 2019-08-15 19:39:51 · 197 阅读 · 0 评论 -
动态获取元素
非动态获取元素 :在没有生成这个元素之前不能获取到document.getElementById()document.querySelector()document.querySelectorAll()动态获取元素 :不用一开始就获取元素document.getElementsByClassName()document.getElementsByTagName()var box1=...原创 2019-08-15 19:39:23 · 640 阅读 · 0 评论 -
时间对象和DOM节点
时间对象var date=new Date(); //获取当前时间date.getFullYear(); //获取年份date.getMonth()+1; //月份从零开始date.getDate(); //获取日期天数date.getDay(); //获取周几信息,0对应周日date.getHours();...原创 2019-08-15 19:38:32 · 220 阅读 · 0 评论 -
递归、排序
递归:函数调用自身就是递归,要添加停止操作把复杂的问题分解成若干个简单的解function fn(n){ //斐波那契数列if(n1||n2){return 1;}return fn(n-2)+fn(n-1);}console.log(fn(6));var arr=[10,5,14,34,32,12,7,4];functi...原创 2019-08-15 19:37:45 · 115 阅读 · 0 评论 -
js事件
函数鼠标事件onclick:单击事件ondblclick:双击事件onmouseover:鼠标移入事件onmouseout:鼠标移出事件onmousedown:鼠标按下事件onmouseup:鼠标抬起事件onmousemove:鼠标移动事件内置函数alert(“a”); 警告框var result=alert(‘1’); //不返回值console.log(result);...原创 2019-08-11 19:52:50 · 116 阅读 · 0 评论 -
js函数
函数函数命名方法(1)function命令:function print(){console.log(s);}(2)函数表达式:var print=function(){console.log(s);}(3)function构造函数:var add=new Function(‘x’,‘y’,‘return x+y’);等同于function add(x,y){retu...原创 2019-08-11 19:52:20 · 233 阅读 · 0 评论 -
javascript属性总结
typeof 数据类型this:动态指向自己new String 新建字符串对象sum.call(this,num1,num2)第一个参数指向调用sum函数的对象,后边是sum的数据sum.apply(this,[num1,num2]) 数据传输同call不同而已可以用来代替另一个对象调用一个方法Math.random() 生成0.0-1.0的随机数(不含1.0)Math.fl...原创 2019-04-07 13:38:35 · 135 阅读 · 0 评论
分享