前端处理字符串

前言

  本文介绍一下前端对于字符串的一些处理方式。

截取后6位

var bankCardNo = '62170002100109068854';
var card = ((bankCardNo.split("").reverse().join("")).substring(0,6)).split("").reverse().join("");

split:将一个字符串分割成字符串数组
reverse:反转
join:数组中的所有元素放入字符串中

  输出结果:068854。

每隔4位添加空格

var bankCardNo = '62 17  0m0   021  00 109  068854';
var card = bankCardNo.replace(/\s/g,'').replace(/[^\d]/g,'').replace(/(\d{4})(?=\d)/g,'$1 ')

replace(/\s/g,’’):去除所有空格
replace(/[^\d]/g,’’):去除所有字母
replace(/(\d{4})(?=\d)/g,’$1 '):每4位加一个空格

  输出结果:6217 0002 1001 0906 8854。


http://www.niftyadmin.cn/n/1659537.html

相关文章

在json或数组中利用find方法实现根据value值获取key值的过程

前言 在项目开发的过程中有时候会遇到这种情况:预先定义的对象数组或者json对象,后端返回了一个value值,而你需要用的是key值,后端又没有办法返给你key值,这个时候就需要自己根据value值找key值了。 find函数 find函数…

Flex入门基础——Flex布局、容器container的属性

1、作用: 利用Flex可实现完美居中效果; 例(1)——display:flex; (注意:无论父元素以何种比例递增,元素依旧保持水平居中) .container{width:200px;height:200px;background: cade…

Flex布局——色子的小案例

制作色子&#xff0c;即制作相对应的1-6的几个点 1、运用知识点 a、容器——container b、项目——item 代码示例&#xff1a; <div class"container"> <div class"item"></div> </div> 2、主要采用上述两个的属性值进行编…

截取地址栏上的参数

前言 项目开发的过程中&#xff0c;有时会使用到地址栏中的参数&#xff0c;那如何获取到地址栏中的参数呢&#xff1f; 获取方式 js文件 export function UrlSearch() {let name, value, str location.href, num str.indexOf("?"); //取得整个地址栏str str.…

sprite精灵图转二倍图

精灵图 精灵图又名雪碧图&#xff0c;产生原因是网页首次加载的时候需要加载很多图片&#xff0c;为了解决服务器拥堵的问题。精灵图可以缓解加载时间过长&#xff0c;从而提升用户体验。精灵图就是把很多小的图片合并到一张大的图片中&#xff0c;在首次加载的时候只需要加载出…

Flex入门基础——项目item的属性(order、flex-grow、flex-shrink、flex-basis、flex、align-self)

1、order 取值&#xff1a;数值 功能&#xff1a;&#xff08;1&#xff09;容器中有多个项目&#xff0c; &#xff08;2&#xff09;项目的默认摆放时沿主轴&#xff08;纵向&#xff09;方向&#xff0c;即按文档中dom元素的书写顺序进行排列的&#xff1b; 应用&#xf…

vue-cli4新建项目及分环境打包

写在前面 小编之前一直使用的是vue-cli2&#xff0c;没想到现在vue-cli4都出来挺长时间的了。现在就来探索一下脚手架4是如何新建项目并且进行分环境打包的吧。 新建项目一 1.winR进入cmd命令窗口&#xff0c;到自己要建项目的路径下&#xff0c;这里我的目录是桌面   2.新建…

Flex布局应用(1)——为什么flex只能做移动端APP开发?

1、APP的分类 &#xff08;1&#xff09;原生APP &#xff08;2&#xff09;混合APP &#xff08;3&#xff09;WEB APP 2、PC端和移动端的差别 &#xff08;1&#xff09;用户交互方式不同&#xff1a;表现在鼠标、手指 &#xff08;2&#xff09;呈现的数据量不同&#…