前端Java Script基础(五)

这篇博客主要介绍了JavaScript中的练习,包括自加自减、if语句、prompt()函数的应用,以及switch、while、for循环的实战示例。内容涵盖了根据成绩给出不同奖励、数字排序、星期对应整数、合格不合格判断、复利计算、奇数和7的倍数的运算、水仙花数和质数判断等。通过这些练习,读者可以深入理解JavaScript的基础语法和逻辑控制。
摘要由CSDN通过智能技术生成

练习

自加自减练习

		<script type="text/javascript">		
			var n1=10;
			var n2=20;
			
			var n = n1++; //n1 = 11  n1++ = 10
			
			console.log('n='+n);  				// 10
			console.log('n1='+n1); 				//11
			
			n = ++n1 //n1 = 12  ++n1 =12
			console.log('n='+n); 				//12
			console.log('n1='+n1); 				//12
			
			n = n2--;							// n2=19 n2--=20
			console.log('n='+n); 				//20
			console.log('n2='+n2);				//19
			
			n = --n2; 							//n2=18 --n2 = 18
			console.log('n='+n); 				//18
			console.log('n2='+n2); 				//18					
		</script>

if练习

  • prompt()可以弹出一个提示框,该提示框中会带有一个文本框,用户可以在文本框中输入一段内容,该函数需要一个字符串作为参数,该字符串将会作为提示框的提示文字。

1.从键盘输入小明的期末成绩:当成绩为100时,‘奖励一个平板’;当成绩为[80-99]时,‘奖励一台iphone7’;当成绩为[60-80]时,‘奖励一本参考书’;其他时,什么奖励也没有。

		<script type="text/javascript">	
			/* 用户输入的内容将会作为函数的返回值返回,可以定义一个变量来接收该内容 */
			//score就是小明的期末成绩
			//var score = prompt("请输入小明的期末成绩(0-100):");
			var score = prompt("请输入小明的期末成绩:");			
			//判断值是否合法
			if(score > 100 || score < 0 || isNaN(score)){
   
				alert("此成绩有误”);
			}else{
   
				//根据score的值来决定给小明什么奖励
				if(score == 100){
   
					//奖励一台宝马
					alert("奖励一个平板"));
				}else if(score >= 80){
   
					//奖励一个手机
					alert("奖励一台iphone7");
				}else if(score >= 60){
   
					//奖励一本参考书
					alert("奖励一本参考书");
				}else{
   
					alert("没有奖励");
				}
			}
		</script>

2.编写程序,由键盘输入三个整数分别存入变量num1、num2、num3,对他们进行排序,并且从小到大输出。

		<script type="text/javascript">			
			//获取用户输入的三个数
			/*   prompt()函数的返回值是String类型的  */
			var num1 = +prompt("请输入第一个数:");
			var num2 = +prompt("请输入第二个数:");
			var nu
当然可以!以下是一个简单的示例代码,用于生成一个记账软件的前端界面,使用了HTML、CSS和JavaScript: ```html <!DOCTYPE html> <html> <head> <title>记账软件</title> <style> body { font-family: Arial, sans-serif; } h1 { text-align: center; } .form-group { margin-bottom: 10px; } .form-group label { display: block; font-weight: bold; } </style> </head> <body> <h1>记账软件</h1> <div id="app"> <div class="form-group"> <label for="date">日期:</label> <input type="text" id="date"> </div> <div class="form-group"> <label for="category">类别:</label> <input type="text" id="category"> </div> <div class="form-group"> <label for="amount">金额:</label> <input type="text" id="amount"> </div> <button onclick="addExpense()">添加支出</button> <table id="expenseTable"> <thead> <tr> <th>日期</th> <th>类别</th> <th>金额</th> </tr> </thead> <tbody id="expenseBody"> </tbody> </table> </div> <script> function addExpense() { var date = document.getElementById('date').value; var category = document.getElementById('category').value; var amount = document.getElementById('amount').value; var expenseTable = document.getElementById('expenseTable'); var expenseBody = document.getElementById('expenseBody'); var newRow = expenseBody.insertRow(); newRow.innerHTML = `<td>${date}</td><td>${category}</td><td>${amount}</td>`; document.getElementById('date').value = ''; document.getElementById('category').value = ''; document.getElementById('amount').value = ''; } </script> </body> </html> ``` 这段代码创建了一个基本的记账软件前端界面。它包含了输入表单和一个用于显示支出记录的表格。每当点击"添加支出"按钮时,会将输入的日期、类别和金额添加到表格中,并清空输入框。你可以根据自己的需求对界面进行修改和扩展。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值