js
文章平均质量分 52
HHH 917
这个作者很懒,什么都没留下…
展开
-
js 深度克隆deepClone多种方式解决循环引入问题深拷贝
js 深度克隆deepClone多种方式解决循环引入问题深拷贝 SON.parse(JSON.stringify()) MessageChannel lodash.cloneDeep Object.create和Object.defineProperty WeakMap原创 2022-12-28 17:23:43 · 1397 阅读 · 0 评论 -
js 解决获取图片乱码 将 Arraybuffer 转换为 base64 的两种方式
请求axios 添加 responseType: ‘arraybuffer’ axios .get('/Base/captcha?' + Math.random(), {}, { responseType: 'arraybuffer' })Arraybuffer 转换为 base64 方式一 window.btoa (已弃用) const base64Str = 'data:image/png;base64,' + btoa( new Uint8Arr原创 2022-04-24 14:13:39 · 4475 阅读 · 6 评论 -
uniapp 解决 h5 PC端 屏幕过大失真 问题
效果解决目前 我也暂时不知道为什么 有时候设置了 rpxCalcMaxDeviceWidth 后 当屏幕宽度超过 960px后 应该 750rpx 应该等于375px 但是有时候又不行所以目前有两种写法 一种是默认的 另一种是自定义 默认不行就使用另外一种pages.json "globalStyle" 对象中填写 如下默认"rpxCalcMaxDeviceWidth": 960, // rpx 计算所支持的最大设备宽度,单位 px,默认值为 960"rpxCalcBaseDeviceW原创 2022-04-06 17:57:18 · 3443 阅读 · 1 评论 -
js 时间转换
js 时间转换原创 2022-01-24 14:18:39 · 582 阅读 · 0 评论 -
h5 实现扫码二维码及条形码(js多种实现方式)
js 扫码二维码及条形码原创 2021-12-11 15:25:47 · 14231 阅读 · 9 评论 -
Node Sass version 6.0.0 is incompatible with^4.0.0 (高版本node与node-sass版本不兼容)
问题最近启动以前的项目代码 发现报错Node Sass version 6.0.0 is incompatible with^4.0.0我的package.json 依赖的是 "node-sass": "^4.14.1",然后尝试安装 node-sass 4版本 发现安装失败最后通过百度及 node-sass npm网站 发现 高版本node 安装不了 低版本sass且 高版本node 对低版本 node-sass不支持网站:node-sasshttps://www.npmjs.com/原创 2021-12-02 12:30:19 · 5363 阅读 · 3 评论 -
前端 字体压缩 (字蛛 font-spider)
1、安装 font-spidernpm install font-spider --save//或yarn add font-spider2、创建html 及 font文件目录在 public 文件夹内创建 index.html 及font文件夹 在index.html 内写入需要保留的字体。index.html<!DOCTYPE html><html lang=""><head> <meta charset="utf-8">原创 2021-11-22 18:59:44 · 1066 阅读 · 0 评论 -
js点击按钮复制图片的两种方式 Document.execCommand() 、 Clipboard API
详细介绍参考 阮一峰的网络日志 剪贴板操作 Clipboard API 教程 https://www.ruanyifeng.com/blog/2021/01/clipboard-api.html代码1.对于图片是http地址且长度不是很长 const selection = window.getSelection(); if (selection.rangeCount > 0) selection.removeAllRanges(); const range原创 2021-09-25 18:16:52 · 2606 阅读 · 0 评论 -
egg.js 学习笔记
安装egg我们推荐直接使用脚手架,只需几条简单指令,即可快速生成项目(npm >=6.1.0):mkdir egg-example && cd egg-examplenpm init egg --type=simplenpm i启动项目:npm run devopen http://localhost:7001目录结构egg-project├── package.json├── app.js (可选)├── agent.js (可选)├── app(---转载 2021-07-08 11:41:53 · 908 阅读 · 0 评论 -
js 去除数组中为0的元素
效果在线演示html<div class='show'> </di>var arr = [1,2,0,3,4,0,5,6];// 方法一// var newArr = arr.filter((item)=>{// return String(item)!= '0';// })// 方法二// var newArr = [];// arr.forEach((item)=>{// if(String(item)!='0'){//原创 2021-03-11 11:28:03 · 5898 阅读 · 0 评论 -
js 获取列表索引值
效果在线演示HTML<ul> <li>123</li><li>233</li><li>333</li><li>433</li><li>533</li></ul>var liList = document.getElementsByTagName('li');for(var i = 0;i<liList.length;i++){ l原创 2021-03-11 11:01:10 · 1573 阅读 · 0 评论 -
js 查找出字符串中出现次数最多的字符
效果在线演示HTML<div id='showStr'> </div><div id='showChar'> </div><div id='bigStr'> </div>JSvar str = "sjl;黄sdfsdtyt ;aaaaabbbbb";var obj = {};for(var i = 0;i < str.length;i++){ if(!obj[str.charAt(i)]原创 2021-03-11 10:55:04 · 318 阅读 · 0 评论 -
关于 npm 安装angular报错‘code EEXIST‘,ERR path C:\Users\Administrator\AppData\Roaming\npm\node_modules
记录一次npm 安装报错code EEXIST已存在解决方法!本人学习angular过程中 ,发现使用package.json 里面的scripts 方式运行 angular正常!!但是直接使用 ng 命令时发现报错去到C:\Users\Administrator\AppData\Roaming\npm\node_modules文件夹发现文件夹下没有@angular然后使用命令npm install -g @angular/cli 进行安装,但是安装失败,报错是文件已存在!经过尝试,觉得是原创 2020-10-24 15:41:59 · 16616 阅读 · 6 评论 -
js 动态修改css动画@keyframes (基于vue讲解 兼容ie)
先看效果已有的css样式 动画效果是2s时间由透明变为不透明;修改后的动画效果styleSheets对象Document.styleSheets 只读属性,返回一个由 StyleSheet 对象组成的 StyleSheetList,每个 StyleSheet 对象都是一个文档中链接或嵌入的样式表。let styleSheetList = document.styleSheets;它是一个 StyleSheet 对象的有序集合。styleSheetList.item(index)原创 2021-01-07 15:34:35 · 8066 阅读 · 2 评论 -
js 处理文字过长,使用指定字符串内容替换超出部分文字
效果超出部分使用了...代替超出部分字符串;原理获取加了样式的字符串总长度,再和字符串的父容器的宽度进行比较,把超出部分使用指定内容替换;获取字符串长度代码/*** 获取文本px宽度* * @param font{String}: 字体样式 如 12px normal* **/function pxFont(font) { String.prototype.pxWidth = function(font) { // re-use canvas object for bet原创 2020-12-08 17:42:34 · 2627 阅读 · 0 评论 -
使用Promise与async+await实现 异步请求(多个异步请求同时执行 或者多个异步请求按顺序一个执行完毕再到下一个)
基本使用下面是 async与 Promise异步操作的基本使用。使用场景:当异步操作需要按顺序执行时可以使用,如按顺序读取多个文件内容。限制:await 后面表达式 异步出错了 会中断下一步的await 表达式的异步执行;let asyncFn = async function() { await Promise.resolve('hello world 1').then(v => { console.log(v); }); await Promise.resolve('hello原创 2020-12-18 12:05:32 · 4106 阅读 · 0 评论 -
原生 js获取可视区域宽高(整理)
返回窗口的文档显示区的高度。(IE 8 及更早 IE版本不支持这两个属性。)这个我用的比较多,用来写弹窗window.innerWidthwindow.innerHeight在没有声明DOCTYPE的IE中,浏览器显示窗口大小只能以下获取:document.body.offsetWidthdocument.body.offsetHeight在声明了DOCTYPE的浏览器中,可以用以下来获取浏览器显示窗口大小:document.documentElement.clientWidthdocum原创 2020-10-22 13:59:28 · 5785 阅读 · 0 评论 -
canvas实现动画效果(gif) 对图片进行多重中心旋转动画的原理及实现 详解
首先先看效果看是否是你想要用到的知识这里主要使用canvas 的drawImage方法context.drawImage(img,sx,sy,swidth,sheight,x,y,width,height);参数描述img规定要使用的图像、画布或视频。sx可选。开始剪切的 x 坐标位置。sy可选。开始剪切的 y 坐标位置。swidth可选。被剪切图像的宽度。sheight可选。被剪切图像的高度。x在画布上放置图像的 x 坐标位置。原创 2020-09-04 15:18:45 · 2355 阅读 · 1 评论 -
js实现前端无限滚动中的虚拟列表效果(只渲染可视区域,dom元素可复用)
初次 效果代码<!DOCTYPE html><html lang="en"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>无限滚动(只渲染可视区域,dom元素可复用)</title> <meta name="viewport" content="initial-scale=1.0原创 2020-08-26 18:18:20 · 6039 阅读 · 0 评论 -
js点击事件函数节流(一秒内只触发一次点击事件)
一秒触发一次点击事件var ms= 1000;var lastClick = Date.now() - ms;var button = document.querySelector('button');button.addEventListener('click', () => { if (Date.now() - lastClick >= ms) { console.log('点击了'); lastClick = Date.now(); }});...原创 2020-08-25 17:33:03 · 4176 阅读 · 1 评论 -
原生js firstChild 获取元素的第一个节点兼容问题(需求获取元素节点)
原生js firstChild 获取元素的第一个节点问题firstChild 获取当前元素节点下的第一个子节点。获取到的子节点可能是元素节点,但编程中更可能是注释节点或文本节点。没有子节点则返回null下面引用代码说明下面代码我们需求是获取div的第一个子元素节点。但是结果返回的是文本节点,因为兼容问题,. 在IE9+和其他标准浏览器中,div与p之间的空白区域被...原创 2019-04-21 11:09:05 · 4054 阅读 · 0 评论