Javascript 渐进式创建数组js
因此，我正在制作一个游戏，其中一艘宇宙飞船移动，它必须避免火球图像才能获胜。我的问题是，我只有一个火球，相反，我希望有许多火球，随着时间的推移，它们会被倍增。我想我应该合并一个数组并使用push（）方法，但我试过了，就是做不到。如果有人能帮助我，我将不胜感激。谢谢Javascript 渐进式创建数组js,javascript,html,css,arrays,Javascript,Html,Css,Arrays,因此，我正在制作一个游戏，其中一艘宇宙飞船移动，它必须避免火球图像才能获胜。我的问题是，我只有一个火球，相反，我希望有许多火球，随着时间的推移，它们会被倍增。我想我应该合并一个数组并使用push（）方法，但我试过了，就是做不到。如果有人能帮助我，我将不胜感激。谢谢 //Fireball script function fireballScript(offset) { return Math.floor(Math.random() * (window.innerWidth - offset))}
//Fireball script
function fireballScript(offset) {
return Math.floor(Math.random() * (window.innerWidth - offset))}
let fireballMovement = {x: fireballScript(fireball.offsetWidth), y: 0}
const fireLoop = function() {
fireballMovement.y += 1
fireball.style.top = fireballMovement.y + 'px'
if (fireballMovement.y > window.innerHeight) {
fireballMovement.x = fireballScript(fireball.offsetWidth)
fireball.style.left = fireballMovement.x + 'px'
fireballMovement.y = 0
fireball.setAttribute('hit', false)}}
fireball.style.left = fireballMovement.x + 'px'
let fireballSpeed = setInterval(fireLoop, 1000 / 250)
let fireball = document.querySelector("#fireball")
<img src="Photo/fireball.png" id="fireball">
//火球脚本
函数fireballScript（偏移量）{
返回Math.floor（Math.random（）*（window.innerWidth-offset））}
让fireballMovement={x:fireballScript（fireball.offsetWidth），y:0}
常量fireLoop=函数（）{
火球移动。y+=1
fireball.style.top=火球移动.y+'px'
如果（fireballMovement.y>window.innerHeight）{
fireballMovement.x=fireballScript（fireball.offsetWidth）
fireball.style.left=火球移动.x+'px'
火球运动。y=0
fireball.setAttribute（'hit'，false）}
fireball.style.left=火球移动.x+'px'
让fireballSpeed=设定间隔（fireLoop，1000/250）
让fireball=document.querySelector（“#fireball”）
也请考虑这个脚本：
//Stop game on collision
function checkCollision() {
if (detectOverlap(spaceship, fireball) && fireball.getAttribute('hit') == 'false') {
hits++
fireball.setAttribute('hit', true)
alert("lost")}
setTimeout(checkCollision, 1)}
var detectOverlap = (function() {
function getPositions(spaceship) {
var pos = spaceship.getBoundingClientRect()
return [[pos.left, pos.right], [pos.top, pos.bottom]]}
function comparePositions(p1, p2) {
let r1 = p1[0] < p2[0] ? p1 : p2
let r2 = p1[0] < p2[0] ? p2 : p1
return r1[1] > r2[0] || r1[0] === r2[0]}
return function(a, b) {
var pos1 = getPositions(a), pos2 = getPositions(b)
return comparePositions(pos1[0], pos2[0]) && comparePositions(pos1[1], pos2[1])}})()
let spaceship = document.querySelector("#icon")
<img src="Photo/Spaceship1.png" id="icon">
//碰撞时停止游戏
函数checkCollision（）{
if（探测飞船，火球）&&fireball.getAttribute（'hit'）='false'）{
击中++
fireball.setAttribute（'hit'，true）
警报（“丢失”）}
setTimeout（检查冲突，1）}
var detectOverlap=（函数（）{
功能位置（宇宙飞船）{
var pos=spaceship.getBoundingClientRect（）
返回[[pos.left，pos.right]，[pos.top，pos.bottom]]
功能比较位置（p1、p2）{
设r1=p1[0]r2[0]| | r1[0]==r2[0]}
返回函数（a，b）{
var pos1=getPositions（a），pos2=getPositions（b）
返回comparePositions（pos1[0]，pos2[0]）&&comparePositions（pos1[1]，pos2[1]）}）（）
让spaceship=document.querySelector（“图标”）
function addFireball() {
var newFireball = document.createElement('div')
newFireball.className = 'fireball' // Set whatever props you want
document.body.appendChild(newFireball)
}
这不是一个完整的答案-我们需要关于您的项目的更多信息。但希望这至少能让你重振旗鼓 您需要在页面中添加更多火球
function addFireball() {
var newFireball = document.createElement('div')
newFireball.className = 'fireball' // Set whatever props you want
document.body.appendChild(newFireball)
}