原生JavaScript
Dreamer_xr
这个作者很懒,什么都没留下…
展开
-
JavaScript高级程序设计(第三版)——引用类型Array
<!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...原创 2019-11-15 15:48:42 · 283 阅读 · 1 评论 -
JS处理支付宝H5支付
后端返回的支付宝H5支付调用链接是一个字符串form表单创建一个div,讲返回的form表单加入div中,返回到body中渲染页面,通过提交表单的形式打开H5支付链接。const div = document.createElement('div');div.innerHTML = ‘后端给的form数据’document.body.appendChild(div);documen...原创 2019-08-23 18:43:21 · 3213 阅读 · 0 评论 -
什么是防抖和节流?有什么区别?如何实现?
有这样一种应用场景,在滚动事件中做一个复杂取值计算或者频繁的触发一个事件,这是很影响性能并容易导致页面卡顿的,所以要合并多次请求,通过函数做一个精确操作。这时就会用到函数防抖或者函数节流,那么,这两种方式有什么区别呢?个人认为:函数节流是:在固定的时间内触发事件,每隔n秒触发一次函数防抖是:当你频繁触发后,n秒内只执行一次一、防抖触发高频函数事件后,n秒内函数只能执行一次,如果...原创 2019-07-12 14:31:53 · 19087 阅读 · 3 评论 -
vue 替换换行符为p标签
效果图需要把换行符替换成p标签,方便首行缩进。主要方法使用正则进行转义 this.articleData = '<p>' + content.replace(/\n*$/g, '').replace(/\n/g, '</p> <p>') + '</p>'代码示例:<template><main>...原创 2019-06-18 18:35:19 · 6585 阅读 · 0 评论 -
JS实现数组去重四种方法,去重并排序
直接上代码 <script> let arr = [2, 3, 4, 4, 6, 66, 4, 743, 243, 22, 2, 4]; // 一、遍历数组法,新建一个数组,遍历原数组,如果不存在就存入新数组中,最后输出新数组 function first(arr) { let array = []...原创 2019-06-04 18:01:32 · 2659 阅读 · 0 评论 -
JS排序(sort排序、冒泡排序、选择排序、快速排序)
直接上代码 <script type="text/javascript"> let array = [1, 22, 13, 7, 2, 224, 354, 5, 3, 6] //sort排序 function sortNum(a, b) { return a - b; } ...原创 2019-06-04 16:35:09 · 1012 阅读 · 0 评论 -
JS实现拖拽(原生)
拖拽的原理:三个事件onmousedown、onmousemove、onmousemove1、鼠标按下,触发onmousedown,获取鼠标坐标x,y,获取元素坐标x,y 通过event.clientX、event.clientY获取鼠标位置的坐标 let x = e.clientX - box.offsetLeft; //鼠标点击坐标距离盒子左边缘的距离 let y...原创 2019-06-10 18:58:41 · 239 阅读 · 0 评论 -
JS获取url字符串(黑科技-URLSearchParams)
之前截取url字符串一直是.split().split().split(),显得好傻,今天掌握了一个黑科技,很轻便,也很规整,但是不支持IE这个黑科技就是 构造函数 URLSearchParamsURLSearchParams MDN=>戳这里那么怎么用呢,很简单。1、首先url格式是有要求的,要问号后面的参数内容并且包含问号,如下let url = '?toke...原创 2019-06-15 16:30:31 · 1555 阅读 · 0 评论 -
H5于原生APP交互封装(这里用vue,其他同理)
最近项目要求APP中要嵌套H5的页面。首先,创建两个JS文件,便于区分管理1、DeviceType.js用于判断环境是Android还是IOSexport const DeviceType=(()=>{ var u = navigator.userAgent; if (u.match(/Android/i) != null) { return "...原创 2019-05-10 16:58:09 · 2876 阅读 · 0 评论 -
H5开发踩坑记录(总有你用的到的,持续更新)
一、url转码,url传值得时候中文会被转义,通过 decodeURIComponent( ) 进行转码this.url = decodeURIComponent(item.split('=')[1])编码的话用encodeURI( )son.name = encodeURI(infoJson.name)二、H5页面在ios中滑动不流畅问题,可以通过css进行解决,兼容safa...原创 2019-04-28 00:28:41 · 416 阅读 · 2 评论 -
JS图片转换格式 (转Blob)
file格式转Blob<input type="file" accept="image/*" @change="upLoad">upLoad(e){ console.log(this.getFileUrl(e.srcElement))},getFileUrl(obj) { let url; url = window.URL.createObjectURL...原创 2019-04-15 10:29:36 · 17300 阅读 · 1 评论 -
JS复制内容到剪贴板(vue)
MDN地址,里面有参数和命令:https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand链接:<input size="mini" :value="item.downloadLink" :id="item.id"/> <el-button size="mini" type="prim原创 2018-12-31 15:54:56 · 1237 阅读 · 4 评论 -
Vue中添加针对window的键盘事件该怎么处理
因为在项目中使用了UI库,没有直接的input标签(最终渲染到html上的话,input标签外还有一层div) <b-input type="password" v-model="credentials.password" />所以键盘事件获取不到焦点,在登录页面我想加个键盘enter的全局事件,想提高一点用户体验,于是考虑采用针对window的键盘事件,那么在这个过程中遇到...原创 2018-09-15 16:14:00 · 3238 阅读 · 3 评论