JavaScript
关注
分享
扫一扫
水机.Threeki
这个作者很懒，什么都没留下…
展开
-
【Puppeteer】‘left‘ is already pressed, ‘${button}‘ is already pressed 的解决办法
try {} catch (e) { } // 捕获并忽略可能的错误（例如：按钮未按下的错误）原创 2024-09-05 00:57:11 · 514 阅读 · 0 评论 -
dva history.block 路由守卫、路由拦截 功能实现, 关键词: dva2.0 history.block react-router react-router-guards
// 路由监听export const RouterGuards = (history) => { // history.block 使用方法参考 // https://stackoverflow.com/questions/65526447/react-router-v5-2-blocking-route-change-with-createbrowserhistory-and-history // history.block 从回调中返回 false 会阻止通过，返回 t原创 2022-05-24 16:57:22 · 2054 阅读 · 0 评论 -
微信小程序之列表左滑删除功能 - 体验优化版
最近项目中，提出的需求，需要做一个 列表左滑删除功能然后参照 下面链接的文章，实现功能后，https://segmentfault.com/a/1190000019629652发现有一些，体验不太好的地方，于是就自己做了一些优化：1、侧滑的时候，禁止页面Y轴滑动// 业务页面代码const App = getApp()Page({ data: { bookingList: [], stopScrollY: '', // 侧滑时 禁止页面滚动, 优化体验。 '' 为可以原创 2020-11-18 14:30:46 · 556 阅读 · 1 评论 -
掘金Loading渐变效果, 数据加载等待时的, 渐变效果
在线预览效果 戳这里<div class="box"> <div class="row"></div> <div class="row"></div> <div class="row"></div></div><style>@keyframes skeleton-stripes { 0% { background-position: 0 0 } to { backgro.原创 2020-06-08 15:51:39 · 579 阅读 · 0 评论 -
修改 flexible源码, 让iphone 6的750px宽度下，html的font-size为100px
事情起因我看了手淘适配方案 flexible 的源码，然后自己使用了这个库后，再对比 手机淘宝 的代码发现问题：我的项目下 <html style="font-size: 37.5px;">而手机淘宝 <html style="font-size: 100px;">感情 github 上面的库是坑我呢吧？居然不一样？？？为什么要改？因为设计师大多数都是用iPhone7 的750px宽度做设计的所以 750px 宽度下，font-size: 10原创 2020-05-27 18:47:45 · 794 阅读 · 0 评论 -
safari audio target.duration infinity 获取不到音频文件时长
2020年5月9日 18:29遇到问题：自从上面那样改后：把文件转成mp3文件，还是发现，在 IOS safari 上，还是不能获得 audio.maxTime且安装了 sox 软件 用于查看音频的元信息brew install sox> soxi 01.mp3 Input File .原创 2020-05-12 18:07:45 · 2141 阅读 · 0 评论 -
html5 video audio currentTime 设定失效、重头开始播放
记一巨坑今天我在vue中写一个音频播放器的时候，想做点击前进/后退 15s 的功能，后面发现不管我怎么查，怎么找，都只搜索到 audio.currentTime += 15 这种方法。但是我就纳闷了，为啥我的就是不行？而搜索的所有文章，不管中文 英文，都是说 audio.currentTime += 15 这种方法 就可以了。直到后面，我看到了这篇文章 html5 video curre...原创 2020-04-15 17:22:08 · 6160 阅读 · 1 评论 -
安装使用 koa-body 后导致 post 提交数据请求时 415 unsupported media type
1.出现问题之前开发的服务器，数据的增删查改 都正常，但是自从 昨天做了文件上传功能，参考了文章 Koa从零搭建之文件上传使用了 koa-body 后，今天在对提交 ajax请求，对数据进行增删查改，就出现了 415 unsupported media type 错误，2.解决过程期间，我查了很多资料比如：ajax 请求设置 contentType: “application/j...原创 2020-04-10 18:24:23 · 1096 阅读 · 2 评论 -
一篇文章让你搞懂JS懒加载(lazyload)
1.前言图片懒加载也是比较常见的一种性能优化的方法，最近在用vue做一个新闻列表的客户端时也用到了，这里就简单介绍下实现原理和部分代码。2.实现原理加载页面的时候，图片一直都是流量大头，针对图片的性能方法也挺多的比如base64、雪碧图等；懒加载也是其中一种，主要原理是将非首屏的图片src设为一个默认值，然后监听窗口滚动，当图片出现在视窗中时再给他赋予真实的图片地址，这样可以保证首屏的加载速...转载 2019-11-21 12:04:50 · 625 阅读 · 0 评论 -
判断是否是微信浏览器打开
var isWeixin = function () { //判断是否是微信 var ua = navigator.userAgent.toLowerCase(); return ua.match(/MicroMessenger/i) == "micromessenger";};var isWeixin = isWeixin();转载 2018-11-05 14:54:28 · 140 阅读 · 0 评论 -
一键移动端适配 手机端适配，简单粗暴的适配方法
<script type="text/javascript"> if(/Android (\d+\.\d+)/.test(navigator.userAgent)){ var version = parseFloat(RegExp.$1); console.log(version); if(version>2.3){...原创 2018-11-17 17:30:43 · 808 阅读 · 0 评论 -
vue css动画过渡原理
先看一个 使用vue css动画过渡原理 实现显示隐藏的例子&amp;amp;amp;lt;div id=&amp;amp;quot;app&amp;amp;quot;&amp;amp;amp;gt; &amp;amp;amp;lt;button @click='clickHandle'&amp;amp;amp;gt;toggle&amp;amp;amp;lt;/button&原创 2018-12-12 14:27:49 · 300 阅读 · 2 评论 -
根据时间轮换微信号，js前端实现方法
需求描述：根据时间，一天24小时，每15分钟换下一个微信。且，用户打开页面后，第一次打开时间的微信号 会被缓存到本地，以后每次打开都是第一次打开时的微信号。var wxNumber = ['微信号1','微信号2','微信号3','微信号4'];var firstOpenTime = localStorage.getItem('firstOpenTime'); // 第一次...原创 2019-01-11 13:12:33 · 1748 阅读 · 2 评论 -
阻止默认行为
<script> function func(e){ // 阻止默认行为 e = e || window.event; // 兼容处理事件对象 if(e.preventDefault){ e.preventDefault() // 标准浏览器 }else{ ...原创 2019-01-03 12:16:51 · 128 阅读 · 0 评论 -
jq ajax
$.ajax({ method: 'POST', url: 'url', data: {'tag_search':tag_search}, success: function(data,status,XHR){ console.log(data); }})原创 2019-03-21 18:12:40 · 128 阅读 · 0 评论 -
js生成[n,m]的随机数
一、预备知识Math.ceil(); //向上取整。Math.floor(); //向下取整。Math.round(); //四舍五入。Math.random(); //0.0 ~ 1.0 之间的一个伪随机数。【包含0不包含1】 //比如0.8647578968666494Math.ceil(Math.random()*10); // 获取从1到10的随机整数 ...转载 2019-03-26 10:53:17 · 441 阅读 · 0 评论 -
什么是闭包？为什么有闭包？什么是块级作用域？为什么ES6要有let const var的区别？javascript,js
先来看一个例子 <script> window.onload = function(){ var abtn = document.getElementsByTagName('input'); for(var i=0; i<abtn.length; i++ ){ ...原创 2019-03-29 17:43:22 · 739 阅读 · 0 评论 -
百度网盘视频倍速播放方法。
参考：百度网盘视频在线倍速播放一、使用chorm浏览器代码：videojs.getPlayers("video-player").html5player.tech_.setPlaybackRate(播放倍速)亲测百度云盘可用，但是其他视频不行，而且其他浏览器也不行，特此记录。二、其他H5的视频倍数播放方式document.querySelector('video').playback...原创 2019-03-22 23:05:20 · 3151 阅读 · 1 评论 -
jquery 获取checkbox,radio,select被选中的值
jquery获取radio被选中的值：<input type="radio" name="rd" id="rd1" value="1">1<input type="radio" name="rd" id="rd2" value="2">2<input type="radio" name="rd" id="rd3" value="3">3三种方法都可以...转载 2019-03-28 17:04:54 · 165 阅读 · 0 评论 -
ES6中的 Promise 对象
Promise 对象开始之前先看结论Promise的最简写法Promise.all([ $.ajax({url: 'arr.txt', dataType: 'json'}), $.ajax({url: 'json.txt', dataType: 'json'})]).then(function(results){ let [arr, json] = results...原创 2019-04-08 02:20:30 · 138 阅读 · 0 评论 -
The header content contains invalid characters 错误
The header content contains invalid characters 错误报错原因总结贴源码环境： Nodejs v8.10.0项目：静态资源服务器报错信息：Administrator@PO5ZCZBM35GLZP9 MINGW64 ~/Desktop/test2/src$ node static_server.jsServer is running at...原创 2019-07-17 17:43:10 · 3936 阅读 · 1 评论 -
CSS3中的rem,em与px间的换算关系
px,em,rem之间有什么区别？国内的设计大师都喜欢用px,而国外的网站大都喜欢用em和rem，那三者之间有什么区别？又各自有什么优劣呢？pxPixel像素，相对长度单位。像素是相对于显示器分辨率而言。em相对长度单位，相对于当前对象内文本的字体尺寸，如当前对行内文本的字体尺寸未被设置，则相对于浏览器的默认字体尺寸。 任意浏览器的默认字体高都是16px。所有未经调整的浏览器...转载 2018-07-28 10:56:20 · 2664 阅读 · 0 评论 -
JS引用类型数据的浅拷贝与深拷贝
视频讲解《对象的深浅拷贝》 浅拷贝之前文章提到，在定义一个对象或数组时，变量存放的往往只是一个地址。当我们对堆内存中的对象复制时，如果属性是对象或数组时，这时候我们拷贝的只是一个栈内存的指针。因此b对象在访问该属性时，会根据指针寻找到a对象指向的堆内存对象，两者的属性值会指向同一内存空间。var a = { key1:"11111"}function Copy(p...转载 2018-10-11 17:39:28 · 162 阅读 · 0 评论 -
js基本包装类型概述
// 先看一个现象var t = 9.178;t.toString(); // => '9.178'// 那么问题来了，为什么数值类型（基本类型）有toString方法？ toString方法不是object对象才有的吗？针对布尔类型、数值类型、字符串类型 JavaScript 都提供了对应的包装类型。当三种类型的变量在 读取 操作的时候，JavaScript...原创 2018-08-15 17:09:30 · 350 阅读 · 0 评论 -
Boolean包装类型
// Boolean类型是引用类型// 创建方法var t = new Boolean(false); // t是引用类型!!t; // => true 非空对象转为boolean类型都是truetypeof t; // => objectt instanceof Boolean; // => true, instanceof...原创 2018-08-15 16:45:06 · 787 阅读 · 0 评论 -
数组去重练习
// 数组去重 // 方法一，indexOf 方法 var t = [90,8,34,8,2,39,87,34,22,10]; console.log(t); var arr = []; arr[0] = t[0]; for ( var i = 1; i < t.length; i++){ if (arr.indexOf(t[i]) == -1) {...原创 2018-08-14 14:58:25 · 210 阅读 · 0 评论 -
i+=1&&i++ 是怎么运行的？
var i=5; if(i+=1&&i++){ console.log(i); }结果是10 咋运行的? postfix ++ > && > +=.相当于(i+=(1&&(i++))). 此外,由于 Javascript 中逻辑运算符会返回对象, 所以1&&5结果为5. 所以是10. ...原创 2018-07-28 12:20:00 · 463 阅读 · 0 评论 -
a = a + 1，a+=1， a++， ++a 区别在哪
a = a +1; // 即最普通的写法，将a的值加1再赋给aa+=1; // 相当于 a = a+1;a++; // 是先将a的值赋给一个变量， 再自增++a； // 是先自增， 再把a的值给一个变量a = a + 1 等同于 a += 1// 举例说明新手秒懂b = a++ // 等同于b = a; a = a + 1;// 亦等同...转载 2018-07-28 12:04:16 · 17635 阅读 · 1 评论 -
meta标签 meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" />解析
在练习css3动画特效时遇见如下代码 < meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" /> 逛了逛前辈们的博客园，把对于该代码的解析做了总结： 常用的例子：<meta http-equiv="X-UA-Compatible" content="IE=7"> //转载 2018-07-27 17:31:26 · 6396 阅读 · 0 评论 -
js判断PC端 移动端 并跳转
通过JS语句判断WEB网站的访问端是电脑还是手机，以显示不同的页面！<script> // PC端 移动端 跳转 var is_mobi = navigator.userAgent.toLowerCase().match(/(ipod|iphone|android|coolpad|mmp|smartphone|midp|wap|xoom|symbian|j2me|...转载 2018-07-26 16:48:47 · 8006 阅读 · 1 评论 -
JS短路表达式 && 和 ||
1. 逻辑与&& //返回第一个假值，或者最后一个真值 1 && ‘’ // ‘’ Boolean('') // false 1 && true && 'ssss' && 0 && 20 // 0 1 && true原创 2018-07-14 11:08:45 · 1005 阅读 · 0 评论 -
原生JS实现中文简繁切换，引入即可整站变繁体
document.write(" <a name=\"StranLink\" id=\"StranLink\" style=\"font-size:10px;color:red;cursor:pointer;display:none;\">简体中文</a>"); //模仿语言包式的简繁转换功能插件！var Default_isFT = 1; //默认是否繁体，0-简体...转载 2018-07-19 14:31:10 · 2182 阅读 · 0 评论 -
js导出excel
第一种，我认为最好用的方法<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head> <body link="blue" vlink="pu原创 2018-08-13 18:34:05 · 184 阅读 · 0 评论 -
删掉字符串中另一个字符串的字符，字符串练习两个字符串求差
// 从第一个字符串中删除第二个字符串中所有的字符var str1 = 'They are students', str2 = 'aeiou', res = ''; console.log(str1[3]);// 思路// 遍历str2中的字符，看是否在str1中，如果有 则从str1中删除arr1 = str1.split('');arr2 = str2....原创 2018-08-20 15:07:54 · 824 阅读 · 0 评论 -
js变量提升 JS中var、let、const区别？
另一篇参考文章《深入理解变量声明提升和函数声明提升》 首先文章开始前，先抛结论使用var声明的变量，其作用域为该语句所在的函数内，且存在变量提升现象；使用let声明的变量，其作用域为该语句所在的代码块内，不存在变量提升；使用const声明的是常量，在后面出现的代码中不能再修改该常量的值。然后下面开始讲解 对于大多数js开发者来说，变量提升可以说是一个非常常见的...原创 2018-10-11 14:50:54 · 1011 阅读 · 2 评论 -
深入理解变量声明提升和函数声明提升
可以参考另一篇文章《js变量提升》变量声明提升1、变量定义可以使用var定义变量，变量如果没有赋值，那变量的初始值为undefined。2、变量作用域变量作用域指变量起作用的范围。变量分为全局变量和局部变量。全局变量在全局都拥有定义；而局部变量只能在函数内有效。在函数体内，同名的局部变量或者参数的优先级会高于全局变量。也就是说，如果函数内存在和全局变量同名的局部变量或者参...原创 2018-10-11 14:30:40 · 194 阅读 · 0 评论 -
事件绑定的兼容处理，同时兼容IE678 和 Chrome
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title></head><body> <input type="button"原创 2018-09-11 16:04:03 · 540 阅读 · 0 评论 -
阻止事件冒泡兼容处理 兼容ie678
<!DOCTYPE html><html><head> <title></title></head><body> <style> .parent{ border: #ccc solid 1px; width: 100px; height: 100原创 2018-09-11 12:08:35 · 415 阅读 · 0 评论 -
js 字符串类型 String 操作总结
字符串是不可变的。对字符串的所有操作都会返回一个新字符串，原字符串不变在 ie 6-7 时，' abc ' + ' cdf ' 如果两个大量的字符串拼接，性能很低，原因是需要开辟新内存 和 创建新变量，导致性能低下，而在ie8 后得到大幅改善。 字符串常用方法// 创建字符串 var a = new String('123') v...原创 2018-08-21 16:56:26 · 265 阅读 · 0 评论 -
Math对象 Math方法
JavaScript 提供了 Math 内置对象方便我们进行数学运算他具有数学常用和函数的属性和方法。 常用属性max() 与 min() 求一组数的最大值和最小值Math.max(10,9,22); // => 22Math.min(10,9,8,22); // => 8 常用属性Math.PI // 圆周...原创 2018-08-21 12:11:05 · 1037 阅读 · 0 评论