jQuery第二章課後作業

suixinCaesar發表於2018-07-12
jQuery

3.模擬計算機病毒效果，當開啟一個頁面時，會不停的彈出視窗。

<!DOCTYPE html>
<html>
<head lang="en">
	<meta charset="UTF-8">
<title>病毒頁面效果</title>
<style type="text/css">
	body{margin: 0;}
</style>
	<script>
		function go() {
            var sum = 0;
            var name = "";
			var Xpx = 0;
            var Ypx = 0;
            for (var i = 0; i < 10000; i++) {
                sum = Math.floor(Math.random() * 1000);
                name = "newWindows" + sum;
                Xpx = Math.floor(Math.random() * 1000);
                Ypx = Math.floor(Math.random() * 1000);
                window.open("virus.html", name, "height=250,width=250,resizable=no,left="+Xpx+",top="+Ypx);

            }
        }
	</script>
</head>
<body onload="go();">
<img src="images/webPic.jpg" alt="首頁圖片" />
<div id="div"></div>
</body>
</html>





 <!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
<title>病毒頁面</title>
    <style type="text/css">
        body{margin: 0;}
    </style>
</head>

<body>
<img src="images/viruse.jpg" alt="病毒頁面" />
</body>
</html>


4.根據Date()物件獲取當前的日期和時間，根據不同時間顯示不同的問候語。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>根據當前時間顯示問候語</title>
</head>
<body>
    <p><span>今天日期：</span><span id="span1"></span></p>
    <p><span>現在時間：</span><span id="span2"></span></p>
    <p id="p1"></p>
    <script>
        function getTime() {
            var day= new Date();
            var year = day.getFullYear();//年
            var month = day.getMonth()+1;//月
            var date = day.getDate(); //日
            var hour = day.getHours();//時
            var minutes = day.getMinutes(); //分
            var mill = day.getSeconds();//秒
            var hello = ""; //問候語
            if (hour<=12){
                hello = "上午好！歡迎來到貴美";
            }else{
                hello = "下午好！歡迎來到貴美";
            }
            document.getElementById("span1").innerHTML=year+"年"+month+"月"+date+"日";
            document.getElementById("span2").innerHTML=hour+"點"+minutes+"分"+mill+"秒";
            document.getElementById("p1").innerHTML=hello;
        }
        getTime()
        setInterval("getTime()",1000)
    </script>
</body>
</html>


5.模擬隨機發放水果功能，水果品種固定，每次發放一種。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>隨機發放水果</title>
    <script>
        function changeFruits() {
           var arr =  new Array("蘋果","香蕉","西瓜","荔枝","橘子","番茄","葡萄","楊梅","香瓜","紅薯" );
           var index = Math.floor(Math.random()*10);
           document.getElementById("span1").innerHTML=arr[index];
        }
    </script>
</head>
<body>
    <input type="button" value="點選隨機發放水果" onclick="changeFruits()">
    <span>您得到是水果是：</span>
    <span id="span1">黃瓜</span>
</body>
</html>

相關文章