web蓝桥杯真题:蓝桥校园一卡通

2024-03-14 07:04

本文主要是介绍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蓝桥杯真题:蓝桥校园一卡通的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/807585

相关文章

JSON Web Token在登陆中的使用过程

《JSONWebToken在登陆中的使用过程》:本文主要介绍JSONWebToken在登陆中的使用过程,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录JWT 介绍微服务架构中的 JWT 使用结合微服务网关的 JWT 验证1. 用户登录,生成 JWT2. 自定义过滤

一文教你如何将maven项目转成web项目

《一文教你如何将maven项目转成web项目》在软件开发过程中,有时我们需要将一个普通的Maven项目转换为Web项目,以便能够部署到Web容器中运行,本文将详细介绍如何通过简单的步骤完成这一转换过程... 目录准备工作步骤一:修改​​pom.XML​​1.1 添加​​packaging​​标签1.2 添加

web网络安全之跨站脚本攻击(XSS)详解

《web网络安全之跨站脚本攻击(XSS)详解》:本文主要介绍web网络安全之跨站脚本攻击(XSS)的相关资料,跨站脚本攻击XSS是一种常见的Web安全漏洞,攻击者通过注入恶意脚本诱使用户执行,可能... 目录前言XSS 的类型1. 存储型 XSS(Stored XSS)示例:危害:2. 反射型 XSS(Re

解决JavaWeb-file.isDirectory()遇到的坑问题

《解决JavaWeb-file.isDirectory()遇到的坑问题》JavaWeb开发中,使用`file.isDirectory()`判断路径是否为文件夹时,需要特别注意:该方法只能判断已存在的文... 目录Jahttp://www.chinasem.cnvaWeb-file.isDirectory()遇

JavaWeb-WebSocket浏览器服务器双向通信方式

《JavaWeb-WebSocket浏览器服务器双向通信方式》文章介绍了WebSocket协议的工作原理和应用场景,包括与HTTP的对比,接着,详细介绍了如何在Java中使用WebSocket,包括配... 目录一、概述二、入门2.1 POM依赖2.2 编写配置类2.3 编写WebSocket服务2.4 浏

Spring常见错误之Web嵌套对象校验失效解决办法

《Spring常见错误之Web嵌套对象校验失效解决办法》:本文主要介绍Spring常见错误之Web嵌套对象校验失效解决的相关资料,通过在Phone对象上添加@Valid注解,问题得以解决,需要的朋... 目录问题复现案例解析问题修正总结  问题复现当开发一个学籍管理系统时,我们会提供了一个 API 接口去

使用IntelliJ IDEA创建简单的Java Web项目完整步骤

《使用IntelliJIDEA创建简单的JavaWeb项目完整步骤》:本文主要介绍如何使用IntelliJIDEA创建一个简单的JavaWeb项目,实现登录、注册和查看用户列表功能,使用Se... 目录前置准备项目功能实现步骤1. 创建项目2. 配置 Tomcat3. 项目文件结构4. 创建数据库和表5.

手把手教你idea中创建一个javaweb(webapp)项目详细图文教程

《手把手教你idea中创建一个javaweb(webapp)项目详细图文教程》:本文主要介绍如何使用IntelliJIDEA创建一个Maven项目,并配置Tomcat服务器进行运行,过程包括创建... 1.启动idea2.创建项目模板点击项目-新建项目-选择maven,显示如下页面输入项目名称,选择

Java Web指的是什么

Java Web指的是使用Java技术进行Web开发的一种方式。Java在Web开发领域有着广泛的应用,主要通过Java EE(Enterprise Edition)平台来实现。  主要特点和技术包括: 1. Servlets和JSP:     Servlets 是Java编写的服务器端程序,用于处理客户端请求和生成动态网页内容。     JSP(JavaServer Pages)

BUUCTF靶场[web][极客大挑战 2019]Http、[HCTF 2018]admin

目录   [web][极客大挑战 2019]Http 考点:Referer协议、UA协议、X-Forwarded-For协议 [web][HCTF 2018]admin 考点:弱密码字典爆破 四种方法:   [web][极客大挑战 2019]Http 考点:Referer协议、UA协议、X-Forwarded-For协议 访问环境 老规矩,我们先查看源代码