- 博客(20)
- 收藏
- 关注
RSS订阅原创 JS数组方法汇总
1 Array.toString() 方法把数组转换为字符串。let arr = ["aa","bb","cc"];let arr2 = [1,2,3];console.log(arr.toString()); // aa,bb,ccconsole.log(arr2.toString()); // 1,2,32 Array.join() 方法把数组转换为字符串。let arr = ["aa","bb","cc"];console.log(arr.join()); // aa,bb,
2021-03-22 16:14:37
354
原创 Node.js安装以及环境变量配置,(window系统)
一、安装Node.js1、直接进入官网下载对应的安装包，（建议安装到D盘，下面会讲到）然后一直next就行，直到安装完成。下载地址：https://nodejs.org/zh-cn/download/2、安装完成后可以打开 cmd 命令行输入 node -v 以及 npm -v 进行验证，出现以下版本信息后说明安装成功！二、配置环境变量以上的步骤已经完成了node.js的安装，即使不进行此步骤的环境变量配置也不影响node.js的使用，但是如果不进行环境变量配置，那么在我们使用命令安装node
2020-11-28 17:46:12
374
原创 JS隐藏姓名、电话和身份证的关键字，使用 * 号显示
在网页开发过程中，考虑到用户信息安全问题，就需要对后台获取的数据做一些处理。在某个项目中遇到了这样的需求，因此做一个记录。需求：将姓名和电话做关键字隐藏。例如：张三显示为（张*）;王可儿显示为（王儿）;上官婉儿显示为（**婉儿）;13455559812显示为（134***9812）。首先想到的是字符串的截取方法，截取需要显示的数据，没有截取到的就用 * 号表示。let name = "张三";let obtain = name.substring(0,1) + '*'; // 张*let name2
2020-10-27 18:17:13
2890
原创 数组常用去重方法
使用 Set 去重（ES6常用）function unique1(arr) { if (!Array.isArray(arr)) return "type error" return [...new Set(arr)]; // 或者下面这个方式 // return Array.from(new Set(arr));}利用 indexOf() 方法去重function unique2(arr) { if (!Array.isArray(arr)) re.
2020-10-26 14:54:34
149
原创 reduce() 数组方法的使用场景
reduce()方法可以对数组里每个元素执行一次回调函数写法：arr.reduce(function(prev,cur,index,arr){一系列操作}, init);prev： 必需(初始值, 或者计算结束后的返回值)；cur： 必需(当前元素)；index： 可选(当前元素的索引)；arr：可选(当前元素所属的数组对象)；init： 可选(传递给函数的初始值)；场景一：数组累加、累乘let arr1 = [1,2,3,4,5]console.log(arr1.reduce(.
2020-10-21 16:13:48
386
原创 记录.前端实现导出Excel、CSV、PDF文件
一、导出CSV文件<body> <button id="export">点击我导出CSV文件</button> <script> function exportCsv(obj) {//json数据导出方法 let title = obj.title;//列表头部 let dataKey = Object.keys(obj.data[0]);//拿到对象数据的键，因为是一样的所以只
2020-08-13 12:12:19
289
原创 JS中关于函数防抖和节流之用法
1.函数防抖事件触发N秒后函数只执行一次，在N秒内触发则重新计算时间1.1 应用场景搜索框实时搜索（keyup）鼠标拖拽、移动（mousemove）输入框实时验证(手机号、邮箱等等)1.2 函数防抖 — 代码实现function debounce(fn,delay){ let timeout = null;//创建一个标记，用来存放定时器的返回值 return function(){ let this_ = this; clearTime
2020-07-02 19:23:03
181
原创 css中伪类和伪元素的区别以及使用？
解释伪类：用于当已有元素处于的某个状态时，为其添加对应的样式，这个状态是根据用户行为而动态变化的。伪元素：用于创建不在文档树中的元素，并为其添加样式。以下为使用其创建的一些简单样式，仅作参考：代码如下：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-sc
2020-07-01 17:07:39
140
原创 css3新特性之自定义字体
效果：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equi...
2020-04-18 21:52:31
168
原创 3D雪花特效
话不多说，直接上效果图：代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <...
2020-03-05 10:45:12
188
原创 JS时间戳与格式之间的相互转换
1.把时间戳转换成日期格式function getData(timestamp){//时间戳毫秒数转化为 yyyy/mm/dd hh:mm:ss,参数为毫秒数 var len = timestamp.toString().length; // 时间戳为10位需*1000，时间戳为13位的话则不需乘1000 var date = new Date(timestamp)...
2020-03-02 14:37:19
162
原创 vue动态绑定class的几种方法
对象语法<div class="static" :class="{ active: isActive, 'done': isDone }" ></div>data: { isActive: true, isDone: false}结果渲染为：<div class="static active"></div>数组语法<div...
2020-02-24 12:37:48
469
原创 echarts之饼状图 扇形区域和标示线上显示数据（图标）
效果图：<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Com...
2020-02-20 16:52:59
6529
原创 echarts之等腰三角形图表
效果如下图所示：<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
2020-01-16 23:28:34
838
原创 Canvas 移动端用户签字确认功能，同意后保存照片直接转base64
移动端开发时拿到一个【用户签字确认功能】的需求，我这边使用的 Canvas 来记录用户的写字轨迹，达到储存签字照片的功能。以下是下来参照这个需求做的一个简单demo，希望能够对大家有所帮助~~~~~~~~HTML：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <...
2020-01-16 18:30:31
621
原创 echarts之折线图实现
这里我只对折线图做了简单的实现，更多的参数配置请参考官方配置手册 官方文档<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">...
2020-01-16 17:57:22
164
原创 echarts之饼状图文字放在横线上
领导要求饼状图文字需要放在标示线之上，这样才 beautiful，emmmmmm以下效果：<div id="mountain_echarts01" style="width: 600px;height: 400px;margin-top: 20px;background-color: dimgrey;"></div>var MountainOne = echarts...
2020-01-16 17:46:32
4546
1
原创 HTML之table表格表头固定，表格内容滚动以及滚动条的样式修改
平时经常会有一些关于表格的样式，借此了解到table标签的简单用法，作以记录。效果如下图示例：表头固定，内容滚动，滚动条的样式修改html：其中 colgroup 标签的用法请参考 点击这里了解colgroup标签<div style="width: 972px;height: 460px;background-color: rgb(25, 56, 160, 0.5);">...
2020-01-08 23:14:18
2750
原创 CSS文本超出宽度显示省略号，点击展开全部则显示全部，收起
当文本内容字数过多时，用户控制文本内容的展示、收起 。恰巧在项目中遇见，因此就有了这个功能的简单实现一、超出文本只显示省略号HTML代码： <div id="text">这里就是一个标签，里面的内容全是乱写的，也不知道怎么写</div>CSS代码：#text{ width: 150px; /* 容器宽度 */ white-space: no...
2020-01-01 18:01:45
9679
原创 vue项目兼容IE浏览器之在ie浏览器出现空白页
vue项目在IE下出现空白，读不出数据的情况。还有一些ES新语法不兼容问题的处理。一、使用vue-cli创建项目1、在vue项目中使用 npm 安装babel-polyfillnpm install --save-dev babel-polyfill2、在mian.js中引入babel-polyfill（在引入vue、vuex之前引入）import 'babel-polyfill'...
2019-12-28 19:37:10
348
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人