JS#4 正则表达式

最新推荐文章于 2024-07-28 18:19:21 发布

guaiwu_

最新推荐文章于 2024-07-28 18:19:21 发布

阅读量123

点赞数

分类专栏： HTML JS 文章标签：正则表达式前端 javascript Powered by 金山文档

本文链接：https://blog.csdn.net/guaiwu_/article/details/129305448

版权

HTML 同时被 2 个专栏收录

14 篇文章 0 订阅

订阅专栏

6 篇文章 0 订阅

订阅专栏

一. 正则表达式

定义:

var reg = 正则表达式;

var reg = new RegExp("正则表达式");

语法:

^: 表示开始

$: 表示结束

[ ]: 代表某个范围内的单个字符

. : 代表任意单个字符, 除了换行和行结束符

\w: 代表单词字符,数字,下划线

\d: 代表数字字符

量词:

+: 至少一个

*: 零个或多个

?: 零个或一个

{x}: x个

{m, }: 至少m个

{m,n}: 至少m个,最多n个

方法

test(str): 判断指定字符串是否符合规则, 返回true或false

代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>正则表达式</title>
</head>
<body>
<form action="#" method="get">
  <tr>
    <td>用户名:</td>
    <td>
      <input type="test" name="username" id="username">
      <br>
      <span id="username_err" style="display: none">用户名不符合规则</span>
    </td>
    <br>
    <td>密码:</td>
    <td>
      <input type="test" name="password" id="password">
    </td>


  </tr>



</form>
<script>
var usernameInput = document.getElementById("username");

  usernameInput.onblur = function() {
    var flag1 = /^\w{6,12}$/;

    var username = usernameInput.value.trim();

    if(flag1.test(username)){
     document.getElementById("username_err").style.display = "none";
    }else{
     document.getElementById("username_err").style.display = "";
    }

  }


var passwordInput = document.getElementById("password");



</script>
</body>
</html>