js基础
博客关闭
朝阳群众Jone
这个作者很懒,什么都没留下…
展开
-
node服务端express-session使用以及无效问题
cookie和sessioncookie是服务端(服务器)发给客户端(网页)的会员卡,存在客户端,由客户端访问时携带给后端,可以储存信息,由于cookie在前端是完全暴露的,所以安全性特别低。于是乎就有了sessionsession是存在服务器内存中的数据,通过客服端携带的cookie对应可以找到session中存储的数据信息。如果客户端伪造了cookie则无法对应已存在的信息,安全性相对较高使用express-sessionnpm install express-session原创 2022-05-16 21:22:11 · 1284 阅读 · 0 评论 -
( Hot)原生js实现拖拽交换位置
成品效果如下,demo地址 很简单,一个属性:draggable="true",两个关键方法:dragend、dragenterdraggable:开启元素允许拖拽dragend:监听元素结束拖拽,此时可以做一些交换数据的逻辑(还有dragstart有需要自己上)dragenter:监听有元素拖拽进入到当前元素,此时更新要拖拽到的目标信息2、代码html:<div draggable="true" @dragend="dragend(num,index)" @drage原创 2022-02-28 17:54:32 · 896 阅读 · 2 评论 -
事件冒泡和默认行为
事件冒泡,推荐示例好文总结:冒泡:子集和父级都有事件(比如click),会依次由内到外冒泡响应,但是如果在子集写了①则会阻止所有父级事件的响应。默认行为:a标签的href,虽然给a写了click事件,但是在点击a标签的时候,会依次响应click事件,然后再响应默认行为,既跳转href的地址,另外还有touchmove事件,他的默认行为是触发滑动滚动,如果使用②则能阻止a标签默认跳转和touchmove的滚动行为①event.stopPropagation(); 仅阻止事件冒泡,...原创 2021-11-04 10:11:37 · 374 阅读 · 1 评论 -
上传自定义使用npm组件包
cd 到组件目录npm init,会要求输入一些package.json的内容Press ^C at any time to quit.package name: (education) educationversion: (1.0.0)description:entry point: (index.js)test command:git repository:keywords:author:license: (ISC)将npm 源修改到ali仓库(好像是因为公司私库是云效(原创 2021-10-24 19:43:48 · 246 阅读 · 0 评论 -
JSON.stringify后date类型字段差8小时
日常中有用到JSON.parse(JSON.stringify(Object))来深拷贝,但是如果该对象中包含Date类型的字段,那就要出乱子了,如下图,你可以在控制台敲个看看解决,网上解决方案大致都是这个其实对于现在三大框架类项目都有处理时间的库,所以关键点就是改写Date.prototype.toJSON方法,如我用了date-fns的format方法,如下Date.prototype.toJSON = function () { return format(this, 'YYYY..原创 2021-10-22 16:19:05 · 920 阅读 · 0 评论 -
JS快速构建1-100数组
寻常思路会写个for循环,一个个push进去,通俗易懂const arr=[];for (let i = 0; i < 100; i++) { arr.push(i + 1);}但...我不,我就是想玩儿,哎,就是玩儿一const arr= new Array(100).fill(0).map((item, index) => index + 1);二const arr=[...Array(100)].map((a,index)=>index+1)原创 2021-09-08 12:27:56 · 2353 阅读 · 0 评论 -
浅谈JS原生Sort实现业务中的排序
原生的sort,小白和老油条都可以来瞅瞅原创 2021-08-18 15:19:56 · 348 阅读 · 0 评论 -
canvas 截取视频首帧作为封面
主要模拟上传视频的同时截取视频首帧作为视频的封面正常有如下控件上传文件 <input type="file" accept=".mp4,.3gp" onchange="fileChangeEvent(this)" />function fileChange(e){ const fileOrg=e.files[0]; // 获取到了数据源对象}/* vue或angular等可以直接获取一个event, * 行内是写的@change="fileChange($eve原创 2021-08-13 14:42:11 · 794 阅读 · 0 评论 -
Git找回被删的分支
就算删了远程的也能找回只要你在本地有提交记录,那就都可以找回首先进入git bash命令行查看我们的git的操作日志git reflog效果如下,可以看到每次的操作记录因为图中的JoneDev分支被我删除了,所以我需要找回一下我想恢复到图中'HEAD@{4}'的commit事件中,所以执行如下命令git branch JoneDev HEAD@{4}完美恢复~...原创 2021-08-13 10:16:48 · 442 阅读 · 0 评论 -
js随机6位字母
莽代码!function getRangeCode(len=6) { var orgStr='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; let returnStr=""; for (var i = 0; i < len; i++) { returnStr+=orgStr.charAt(Math.floor((Math.random()*62))); } return returnStr}.原创 2021-02-05 15:28:43 · 1418 阅读 · 0 评论 -
原生JS列表自动滚动,带过渡效果
效果:两种方式,1)利用css的margin值来实现滚动,2)利用dom元素身上的scrollTop来实现html<div class="JTableBody noScrollBar" id="scrollContent"> <div class="oneBodyRow" id="firstLine">第1行</div> <div class="oneBodyRow">第2行</div> <div class="one原创 2021-02-04 14:31:39 · 1985 阅读 · 0 评论 -
echarts业务常用合集
echart问题合集1、饼图大小,线长 series: [{ type: 'pie', radius: [5, '60%'],//第一位是圆心大小,第二个是图大小 center: ['50%', '40%'],1是x轴距离,2是y轴,[50%,50%]则是正中心 labelLine:{ length:3,//第1段折线长 length2:5//第2段折线长原创 2021-02-03 13:53:36 · 189 阅读 · 1 评论 -
echarts绘制globe等3d图无效
复制官方示例代码,发现无效,原来要画这种3d类的需要另外引入一个包echarts-gl,戳我直达js<script src="lib/echarts.min.js"></script><script src="lib/echarts-gl.min.js"></script>webpack//安装npm install echartsnpm install echarts-gl//使用import echarts from '...原创 2021-01-20 10:22:57 · 2796 阅读 · 0 评论 -
原生dom筛选element属性
原生dom筛选属性转载 2020-11-22 13:27:47 · 185 阅读 · 0 评论 -
在线阅读office文件
上车原创 2020-11-16 14:53:29 · 174 阅读 · 0 评论 -
ES6补漏知识点
1、字符串拼接const name = 'kris'const age = 24const info = `My name is ${name}, I am ${age}`2、变量值交换let a = 10let b = 20[a, b] = [b, a]3、函数接收的参可以赋默认值如果调用方没传参,那么就会用上函数定义的默认值function MyTestFun(str="it's default value"){ }4、遍历对象或数组let arr原创 2020-06-12 09:22:10 · 150 阅读 · 0 评论 -
JS统计字符串中某一字段个数
那天跟朋友讨论如何统计字符串中某一字符出现的个数,讲什么遍历啊,判断是不是有该字段啊,计数器啊,妈耶这不是最简单的方式吗???let str="csdn.net/console/editor/html";let arr=str.split("/");console.log("str中有"+(arr.length-1)+"个‘/’");...原创 2020-06-01 13:15:43 · 4996 阅读 · 2 评论 -
echartY轴时间格式+显示时间格式
option = { tooltip: { show: true, formatter: function (params) { return fomartTime(params.data) } }, xAxis: { type: 'category', data: [...原创 2020-04-02 12:01:42 · 4416 阅读 · 0 评论 -
网页粒子效果particles
普通JQ中,不错的插件particles.jshttp://www.jq22.com/jquery-info9838vue中vue-particles<vue-particles color="#fff" :particleOpacity="0.7" :particlesN...原创 2019-12-17 09:31:22 · 694 阅读 · 0 评论 -
js堆栈问题
在日常开发中常有这样一个需求一、基本类型初始化多个变量为默认值,如下 let defaultVal =0; var numOne=defaultVal; var numTwo=defaultVal; numOne+=2; numTwo+=5; console.log(numOne,numTwo)//结果2,5对于上面这个代码,两个变量...原创 2019-11-25 14:13:54 · 297 阅读 · 0 评论 -
vue强制全局替换img错误图
第一种:比较简单,但是对于你引用别人的显示图片组件那就不一定有onerror事件,只能处理自己写的元素img标签附代码:<template> <img :src="record.ImagePath" class="myImage" :onerror="defaultImg" /></template><script> ...原创 2019-11-22 14:58:26 · 997 阅读 · 0 评论 -
巨坑!监听浏览器窗口关闭onbeforeunload不起作用(脱坑了啊!!)
因业务需要,特写方法监听浏览器关闭,然后去do something先声明我没在忽悠,看完能实现这个需求的!!网上大部分推荐方法如下:window.onbeforeunload= function (e) { e = e || window.event; if (e) { e.returnValue = '关闭提示'; } // C...原创 2019-11-21 14:05:09 · 23176 阅读 · 10 评论 -
JS小笔记
常用笔记1、手机号检测正则: var myreg=/^[1][3,4,5,6,7,8][0-9]{9}$/; if (!myreg.test($poneInput.val())) { return false; } else { return true; ...原创 2019-11-20 16:42:36 · 191 阅读 · 0 评论 -
Js闭包
在学习前端的过程中,不可避免的要学习到js闭包这个知识点,很多朋友感到对闭包很难理解,也不清楚它有什么用。本文就详细介绍一下闭包,并通过几个小例子来说明下闭包的用处。一、闭包的概念 闭包的英文单词是Closure,我先给闭包可以这样下个简单的定义,这个定义不是官方的,是我自己理解的。 定义:如果在函数A的内部,声明了另外一个函数B,并且函数B可以访问A中定义的变量或是数...转载 2019-10-15 12:01:59 · 234 阅读 · 0 评论 -
合并对象---object.assign()
Object.assign()一、合并两个对象var ObjFirst= {name:'Jone',age:24};var ObjSecond= {hobby:'Create value',sex:'BigMan'};var newObj = {};Object.assign(newObj,ObjFirst,ObjSecond);console.log(newObj );...原创 2018-12-29 11:11:26 · 1801 阅读 · 0 评论 -
js正则实测
JS正则实测记录你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章,了解一下Markdown的基本语法知识。新的改变我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客:全新的界面设计 ,将会带来全新的写作体验;在创作中...原创 2019-10-09 14:27:51 · 213 阅读 · 0 评论 -
js获取当天日期,计算出该天所属周,并列出本周从周一至周日的所有日期
function getMonDate(){var d=new Date(),day=d.getDay(),date=d.getDate();if(day==1)return d;if(day==0)d.setDate(date-6);elsed.setDate(date-day+1);return d;}// 0-6转换成中文名称function getDayName(day){var day=...原创 2018-03-23 17:18:19 · 4443 阅读 · 0 评论 -
JS 计算一个对象(Object)的长度
First在我们日常开发中,对象的使用频率很高,获取数组的长度是很简单,但如何获取对象的长度?假设我的书包只能放10本书,那么我就得控制我现有的书本数:var schoolBagMax=10;varbooks={"红楼梦":"曹雪芹","水浒传":"施耐庵,罗贯中","三国演义":"罗贯中","西游记":...原创 2018-03-27 17:36:26 · 17102 阅读 · 0 评论 -
Bootstrap的Datepicker选择日期后调用方法
这里是lvy博主写的博客:http://10305101ivy.blog.163.com/blog/static/5847658920135434648580/API调用网上一大把,我就不介绍了,大家自己百度。但是一定要注意他们的不同用法这里主要讲的是区别:一、Bootstrap的Datepicker:2013年Bootstrap火了,之后推出了许多使用插件,其中包括boot...转载 2018-04-03 09:54:26 · 2330 阅读 · 0 评论 -
JS组件系列——Bootstrap Select2组件使用小结
JS组件系列——Bootstrap Select2组件使用小结前言:在介绍select组件的时候,博主之前分享过一篇JS组件系列——两种bootstrap multiselect组件大比拼,这两个组件的功能确实很强大,只可惜没有图文结合的效果(也就是将图片放入到select里面随着文字一起显示)。前两天做一个菜单图标选择的功能,就要用到这个图文选择的功能。于是乎又是找啊找。终于不负所望,找到了...转载 2018-04-04 12:01:19 · 338 阅读 · 0 评论 -
bootstrap-datapicker选择时间后通过传参给所调用的事件
概述,用来bootstrap-datapicker 的日期控件,现在想要获取控件的值,去官网找API,发现居然没有更新文档,只能去stackflow找到了。直接贴代码吧<liid="startTime"class="input-appenddateform_datetime">开始时间:<input...转载 2018-04-04 15:01:33 · 2078 阅读 · 0 评论 -
关于img标签src找路径找不到问题
1、JS+XMLHTTPvar oreq = new ActiveXObject("Microsoft.XMLHTTP")oreq.open("Get","blog/attachments/month_0606/s2006610204959.jpg",false);oreq.send();alert(oReq.status)if(oReq.status==404)alert('不...原创 2018-04-16 18:00:04 · 5451 阅读 · 0 评论 -
HTML input[type=file]二次打开文件时不触发change事件
<input id="importInputFile" type="file"/>的change事件“$("#importInputFile").change(()=>{//xxx})”只能被触发一次,不管上传失败还是成功在标签上绑定了<input id="importFile" onchange="javascript:$('#importFileName').val(...原创 2018-05-24 13:15:14 · 6562 阅读 · 0 评论 -
时间戳与时间的故事
一、时间戳的意思首先很多朋友或许不明白时间戳的意思,我介绍下哈时间戳是指格林威治时间1970年01月01日00时00分00秒(北京时间1970年01月01日08时00分00秒)起至现在的总秒数。了解了他的根源咱就可以继续玩下去了二、时间转换成时间戳1.js获取当前时间戳的方法var timestamp1 = Date.parse(new Date());//...原创 2018-06-21 15:30:49 · 6776 阅读 · 0 评论 -
Audio音频播放报The play() request was interrupted by a call to pause()问题
问题分析首先我遇到这个问题的情况是:用户刷卡播报音频,一卡一刷,报声音是没毛病,但是如果刷的太快,那么问题就来了,上一个用户的播报还没结束,这一个播报就要覆盖上来了系统会咋整?报错呗!原理很简单,前一个语音请求被下一个请求打断了呗,js肯定是听最新的命令撒。有问题咱就解决呗解决方案首先我想到的是阻止新命令来覆盖,一定要等上一条命令结束了再让下一条来执行。所以在我们之...原创 2018-08-13 15:56:42 · 11829 阅读 · 0 评论 -
对象、数组、字符串易混淆的方法集合
一、字符串1.split(),指定的分隔符分割字符串为数组例: str=”a|b|c|d|e”; arr=str.split(”|”);//arr是一个包含字符值”a”、”b”、”c”、”d”和”e”的数组。2.join(),插入分隔符将数组转字符串例:var arr=[”a”,”b”,”c”,”d”,”e”];var newString=...转载 2019-03-14 15:26:50 · 477 阅读 · 0 评论