prototype（原型对象）
所有的 JavaScript 对象都会从一个 prototype（原型对象）中继承属性和方法。
Math.floor() 函数总是返回小于等于一个给定数字的最大整数
Math.random() 静态方法返回一个大于等于 0 且小于 1 的伪随机浮点数，并在该范围内近似均匀分布，然后你可以缩放到所需的范围。其实现将选择随机数生成算法的初始种子；它不能由用户选择或重置。
clientHeight：元素的像素高度,包含元素的高度+内边距,不包含水平滚动条,边框和外边距
offsetHeight：元素内容的高度,包括溢出的不可见内容
offsetLeft：返回元素左上角相对于offsetParent的左边界的偏移像素值
overflow:hidden 溢出隐藏
Document.createElement() 方法用于创建一个由标签名称 tagName 指定的 HTML 元素。如果用户代理无法识别 tagName，则会生成一个未知 HTML 元素 。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body style="background:#000;">
<div id="stars">
</div>
<script>
//获取id为star_box的元素
var stars = document.getElementById("stars")
//创建一个对象
var Obj = function () {}
//增加原型对象的方法
Obj.prototype.drawStar = function () {
//创建星星标签
var ob = document.createElement("div")
// 给星星标签加样式
ob.style.width = "7px"
ob.style.height = "7px"
//设置相对定位
ob.style.position = "relative"
//div的left值不能超出屏幕的宽度
ob.style.left = Math.floor(document.body.clientWidth * Math.random()) + 'px';
//div的left值不能超出屏幕的高度
ob.style.top = Math.floor(document.body.clientHeight * Math.random()) + 'px';
//ob元素溢出隐藏
ob.style.overflow = "hidden"
// 把div加到stars
stars.appendChild(ob)
// 追加一个img标签
var star = document.createElement("img")
star.style.width = "49px"
star.style.height = "7px"
star.src = "../images/star.png"
//将star元素设置成绝对定位
star.style.position = "absolute"
star.style.top = "0px"
ob.appendChild(star)
// 追加闪烁方法
Play(star)
}
function Play(ele) {
// 定义闪烁方法
var i = Math.floor(Math.random() * 7)//为了使星星不同时闪烁，设置随机值
var timer = setInterval(function () {//为了使星星不同时闪烁，设置随机值
if (i < 7) {
console.log(-i * 7 + "px");
ele.style.left = -i * 7 + "px"
i++
} else {
i = 0
}
}, 100)
}
// 使用循环创建30个不同对象
for (var i = 0; i <= 30; i++) {
var obj = new Obj()
obj.drawStar()
}
</script>
</body>
</html>
