js程序题

发布时间：2024年01月12日

1.自定义一个函数，根据不同年份，输出2月份天数。写出调用语句，向页面输出效果如图2所示。

在这里插入图片描述
在这里插入图片描述

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script>
			function x(year){
				if(year%4===0&&year%100!==0||year%400===0){
					return true;
				}else{
					return false;
				}
			}
			function y(){
				years=+prompt('请输入年');
				if(x(years)===true){
					alert(`${years}年2月是29天`);
				}else{
					alert(`${years}年2月是28天`);
				}
			}
			y();
		</script>
	</body>
</html>

2.刷新页面，向页面输出一个随机IP地址，一个合法的IP地址范围是“0.0.0.0”到“255.255.255.255”。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script>
			function getRandom(N,M){
				return Math.floor(Math.random()*(M-N+1)+N)
			}
			function getIp(){
				document.write(`${getRandom(0,255)}.${getRandom(0,255)}.${getRandom(0,255)}.${getRandom(0,255)}`)
			}
			getIp()
		</script>
	</body>
</html>

3.改变文字大小。请在网页文件上补充JavaScript代码，不允许更改html和css代码。页面效果如下图所示。 （1）单击按钮“A-”，当文字大于12px递减文字大小。 （2）单击按钮“A+”，当文字小于32培训时递增文字大小。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<input type="button" id="btn1" value="A-"/>
		<input type="button" id="btn2" value="A+"/>
		<p id="p1">"剩宴"不是中国传统，节约才是中华美德。</p>
	</body>
</html>

在这里插入图片描述

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<input type="button" id="btn1" value="A-"/>
		<input type="button" id="btn2" value="A+"/>
		<p id="p1">"剩宴"不是中国传统，节约才是中华美德。</p>
		<script>
			var b1=document.querySelector('#btn1');
			var b2=document.querySelector('#btn2');
			b1.onclick=function(){
				var p1=document.querySelector('#p1');
				var Size = parseInt(window.getComputedStyle(p1).fontSize);
				if(Size > 12){
				    p1.style.fontSize = (Size - 1) + "px";
				}
			}
			b2.onclick=function(){
				var p1=document.querySelector('#p1');
				var Size = parseInt(window.getComputedStyle(p1).fontSize);
				if(Size < 32){
				    p1.style.fontSize = (Size + 1) + "px";
				}
			}
		</script>
	</body>
</html>

4.（1)单击“点名”按钮，按钮的文本设置为“停止”，不停的随机改变一个名字的背景色为红色，其余名字的背景为初始值。 （2）单击“停止”按钮，按钮的文本设置为“点名”，随机改变一个名字的背景色为红色，其余名字的背景色为初始值。

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .box {
            width: 1000px;
            height: 150px;
            margin: 0 auto;

            clear: both;
        }
        #btn {
            width: 100px;
            height: 30px;
            margin-left: 700px;
            margin-top: 20px;

        }
        .name {
            width: 100px;
            height: 30px;
            float: left;
            background-color: antiquewhite;
            margin-left: 10px;
            margin-top: 10px;
            text-align: center;
            line-height: 30px;
        }
        #span {
            float: right;
            position: relative;
            top: 55px;
            right: 185px;
        }
        h1 {
            text-align: center;
        }
    </style>
</head>

<body>
    <h1>随机点名系统</h1>
	
    <div class="box" id="box"></div>
    <input type="button" id="btn" value="点名" />
    <script type="text/javascript">
        var arrs = ["姓名1", "姓名2", "姓名3", "姓名4", "姓名5", "姓名6", "姓名7", "姓名8", "姓名9", "姓名10", "姓名11", "姓名12", "姓名13", "姓名14", "姓名15", "姓名16", "姓名17", "姓名18", "姓名19", "姓名20", "姓名21", "姓名22", "姓名23", "姓名24", "姓名25", "姓名26", "姓名27", "姓名28", "姓名29", "姓名30", "姓名31", "姓名32", "姓名33", "姓名34", "姓名35", "姓名36"];
        var boxNode = document.getElementById("box");
        for (var i = 0; i < arrs.length; i++) {
            var divNode = document.createElement("div");
            divNode.innerHTML = arrs[i];
            divNode.className = "name";
            boxNode.appendChild(divNode);
        }
		var btn=document.querySelector('#btn');
		btn.onclick = function () {
		    if(this.value==="点名"){
		        timeId=setInterval(function () {
		            for (var j = 0; j < arrs.length; j++) {
		                boxNode.children[j].style.background="";
		            }
		            var random = parseInt(Math.random()*arrs.length);
		            boxNode.children[random].style.background="red";
		        },100);
		        this.value="停止";
		    }else{
		        clearInterval(timeId);
		        this.value="点名";
		    }
		}
    </script>
</body>

</html>
文章来源:https://blog.csdn.net/weixin_65734716/article/details/135420190
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
最新文章