JavaScript——练习案例一

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>

  • 3
    点赞
  • 23
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

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

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值