JavaScript——练习案例一

最新推荐文章于 2024-10-06 12:31:10 发布

简单点*⸜( •ᴗ• )⸝*

最新推荐文章于 2024-10-06 12:31:10 发布

阅读量2.8k

点赞数 3

分类专栏： JavaScript基础学习文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/m0_52348906/article/details/121305568

版权

JavaScript基础学习专栏收录该内容

4 篇文章 0 订阅

订阅专栏

1.输出三角形

考验：for循环 if语句的应用

   需求说明:
           在页面提示用户输入一个整数，当用户输入的值大于5时，例如输入 6，在页面输入倒三角形;
           当用户输入的值小于或等于5时，例如输入4，在在页面输出2个三角形，一个倒三角形，一个正三角形.

代码如下：

<script type="text/javascript">
			var t = prompt("请输入一个整数");
			if(t>5){
				for(var i=t;i>0;i--){
					for(var j=0;j<i;j++){
						document.write(" *&nbsp;&nbsp;");
					}
					document.write("<br />");
				}
			}
			else{
				for(var k=t;k>0;k--){
					for(var m=0;m<k;m++){
						document.write(" *&nbsp;&nbsp;");
					}
					document.write("<br />");
				}
				for(var n=1;n<=t;n++){
					for(var h=0;h<n;h++){
						document.write(" *&nbsp;&nbsp;");
					}
					document.write("<br />");
				}
			}
		</script>

2.制作随机数定时器

需求说明:

当点击开始按钮时，文本框刷新随机数，当点击停止按钮，停止显示随机数，点击开始又会运行

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>随机数定时器</title>
	</head>
	<body>
		<input type="text" id="shu"/>
		<button id="K" onclick="start()">开始</button>
		<button id="T" onclick="stop()">停止</button>
		<script type="text/javascript">
			var mynum;
			mynum = setInterval("start()",1000);
			var one = document.getElementById("K");
			var two = document.getElementById("T");
			function start(){
				var num=Math.floor(Math.random()*60+1);
				document.getElementById("shu").value=num;
			}
			function stop(){
				clearInterval(mynum);
			}
		</script>
	</body>
</html>

3.制作随机选号器

要求：单机“开始”按钮在页面随机显示1~60的学号，单机“停止”按钮在页面显示选中学号。如下图：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>随机选号器</title>
		<style type="text/css">
			.inputTxt{height: 500px;width: 600px;font-size: 360px;text-align: center;}
		</style>
		<script type="text/javascript">
			var timer;
			function startScoroll(){
				var num = Math.floor(Math.random()*60+1); //产生1~60随机数
				document.myForm.myText.value = num; //文本框赋值
				timer= setTimeout("startScroll()",60); //使用定时器函数，60毫秒调用函数
			}
			function stopScoroll(){
				clearTimeout(timer); //清除定时器
			}
			
		</script>
	</head>
	<body>
	<center>
		<form name="myForm">
		<input name="myText" type="text" value="0" class="inputTxt">
		<input name="start" type="button" value="开始" onclick="startScoroll()">
		<input name="stop" type="button" value="停止" onclick="stopScoroll()">
		
		</form>
	</center>
	</body>
</html>