
数据处理
xyphf_和派孔明
全栈工程师,熟悉原生JavaScript、TypeScript、ES6、Webpack、VUE全家桶、JAVA SSM框架、Spring boot 、Spring cloud、MySql、Oracle、Linux等,可独立构建多页面、单页面应用项目。
展开
-
js-cookie的使用以及存储token安全的注意要点
2、使用CSRF Token:在每个请求中添加一个随机生成的CSRF Token,然后在服务器端验证这个Token。2、启用Content Security Policy,简称CSP内容安全策略集配置,限制浏览器只加载和执行来自特定源的脚本,从而防止XSS攻击;3、使用Referer Header:在服务器端检查Referer Header,如果请求不是来自同一源,那么请求将被拒绝。3、对用户输入进行验证和转义:对所有用户输入进行验证,并对特殊字符进行转义,以防止恶意脚本被执行。原创 2023-12-22 23:15:00 · 1994 阅读 · 0 评论 -
限制输入字符长度length英文1个字符中文2个字符
限制输入字符长度length英文1个字符中文2个字符原创 2022-06-24 23:45:00 · 569 阅读 · 0 评论 -
json数组把相同key 值合并,value相加
数据如下var arr = [{name: "上海", value: 1},{name: "上海", value: 2},{name: "北京", value: 3},{name: "杭州", value: 2}]想要得到的json数据arr = [{name: "上海", value: 3},{name: "北京", value: 3},{name: "杭州", value: 2}]实现方法function trans (arr) { let obj = {} let re原创 2022-04-16 15:11:02 · 1814 阅读 · 0 评论 -
JS中==和===的区别
先说场景bug,在一次做管理后台项目中,用hidden是否等于0来判断左侧菜单是显示还是隐藏,而后端返回的hidden是字符串'0', 于是就有了下面的写法isShow = (hidden == 0)原本表示当hidden等于0时菜单不显实,hidden不等于0时菜单显示;结果就是isShow = ('0' == 0) // 返回true而所谓的Eslint又有一个坑的地方,每次一保存会默认把==变成===; 解决方法,保存后重启编辑器;isShow = ('0' === 0)原创 2022-01-18 16:56:37 · 138 阅读 · 0 评论 -
H5页面直接扫码二维码插件
H5页面直接扫码二维码插件https://github.com/wkl007/vue-scan-demo原创 2020-08-31 12:53:40 · 2329 阅读 · 0 评论 -
vue动态生成带有logo的二维码
https://www.npmjs.com/package/vue-qrcodecnpm install --save vue_qrcodes<template> <div> <qrcode :url="data.url" :iconurl="data.icon" :wid="200" :hei="200" :imgwid="53" :imghei="53"></qrcode> </div></te原创 2020-07-29 15:10:10 · 505 阅读 · 0 评论 -
javascript中json的去重复、统计、排序、数据整理问题案例介绍
//javascript中json的去重复、统计、排序、数据整理问题案例介绍var str='韩版 春新品 连衣裙 春新品 韩版 打底衫 连衣裙 裤子 连衣裙 春新品 连衣裙';var arr=str.split(' ');//将字符串切成数组 [春新品 韩版 春新品 连衣裙 春新品 韩版 打底衫 连衣裙 裤子 连衣裙 春新品 连衣裙]var json={}原创 2016-03-25 23:52:20 · 5683 阅读 · 0 评论 -
JavaScript 倒计时
JS倒计时DEMO,距离2017年国庆节还有多长时间倒计时?<!doctype html><html><head> <meta charset="utf-8"> <title>倒计时js代码 还剩多少天</title><script type="text/javascript"> function getRTime(){ var EndTime= new原创 2017-08-29 10:29:56 · 737 阅读 · 0 评论 -
Ajax上传如何实现文件上传进度条
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>显示文件上传进度条</title>原创 2017-08-02 15:41:21 · 4436 阅读 · 4 评论 -
如何使用ajax实现无刷新上传
详细代码如下 9.upload.html<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>ajax无刷新上传文件</title>原创 2017-08-02 14:48:06 · 1137 阅读 · 0 评论 -
JavaScript arguments对象
1、在JavaScript中,arguments对象是比较特别的一个对象,实际上是当前函数的一个内置属性。arguments非常类似Array,但实际上又不是一个Array实例。可以通过如下代码得以证实(当然,实际上,在函数funcArg中,调用arguments是不必要写成funcArg.arguments,直接写arguments即可)。Array.prototype.testArg = "te转载 2017-08-16 14:57:34 · 289 阅读 · 0 评论 -
Ajax怎么做跨域请求
下面我们在本地建两个站点演示一下第一步首先我们在本地搭建好一个Apache服务器;下载地址; Ajax怎么做跨域请求原创 2017-08-02 11:40:09 · 638 阅读 · 0 评论 -
正则表达式入门--xyphf
--------------------------------------------------------------------------------复习字符串的操作 indexOf 查找 substring 获取子字符串 charAt 获取某个字符 split 分割字符串,获得数组找出字符串中的所原创 2017-08-01 15:23:11 · 454 阅读 · 1 评论 -
如何将JSON的键转为键值-xyp-hf
前几天被后端小伙伴捉弄了一些,实际上是这样的,他返回了一个json给我,像下面这样{ "status": "000", "msg": "成功" "list": [{ "贵宾接待1室": [{ "id": "600", "start_time": "09:00", "end_time": "原创 2017-05-13 09:59:13 · 934 阅读 · 0 评论 -
二、webpack的基本配置(2)
http://blog.youkuaiyun.com/xyphf/article/details/62497706 webpack的基本配置(2)原创 2017-03-17 00:30:22 · 430 阅读 · 0 评论 -
正则表达式及常见用法介绍
正则表达式及常见用法介绍原创 2016-10-29 11:02:43 · 1218 阅读 · 0 评论 -
合并数组内json的相同项,不同项合并成数组
服务端可能会给我大量冗余数据让我们自己处理,如下列有多个id相同的是一条数据,却分成多个json丢出来,我们要合并一下相同项,将不同项后面变成数组;服务端给的数据如下: var json = [ { "lotteryTypeItemName":"主胜2.68", // 投注项名称 "homeScore"...原创 2018-05-22 11:51:09 · 5330 阅读 · 0 评论 -
Syntax error on tokens, they can be merge to form报错解决办法
检查一下有没有类似这种 + =之间的空格,去掉就好了原创 2018-09-04 22:11:31 · 2762 阅读 · 0 评论 -
[Vue warn]: Error in mounted hook: "SyntaxError: Unexpected token in JSON at position 54"
vue.esm.js?c5de:628 [Vue warn]: Error in mounted hook: "SyntaxError: Unexpected token in JSON at position 54"found in---> <OaHeader> at src/pages/common/oaHeader.vue <ElHeader...原创 2019-07-25 14:51:47 · 12069 阅读 · 2 评论 -
Object对象hasOwnProperty方法的作用,如何判断一个JSON对象中是否有某个键key
Object 对象自身用处不大,不过在了解其他类之前,还是应该了解它。因为 ECMAScript 中的 Object 对象与 Java 中的 java.lang.Object 相似,ECMAScript 中的所有对象都由这个对象继承而来,Object 对象中的所有属性和方法都会出现在其他对象中,所以理解了 Object 对象,就可以更好地理解其他对象。Object 对象具有下列属性:...转载 2019-05-05 16:53:58 · 7583 阅读 · 0 评论 -
获取json对象中的key小技巧
比如有一个jsonvar json = {"name" : "Tom", "age" : 18};想分别获取它的key 和 valuefor (var key in json) { console.log(key); //获取key值 console.log(json[key]); //获取对应的value值}还要一种方法用jquery回调函数完成的...转载 2019-04-28 23:49:26 · 5107 阅读 · 0 评论 -
超级大JSON渲染卡顿问题如何处理?管理系统左侧菜单渲染
在遇到类似上图左侧这种多级菜单时大多数同学使用的都是递归渲染,但是有个每个层级下面究竟有多少层有多少子菜单全都是不确定的,如果JSON特别大的时候点击菜单就会特别卡。如果JSON特别特别大就使用按需加载再渲染,就像此前有个兄弟做的地图软件,JSON有20M里面都是经纬度,这种还是按需加载比较好。如果比常规的要大很多,但是也到不了按需加载的程度,就像上面的左侧菜单一样,就使用按需渲染吧,...原创 2019-03-27 17:16:43 · 1690 阅读 · 0 评论 -
d3.js绘制环形图
lindex.html<!DOCTYPE html><html><head> <meta charset="UTF-8"> <link rel="stylesheet" href="css/style-bar.css" media="screen" type="text/css原创 2018-11-07 13:36:43 · 4918 阅读 · 0 评论 -
d3.js实现竖直柱状图表
index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" type=&q原创 2018-11-07 13:26:29 · 1061 阅读 · 0 评论 -
d3.js水平横向柱状图表
index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" type=&q原创 2018-11-07 12:34:49 · 3163 阅读 · 0 评论 -
使用D3.js绘制顺化曲线图面积图表
index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" type=&q原创 2018-11-07 11:42:59 · 788 阅读 · 0 评论 -
使用D3.js绘制顺化曲线图、坐标轴
index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" type=&q原创 2018-11-07 11:27:06 · 1509 阅读 · 0 评论 -
二、webpack的基本配置(1)
webpack的基本配置原创 2017-03-16 23:43:26 · 686 阅读 · 0 评论 -
一、webpack的安装和命令行 --xyp_hf
webpack入门及基本的命令行安装原创 2017-03-16 22:24:05 · 1908 阅读 · 0 评论 -
关于使用HTML5本地存储图片的介绍——和派孔明
关于使用HTML5本地存储图片的介绍——和派孔明原创 2016-07-05 09:17:19 · 4363 阅读 · 0 评论 -
HTML5本地存储sessionStorage和localStorage的常用操作
HTML5本地存储sessionStorage //数据随着浏览器的关闭而销毁。localStorage//不主动删除,永远不会销毁sessionStorage的常见用法 //设置存储,用途:将value存储到key字段,用法sessionStorage.setItem(key,value); sessionStorage.setItem("nam原创 2016-07-05 00:48:44 · 1011 阅读 · 0 评论 -
浅谈原生javascript的select操作
浅谈原声javascript的select下拉框操作原创 2016-07-26 09:15:45 · 5304 阅读 · 0 评论 -
JQuery的cookie使用方法——和派孔明
jquery.cookie.js的创建、读取、删除使用方法介绍原创 2016-07-03 22:45:55 · 690 阅读 · 0 评论 -
javascript的cookie使用方法介绍——和派孔明
我知道不少新手朋友在W3C上看cookie的用法都看晕了,在这里我通过最简单的方法向大家介绍cookie的用法,希望大家一看就懂。下面先简单的介绍一下cookie的作用: 保存用户信息,保存到客户端,浏览器里面 自动登录,记住用户名,发微博,微信cookie特点: 大小受限: 4k原创 2016-07-03 20:05:30 · 679 阅读 · 0 评论 -
javascript字符操作大全
concat() – 将两个或多个字符的文本组合起来,返回一个新的字符串。 indexOf() – 返回字符串中一个子串第一处出现的索引。如果没有匹配项,返回 -1 。 charAt() – 返回指定位置的字符。 lastIndexOf() – 返回字符串中一个子串最后一处出现的索引,如果没有匹配项,返回 -1 。 match() – 检查一个字符串是否匹配一个正则表达式。 substring() – 返回字符串的一个子串。传入参数是起始位置和结束位置。 replace() – 用来查找匹配一个原创 2016-07-03 13:43:51 · 461 阅读 · 0 评论 -
时间格式整理
var d = new Date();d.setTime(time*1000);var year=d.getFullYear();var month=d.getMonth()+1;month=fillZero(month);var date=d.getDate();date=fillZero(date);var hours=d.getHours();ho原创 2016-06-05 20:12:15 · 460 阅读 · 0 评论 -
javascript字符操作
字符串操作strObj.charAt(index) 返回找到字符、空字符给下标返字符strObj.indexOf(字符) 返回 下标、-1给字符返下标strObj.lastIndexOf(字符) 返回 下标、-1给字符返回下标strObj.substring(开始位置,结束位置) 提取字符串 结束位置不给,提取到末尾strObj.split(规则原创 2016-06-05 19:21:58 · 364 阅读 · 0 评论 -
封装ajax——前端工程师和派孔明
//data 后台要的数据//options = url,data,type,timeout,success,errorfunction ajax(options){options=options||{};options.data=options.data||{};options.type=options.type||'get';options.timeout=op原创 2016-05-22 10:45:13 · 834 阅读 · 0 评论 -
JavaScript数组常用操作大全
头部添加 unshiftvar arr=[12,5,'bmw'];var tmp = arr.unshift('qq');document.write(tmp); //返回数组长度-----------------------------------------------------------------------------头部剔除 shiftvar arr=[12原创 2016-05-18 12:39:11 · 678 阅读 · 0 评论 -
请用javascript求出1000以内所有的素数
var prime = function(len){ var i,j; var arr = []; for(i = 1; i for(j=2; j if(i%j === 0) { break; } } if(i arr.push(i); } }转载 2016-05-25 19:46:59 · 6177 阅读 · 0 评论