2019年前端必用js正则(小结)

2019年前端必用js正则(小结)

正则表达式是一种字符串匹配的工具,可以在前端开发中处理文本、验证输入、搜索替换等各种问题。下面是一些前端开发中可能会用到的JavaScript正则表达式。

常用的正则表达式

  1. 邮箱格式验证
const emailReg = /^([a-zA-Z0-9._-]+)@([a-zA-Z0-9_-]+)\.([a-zA-Z]{2,6})$/;

示例:

const email = 'test@example.com';
if (emailReg.test(email)) {
  console.log('邮箱格式正确');
} else {
  console.log('邮箱格式不正确');
}
  1. 手机号格式验证
const phoneReg = /^1[3456789]\d{9}$/;

示例:

const phone = '13812345678';
if (phoneReg.test(phone)) {
  console.log('手机号格式正确');
} else {
  console.log('手机号格式不正确');
}
  1. 身份证号码格式验证
const idCardReg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;

示例:

const idCard = '610103198801011234';
if (idCardReg.test(idCard)) {
  console.log('身份证号码格式正确');
} else {
  console.log('身份证号码格式不正确');
}
  1. URL格式验证
const urlReg = /^((https|http|ftp|rtsp|mms)?:\/\/)[^\s]+/;

示例:

const url = 'https://www.example.com';
if (urlReg.test(url)) {
  console.log('URL格式正确');
} else {
  console.log('URL格式不正确');
}
  1. 匹配中文
const chineseReg = /^[\u4e00-\u9fa5]{0,}$/;

示例:

const chinese = '你好吗';
if (chineseReg.test(chinese)) {
  console.log('匹配中文成功');
} else {
  console.log('匹配中文失败');
}

小结

正则表达式是一种强大的工具,可以在前端开发中解决很多问题。以上是常用的几种正则表达式,涵盖了前端开发中常见的需求。在实际使用过程中,还需要根据具体需求进行自定义正则表达式的编写。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:2019年前端必用js正则(小结) - Python技术站

(0)
上一篇 2023年6月10日
下一篇 2023年6月10日

相关文章

  • 详解JavaScript原型对象的this指向问题

    下面我将详细讲解“详解JavaScript原型对象的this指向问题”的完整攻略。 原型对象的this指向问题 在JavaScript中,this代表的是函数的执行上下文。而原型对象的this指向则与常规函数的this指向有所不同,需要特别注意。 常规函数中的this指向 在常规函数中,this代表的是所属的对象。例如: const person = { n…

    JavaScript 2023年6月10日
    00
  • JavaScript CollectGarbage函数案例详解

    介绍 CollectGarbage 函数前,我们需要先了解一下垃圾回收机制。JavaScript 是一种有垃圾回收机制的语言,当我们在代码中创建一个对象,如果该对象不再被引用,那么它就成为了一份“垃圾”,垃圾回收机制会被触发,将其回收。这样可以有效地避免内存泄漏等问题。 CollectGarbage 函数是 JavaScript 的一种垃圾回收函数,可以手动…

    JavaScript 2023年6月11日
    00
  • Visual Studio中js调试的方法图解

    下面我将详细地讲解“Visual Studio中js调试的方法图解”的完整攻略。 一、Visual Studio中js调试的方法图解 在 Visual Studio 中,开发者可以方便地对 JavaScript 代码进行调试,它提供了丰富的调试工具和应用程序接口。下面是使用 Visual Studio 进行 JavaScript 调试的步骤: 1. 打开一个…

    JavaScript 2023年6月11日
    00
  • JS中位置与大小的获取方法

    当我们开发JavaScript程序时,经常需要获取页面元素的位置与大小,以便进行后续的操作。接下来,我将为大家介绍JS中获取元素位置与大小的方法。 获取元素位置 1. offsetTop和offsetLeft属性 offsetTop和offsetLeft是用来获取某个元素相对于其offsetParent元素(指具有定位属性的父元素)的左上角距离的。 cons…

    JavaScript 2023年6月10日
    00
  • Javascript Date getSeconds() 方法

    以下是关于JavaScript Date对象的getSeconds()方法的完整攻略,包括两个示例说明。 JavaScript Date对象的getSeconds()方法 JavaScript Date对象的getSeconds()方法返回一个秒的数字(0-59)。方法可用获取当前日期的秒数。 下使用Date对象的getSeconds()方法的示例: var…

    JavaScript 2023年5月11日
    00
  • js购物车实现思路及代码(个人感觉不错)

    下面是我对“js购物车实现思路及代码(个人感觉不错)”这篇文章的详细讲解。 一、思路概述 文章中的购物车实现主要包括三个部分:商品页面展示、购物车页面展示、购物车功能实现。其中,商品页面展示和购物车页面展示主要是前端页面的设计,而购物车功能实现则需要用到 JavaScript。 具体实现流程如下: 在商品页面设计商品列表,每个商品都有一个对应的“加入购物车”…

    JavaScript 2023年6月11日
    00
  • 纯js实现div内图片自适应大小(已测试,兼容火狐)

    下面是纯js实现div内图片自适应大小的完整攻略: 目录 实现思路 代码实现 示例一 示例二 实现思路 实现div内图片自适应大小,需要解决以下两个问题: 如何获取图片的宽度和高度? 如何在图片加载完成后将其按照正确的比例缩放到合适的大小? 因此,我们的实现思路是: 使用JS监听图片的load事件,在图片加载完成后获取其宽度和高度。 判断图片的宽高比例与容器…

    JavaScript 2023年6月11日
    00
  • BootStrap 动态添加验证项和取消验证项的实现方法

    当我们使用 Bootstrap 进行表单验证时,我们需要使用其提供的表单验证插件来简化验证开发。Bootstrap 的表单验证插件可以被在 HTML 标记中定义的 data 属性触发,例如 required、pattern 和 minlength。但是我们也需要动态地添加或取消这些验证项。 下面是Bootstrap动态添加验证项的实现方法: 动态添加 req…

    JavaScript 2023年6月10日
    00
合作推广
合作推广
分享本页
返回顶部