小白博客之--------正则表达式（今天也是划水的一天0.0）_正则表达式匹配 background-image: url-CSDN博客

本文链接：https://blog.csdn.net/qq_45614405/article/details/117711640

哈喽哈喽大家好，我是xxx；今天我们学习的是js的正则表达式。

首先，我们来了解一下正则表达式是什么；

正则表达式：正则表达式通常被用来检索、替换那些符合某个模式(规则)的文本。简单来讲，就是用来检验你的输入是否符合标准的一准判断方式。

然后，使用正则表达式的方法也不止一种，但是今天我们主要讲的就是regExp方法。

创建格式为：new RegExp(pattern, attributes);

其中，参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。
参数 attributes 是一个可选的字符串，包含属性 "g"、"i" 和 "m"，分别用于指定全局匹配、区分大小写的匹配和多行匹配。ECMAScript 标准化之前，不支持 m 属性。如果 pattern 是正则表达式，而不是字符串，则必须省略该参数。

如果就得博主讲得不够详细的话可以参考网址：https://www.w3school.com.cn/jsref/jsref_obj_regexp.asp

然后，我们举出一个运用了正则表达式的例子：判断用户输入的密码是否符合要求（不少于6位数，由数字和字符组成）

<style>
    #a{

        width: 1000px;
        height: 400px;
        background-image:url("1.jpg") ;
        /* background-repeat: no-repeat; */
        background-position: center;
        position: relative;
        top: 100px;
        left: 130px;
    }
    #b{
        background:rgba(255,255,255,0.3);
        width: 350px;
        height: 350px;
        border-radius: 175px;
        position: absolute;
        margin:auto;
        top: 20px;
        left: 325px;
        text-align:center;
        /* vertical-align: auto; */
        line-height:120px;
    }
    button{
        background-color: rgb(139, 228, 231);
    }
</style>
<body>
    <div id="a">
    <div id="b">
        用户名：<input type="text" placeholder="请输入用户名"><br>
        密&nbsp&nbsp码：<input type="text" placeholder="请输入密码" id="email"><br>
        <button id="login">登录</button>&nbsp&nbsp&nbsp&nbsp&nbsp
        <a href="注册.html"><button id="login">注册</button></a>
    </div>
    </div>
	
</body>
<script>
    var loginBtn=document.getElementById("email")
	email.onchange = function(){
		var email = this.value;
		var reg = /^(\w){6,}$/;
		if(reg.test(email)){
			alert("邮箱格式正确，登录成功");
		}else{
			alert("邮箱格式不正确，登录失败");
		}
	}
</script>

以下为两种结果：