8、Js DOM节点，星星案列

-木化十จุ๊บ

于 2019-12-19 16:57:59 发布

阅读量206

点赞数

分类专栏： Js

本文链接：https://blog.csdn.net/AuhuAo/article/details/103605569

版权

本文通过JavaScript介绍了一个星星闪烁的游戏实现，包括随机位置、大小的星星出现，点击星星消失，开始和暂停游戏功能，以及游戏时间和进度条的展示。通过DOM操作实现节点的创建、删除和事件绑定。

摘要由CSDN通过智能技术生成

DOM节点：描述网页各个组成之间的关系

var.obj=document.getElementById("id名")；

火狐浏览器中的空白也算一个节点

ParentNode：父节点
childNode：子节点
firstChild：第一个子节点
lastNode：最后一个子节点
nextSibling：下一个姐妹或（兄弟）节点【注：必须是同父级关系】
previousSibling：前一个兄弟节点【注：必须是同父级关系】

案列：

星星案列

1、随机位置随即大小出现星星

<script type="text/javascript">
window.onload=init();
function init(){
	window.setInterval("start()",1000);
	}
function start(){
	//创建星星
	var obj=document.createElement("img");
	//给星星添加src属性
	obj.src="xingxing.gif";
	//随机星星大小
	var w=Math.floor(Math.random()*80+20);
	obj.width=w;
	//随机位置
	var x=Math.floor(Math.random()*1166+100);
	var y=Math.floor(Math.random()*500+100);
	obj.style.position="absolute";
	obj.style.top=y+"px";