当前位置： 首页 > news >正文

while do..while验证用户名和密码-课后程序(JavaScript前端开发案例教程-黑马程序员编著-第2章-课后作业)

news 文章来源：https://blog.csdn.net/yw1990128/article/details/129748652 2025/5/15 1:44:06

【案例2-8】while do..while验证用户名和密码

一、案例描述

  1. 考核知识点

while、do…while循环语句

  1. 练习目标
  • 掌握while语句。
  • do…while循环语句。
  1. 需求分析

在网站上登录时会用到表单，让用户属于用户名和密码，输入正确才可以进入，本案例将采用while do..while两种循环方式来进行用户名和密码的验证。

  1. 案例分析
  1. 打开页面时，效果如图2-11所示。

  1. 输入用户名展示

  1. 输入密码效果展示

如果输入的信息正确，则弹出如图2-13所示提示。

  1. 提示登录成功

如果输入的信息不正确，则弹出如图2-14所示提示。

  1. 提示登录失败

  1. 具体实现步骤如下：
  1. 用户输入用户名。
  2. 用户输入密码。
  3. 输入的内容，如果符合语句中的条件则提示“登录成功”，不符合时提示“用户名或者密码有误”，让你一直输入用户名和密码，直到输入正确为止。

二、案例实现

1、while循环方式实现

根据上面的分析，可以通过简单的JavaScript代码来实现这一效果，具体代码如下：

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>验证用户名和密码</title>
  6. </head>
  7. <body>
  8.     <script>
  9.         // 输入用户名和密码，如果正确，给出弹出框提示"登录成功"，如果不对，一直输入:while
  10.         /* 第一种方式 while*/
  11.         var userName = prompt("请输入用户名");
  12.         var passWord = prompt("请输入密码");
  13.         while( userName!="admin" || passWord!="123456" ){
  14.            alert("用户名或者密码有误");
  15.            userName = prompt("请输入用户名");
  16.            passWord = prompt("请输入密码");
  17.         }
  18.         alert("登录成功");
  19.     </script>
  20. </body>
  21. </html>

2、do…while循环方式实现

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>验证用户名和密码</title>
  6. </head>
  7. <body>
  8.     <script>
  9.         // 输入用户名和密码，如果正确，给出弹出框提示"登录成功"，如果不对，一直输入
  10.         /* 第二种方式 do...while
  11.         do {
  12.             // alert("用户名或者密码有误");
  13.             var userName = prompt("请输入用户名");
  14.             var passWord = prompt("请输入密码");
  15.         }while(userName!="admin"||passWord!="123456")
  16.         alert("登录成功");*/
  17.     </script>
  18. </body>
  19. </html>

相关文章：

while do..while验证用户名和密码-课后程序(JavaScript前端开发案例教程-黑马程序员编著-第2章-课后作业)

【案例2-8】while do..while验证用户名和密码 一、案例描述 考核知识点 while、do…while循环语句 练习目标 掌握while语句。do…while循环语句。 需求分析 在网站上登录时会用到表单&#xff0c;让用户属于用户名和密码&#xff0c;输入正确才可以进入&#xff0c;本案例将…...

编程日记 2023/3/31 2:25:48

tmux常用操作指令

创建会话tmux new -s 会话名 恢复会话tmux at -t 会话名 tmux attach -t 会话名 杀死会话tmux kill-session -t 编号 tmux kill-session -t 会话名 查询会话tmux ls tmux list-session 划分窗格划分上下两个窗格&#xff1a; tmux split-window 划分左右两个窗格&#xff1a;…...

编程日记 2023/4/15 17:29:04

【Linux】线程安全

线程安全&#xff1a;在多线程运行的时候&#xff0c;不论线程的调度顺序怎样&#xff0c;最终的结果都是 一样的、正确的&#xff0c;这个线程就是安全的。 保证线程安全的要求&#xff1a; 1. 对线程同步&#xff0c;保证同一时刻只有一个线程访问临界资源。 2.在多线程中使用…...

编程日记 2023/4/19 15:29:18

Redis-mysql 缓存实战

本文基于Springboot&#xff0c;mybatis plus&#xff0c;mysql&#xff0c;redis&#xff0c; Jedis模拟redis缓存实现 目录 1. 添加所需maven依赖 2. 设置数据库及数据表 3. 构建实体类 4. 构建工具类实现 redis 数据库连接池&#xff0c;redis 的读取&#xff0c;写入功…...

编程日记 2023/4/11 6:49:01

蓝桥杯：通电

蓝桥杯&#xff1a; 通电https://www.lanqiao.cn/problems/162/learning/ 目录 题目描述 输入描述 输出描述 输入输出样例 输入 输出 题目分析(最小生成树)&#xff1a; AC代码(Java) 题目描述 2015 年&#xff0c;全中国实现了户户通电。作为一名电力建设者&#xff0…...

编程日记 2023/4/15 17:31:01

一文搞懂 Kubernetes 的 Limits 和 Requests

当在Kubernetes中使用容器时&#xff0c;重要的是要知道所涉及的资源是什么以及如何需要它们。有些进程比其他进程需要更多的CPU或内存。有些是关键的&#xff0c;不应该被饿死。知道了这一点&#xff0c;我们应该正确配置我们的容器和Pod&#xff0c;以获得两者的最佳效果。在…...

编程日记 2023/4/15 17:32:14

【C++】手撕红黑树

文章目录前言一、红黑树的概念二、红黑树的节点结构三、红黑树的插入四、红黑树的调整1、叔叔存在且为红2、叔叔不存在或存在且为黑3、插入完整代码4、总结五、红黑树的验证六、红黑树的删除七、红黑树与 AVL 树的比较八、红黑树的代码实现前言 在网络上流传着这样一张图片&am…...

编程日记 2023/4/18 19:55:30

Java中的CAS实现原理

文章目录一、什么是CAS&#xff1f;二、JAVA中如何实现CAS操作三、CAS在JUC中的运用四、ABA问题一、什么是CAS&#xff1f; 在计算机科学中&#xff0c;比较和交换&#xff08;Conmpare And Swap&#xff09;是用于实现多线程同步的原子指令。 它将内存位置的内容与给定值进行…...

编程日记 2023/4/18 19:56:09

什么是华为云对象存储OBS？它有什么优势？

华为对象存储OBS&#xff08;Object Storage Service&#xff09;是一种高可用、高可靠、高性能的云存储服务&#xff0c;能够为企业和个人用户提供强大的数据存储和管理功能。本文将对华为对象存储OBS的特点、优势和未来发展进行详细介绍。 一、华为对象存储OBS的特点 1.对象…...

编程日记 2023/3/31 1:45:38

你知道照片怎么变清晰吗？增强照片清晰度的方法

相信很多小伙伴都会有这种的经历&#xff0c;去游玩时高高兴兴的拍照留念&#xff0c;结果拍出来的照片不是很尽人意。或者是画面还没聚焦好&#xff0c;就按下快门&#xff0c;导致拍摄出来的照片变模糊了。很多小伙伴遇到这种情况都很烦恼&#xff0c;照片丢了可惜&#xff0…...

编程日记 2023/4/13 18:01:04

NOIP模拟赛 轰炸（bomb）

题目描述 有nnn座城市&#xff0c;城市之间建立了mmm条有向的地下通道。 你需要发起若干轮轰炸&#xff0c;每轮可以轰炸任意多的城市。但在每次轰炸城市中&#xff0c;不能同时存在两个城市i,ji,ji,j满足可以通过地下通道从城市iii到达城市jjj。你需要求出最少需要多少轮可以…...

编程日记 2023/4/19 15:30:57

Linux系统之安装PHP环境

Linux系统之安装PHP环境 一、PHP介绍1.PHP简介2.PHP优势3.php7版本特点二、本地环境介绍1.环境规划2.检查操作系统版本3.检查当前yum仓库三、安装PHP5.4版本1.查看可安装php版本2.使用yum安装php3.安装httpd服务4.关闭selinux和设置防火墙5.编辑index.php测试文件6.测试php环境…...

编程日记 2023/4/18 19:57:57

MySQL8的安装教程

MySQL8的安装教程 1.安装包的下载 如果不想去官网下载的话可以去百度网盘进行下载。 MySQL :: Download MySQL Community Server mysql-8.0.28-winx64.zip_免费高速下载|百度网盘-分享无限制 (baidu.com) 提取码&#xff1a;0001 2.解压 3.创建一个my.ini的文件 最好是创建…...

编程日记 2023/4/13 2:58:08

日入500+的程序员都在用的“接私活”平台

网上总说程序员的薪资很高&#xff0c;这我可就不同意了&#xff1a; 程序员的薪资哪里是很高&#xff0c;而是非常高&#xff01;而会接私活的程序员更是能拿到更高的收入&#xff01;作为一个程序员&#xff0c;这些接私活的网站一定要收藏起来&#xff0c;让你在“八小时外…...

编程日记 2023/3/31 1:20:32

MySQL表设计思路（一对多、多对多...）

要开始单独负责需求了&#xff0c;捋一捋表设计的思路。 文章目录一、MySQL中的数据类型二、一对一的关系设计二、一对多的关系设计三、多对多的关系设计四、经验总结一、MySQL中的数据类型 字符串类型 varchar&#xff1a;即variable char &#xff0c;可边长度的字符串&#…...

编程日记 2023/4/18 19:59:40

内存对齐：C/C++编程中的重要性和技巧

C/C中的内存对齐前言基本概念 什么是内存对齐&#xff1f;内存对齐的定义内存对齐的作用数据类型的大小ARM 64 位架构和 x86_64 架构下的数据类型大小ARM 32 位架构下的数据类型大小内存对齐的边界填充字节的作用内存对齐的原理结构体中的内存对齐结构体的定义和使用结构体中成…...

编程日记 2023/3/31 1:10:28

C++ Primer第五版_第七章习题答案（41~50）

文章目录练习7.411、头文件2、源文件3、主函数练习7.42练习7.43练习7.44练习7.45练习7.46练习7.47练习7.48练习7.49练习7.50练习7.41 使用委托构造函数重新编写你的Sales_data 类&#xff0c;给每个构造函数体添加一条语句&#xff0c;令其一旦执行就打印一条信息。用各种可能的…...

编程日记 2023/4/15 17:34:32

python玄阶斗技--NumPy入门

目录 一.NumPy介绍 二.创建数组 1.一维数组创建 2.二维数组创建 3.zeros函数 4.ones函数 5.empty函数 6.arange函数 三.NumPy的数学操作 1.基本运算 2.矩阵运算 3.ndarray类的方法 四.数组堆叠 五.数组分隔 一.NumPy介绍 在这里对NumPy的介绍我不想扯太多&#xf…...

编程日记 2023/4/13 2:59:15

VR黑科技丨远离拥挤，VR直播开启沉浸式赏樱新姿势

春光兮婉转&#xff0c;珞樱兮盛绽&#xff0c;又是一年樱花季&#xff0c;全国各地大部分地区的樱花进入盛花期&#xff0c;尤其是武汉&#xff0c;东湖樱园踏青赏花的游人如织、摩肩擦踵&#xff0c;勾勒一幅“人人人人人人人花人人人人人”的盛景。 为了一睹樱花“芳容”&am…...

编程日记 2023/4/19 5:28:51

ts的一些用法

1.交叉类型 & ---多个类型属性的集合 1.1类型别名实现 type Person {name:string} type Children Person & {age:number} let newPerson:Children {// name:hahah,name:hhaah,age:18 } 1.2 接口类型实现 interface Inter1{name:string } interface Inter2{name:…...

编程日记 2023/4/14 8:45:03

云计算面试总结

shell脚本对日志进行备份 shell 对日志备份 #!/bin/bash if [ -d /log/bak/ ] || mkdir -p /log/bak/ thentar Pcf /log/bak/log_$(date %Y%m%d)$(date %H%M%S).tar.gz /var/log/*.logecho "干完&#xff01;可以约会啦" fi存在的问题&#xff1a; 说的太快&a…...

编程日记 2023/4/14 8:46:07

（DP）买不到的数目【蓝桥杯】（裴蜀定理）

买不到的数目 小明开了一家糖果店。 他别出心裁&#xff1a;把水果糖包成4颗一包和7颗一包的两种。 糖果不能拆包卖。 小朋友来买糖的时候&#xff0c;他就用这两种包装来组合。 当然有些糖果数目是无法组合出来的&#xff0c;比如要买 10 颗糖。 你可以用计算机测试一下&#…...

编程日记 2023/4/18 20:00:22

Docker使用DockerFile部署Go项目

Docker使用DockerFile部署Go项目1. 文章说明2. Go项目打包到Linux2.1 学习链接与知识点2.2. 打包生成 main 文件2.3 Docker部署Go项目1. 文章说明 目的&#xff1a;将打包生成的 main 文件&#xff0c;在Docker里面&#xff0c;使用Dockerfile文件&#xff0c;生成镜像与容器&…...

编程日记 2023/4/18 20:02:56

C++ Primer第五版_第七章习题答案（31~40）

文章目录练习7.31练习7.32练习7.33练习7.34练习7.35练习7.36练习7.37练习7.38练习7.29练习7.40练习7.31 定义一对类X 和Y&#xff0c;其中X 包含一个指向 Y 的指针&#xff0c;而Y 包含一个类型为 X 的对象。 class Y;class X{Y* y nullptr; };class Y{X x; };练习7.32 定义你…...

编程日记 2023/4/18 20:18:40

基于springboot实现学生成绩管理系统【源码+论文】分享

基于springboot实现学生成绩管理系统演示开发语言&#xff1a;Java 框架&#xff1a;springboot JDK版本&#xff1a;JDK1.8 服务器&#xff1a;tomcat7 数据库&#xff1a;mysql 5.7 数据库工具&#xff1a;Navicat11 开发软件&#xff1a;eclipse/myeclipse/idea Maven包&…...

编程日记 2023/4/18 20:21:11

Linux diff 命令

Linux diff 命令用于比较文件的差异。 diff 以逐行的方式&#xff0c;比较文本文件的异同处。如果指定要比较目录&#xff0c;则 diff 会比较目录中相同文件名的文件&#xff0c;但不会比较其中子目录。 语法 diff [-abBcdefHilnNpPqrstTuvwy][-<行数>][-C <行数&g…...

编程日记 2023/4/18 20:21:41

unity动画状态机

介绍&#xff1a; 动画状态机&#xff08;Animation State Machine&#xff09;是Unity中用于控制动画状态转换的工具&#xff0c;它由多个状态&#xff08;State&#xff09;和转换&#xff08;Transition&#xff09;组成&#xff0c;可以通过状态转换来控制动画的播放行为。…...

编程日记 2023/4/18 20:33:05

溯源（五）之攻击源的获取

溯源&#xff08;一&#xff09;之溯源的概念与意义 溯源&#xff08;二&#xff09;之 windows-还原攻击路径 溯源&#xff08;三&#xff09;之Linux-入侵排查 溯源&#xff08;四&#xff09;之流量分析-Wireshark使用 溯源整体流程的思维导图 攻击源的获取 1、获取哪些数…...

编程日记 2023/4/18 20:35:32

【redis】redis淘汰策略

一、说明 1.redis key没有设置过期时间被redis主动删除了 2.当redis已用内存超过maxmemory限定时&#xff0c;触发主动清理策略 3.主动清理策略在redis4.0之前一共实现了6种内存淘汰策略&#xff0c;在4.0之后&#xff0c;增加了2种&#xff0c;总共8种 二、淘汰策略 2.1 针对…...

编程日记 2023/4/18 20:37:04

指针和数组（二）

目录 指针和数组 数组名和指针的区别 多维数组 数组指针 语法 作用 内存大小 自增运算 【】运算 指针和数组 结论&#xff1a;数组的本质就是指针。数组的【】运算同样可以用指针来运算 证明 C代码 int array[5];int* ptr{ &array[0] };*ptr 5;array[0] 5;arr…...

编程日记 2023/4/13 18:04:27