第十章习题-CSDN博客

本文链接：https://blog.csdn.net/2401_85393222/article/details/144012483

习题一

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>数字时钟</title>
		<style type="text/css">
			div{
				font-size: 150px;
				text-align: center;
			}
			.div{
				font-size: 90px;
				text-align: center;
			}
		</style>
	</head>
	<body>
		<div class="div">数字时钟</div>
		<div id="clock"></div>
		<script>
		        setInterval(function () {
		            var now = new Date();
					//得到时
		            var hours = now.getHours();
					//得到分
		            var minutes = now.getMinutes();
					//得到秒
		            var seconds = now.getSeconds();
					//三元运算符 :条件? 值1 : 值2
		            hours = hours < 10? "0"+hours:hours;
		            minutes = minutes < 10? "0"+minutes:minutes;
		            seconds = seconds < 10? "0"+seconds:seconds;
					//不断更新时间
		            document.getElementById("clock").innerHTML = hours + ":" + minutes + ":" + seconds;
		        }, 1000);
		    </script>
	</body>
</html>

习题二

PE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>禁止使用鼠标右键</title>
		<style type="text/css">
			img{
				width: 600px;
				height: 400px;
				margin-left: 300px;
			}
		</style>
	</head>
	<body>
			<img src="../js/cat.jpg" id="img"/>
			
		<script type="text/javascript">
			va img=document.getElementById("img");
			//右键对图片的监听事件,onLoad：页面加载完时触发右键监听事件
			window.onload=function(){
			img.addEventListener("contextmenu",function(e){
				e.preventDefault();
				alert("禁止下载图片！");
			});
			}
		</script>
	</body>
</html>