本文主要是介绍web蓝桥杯真题:蓝桥校园一卡通,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
代码:
submit.onclick = () => {// TODO 待补充代码const form_group = document.querySelectorAll('.form-group')const vail_name = document.querySelector('#vail_name')const vail_studentId = document.querySelector('#vail_studentId') //获取元素let nameReg = /^[\u4e00-\u9fa5]{2,4}$/ //名字正则if (!nameReg.test(studentName.value)) {form_group[0].classList.add('has-error') //添加类名vail_name.style.display = 'block' //修改样式}let idReg = /\d{1,12}$/ //学号正则if(!idReg.test(studentId.value)) {form_group[1].classList.add('has-error')vail_studentId.style.display = 'block'}if(nameReg.test(studentName.value) && idReg.test(studentId.value)) {item[0].innerText = `姓名:${studentName.value}` //填写元素文本内容item[1].innerText = `学号:${studentId.value}`item[2].innerText = `学院:${college.value}`// 添加 showCard 类显示放大一卡通的动画,请勿删除cardStyle.classList.add('showCard') }
}
知识点:
1.正则匹配:
-
{n,m}
:匹配前面的模式至少 n 次且不超过 m 次。 -
^
:匹配字符串的开头。 -
$
:匹配字符串的结尾。 -
\d :[0~9] || 匹配一个数字 /^18\d{8}$/
-
\ :后加特殊字符
-
match()方法:返回一个数组,其中存放了与它找到的匹配文本有关的信息
str.match(reg)
var str="ih5sc01xss"; var n=str.match(/[0-4]/g); console.log(n) //[0,1]
-
test()方法:检查字符串是否与给出的正则表达式模式相匹配,返回Boolean
reg.test(str)
let reg = /^[\d]{2}$/g; let str = "12"; console.log(reg.test(str)); //返回true let = "123"; console.log(reg.test(str)); //从数字3开始匹配,只有一个数字,故返回false
2.元素添加类名:
element.classList.add('')
3.元素文本内容修改/填写:
element.innerText = ''
这篇关于web蓝桥杯真题:蓝桥校园一卡通的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!