欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JS實(shí)現(xiàn)消滅星星小游戲

 更新時(shí)間：2022年01月07日 08:50:03   作者：我莫得感情_  
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)消滅星星小游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了JS實(shí)現(xiàn)消滅星星小游戲的具體代碼，供大家參考，具體內(nèi)容如下

先看看效果圖：

先準(zhǔn)備css和一張星星圖片，很簡單，body背景設(shè)為黑色。

<style>
? ? ? ? body {
? ? ? ? ? ? background-color: black;
? ? ? ? }
</style>

就直接寫JS代碼了，解釋都寫在注釋里面了

<script>
? ? ? ? function start() {
? ? ? ? ? ? //設(shè)置一個(gè)定時(shí)器，重復(fù)執(zhí)行的秒數(shù)是500ms
? ? ? ? ? ? timer = setInterval(function() {
? ? ? ? ? ? ? ? //創(chuàng)建圖片元素
? ? ? ? ? ? ? ? var obj = document.createElement('img');
? ? ? ? ? ? ? ? //星星隨機(jī)寬度
? ? ? ? ? ? ? ? var w = Math.floor(Math.random() * 80 + 20);
? ? ? ? ? ? ? ? obj.width = w;
? ? ? ? ? ? ? ? //隨機(jī)出現(xiàn)的位置
? ? ? ? ? ? ? ? var x = Math.floor(Math.random() * 1400 + 60);
? ? ? ? ? ? ? ? var y = Math.floor(Math.random() * 460 + 60);
? ? ? ? ? ? ? ? obj.style.position = 'absolute';
? ? ? ? ? ? ? ? //將隨機(jī)生成的X,Y的值賦給對(duì)象
? ? ? ? ? ? ? ? obj.style.top = y + 'px';
? ? ? ? ? ? ? ? obj.style.left = x + 'px';
? ? ? ? ? ? ? ? //給圖片參數(shù)賦上地址
? ? ? ? ? ? ? ? obj.src = 'imgs/xingxing.gif';
? ? ? ? ? ? ? ? //添加到整個(gè)body頁面
? ? ? ? ? ? ? ? document.body.appendChild(obj);
? ? ? ? ? ? ? ? //創(chuàng)建點(diǎn)擊事件，想要消除自己，就是remove掉自己父親的兒子
? ? ? ? ? ? ? ? obj.addEventListener('click', function() {
? ? ? ? ? ? ? ? ? ? this.parentNode.removeChild(this);
? ? ? ? ? ? ? ? });
? ? ? ? ? ? }, 500);
? ? ? ? };
? ? ? ? start();
</script>

以上就是本文的全部內(nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論