Javascript 在html页面上呈现时移动数组项

有没有办法移动存储在数组中的html元素

每次调用函数时，我的代码都会生成一个新的div，该div添加了一个动画类，以使其在屏幕上显示。然后我需要将它的X位置随机移动若干像素

for (i = 0; i < 1; i++) {
   setInterval(function newRock(item){
     let num = Math.floor(Math.random() * 1000);
     let num2 = Math.floor(Math.random() * 1500);
     const rocks = document.querySelector(".rocks");
     const rock = document.createElement("DIV");
     rocks.appendChild(rock)
     rock.classList.add("rock0");
     rock.classList.add("animate");
     rock.style.left = `${num}px`;
     rock.style.top = `${num2}px`;
     rockArray.push(rock.className);
   classNumber++;
 },10000);
}


setInterval(() => {
 console.log(rockArray)}, 10000)
});

rockArray.forEach((item) => {
 item.style.left = `${num}px`;
});

setInterval(function() {
 let num = Math.floor(Math.random() * 1000);
 let num2 = Math.floor(Math.random() * 1000);

 document.querySelector(".rock0").style.left =  `${num}px`;
 document.querySelector(".rock1").style.left =  `${num2}px`;
}, 3000);

（i=0；i<1；i++）的

{
设置间隔（功能纽洛克（项目）{
设num=Math.floor（Math.random（）*1000）；
设num2=Math.floor（Math.random（）*1500）；
const rocks=document.querySelector（“.rocks”）；
const rock=document.createElement（“DIV”）；
岩石。儿童（岩石）
rock.classList.add（“rock0”）；
rock.classList.add（“动画”）；
rock.style.left=`${num}px`；
rock.style.top=`num2}px`；
rockArray.push（rock.className）；
classNumber++；
},10000);
}
设置间隔（（）=>{
console.log（rockArray）}，10000）
});
rockArray.forEach（（项目）=>{
item.style.left=`${num}px`；
});
setInterval（函数（）{
设num=Math.floor（Math.random（）*1000）；
设num2=Math.floor（Math.random（）*1000）；
document.querySelector（“.rock0”）.style.left=`${num}px`；
document.querySelector（“.rock1”）.style.left=`${num2}px`；
}, 3000);

只要position属性不是静态的、相对的或绝对的-left或right css属性将不起作用。

要使

left

和

right

属性起作用，html元素必须是定位元素。定位元素包括将

位置

设置为以下任意值的元素：

固定

、

绝对

、

相对

或

粘性

• 当

  位置

  设置为

  绝对

  或

  固定

  时，

  左

  （

  右

  ）属性 指定图元的左（右）边与左（右）边之间的距离 其包含块的边缘。（包含的块是祖先 元素相对定位的位置。）
• 当

  position

  设置为

  relative

  时，

  left

  （

  right

  ）属性指定 将图元的左（右）边移动到其左（左）边的距离 正常位置
• 当

  position

  设置为

  sticky

  时，将使用

  left

  （

  right

  ）属性 计算粘性约束矩形
• 当

  位置

  设置为

  静态

  时，

  左

  （

  右

  ）属性没有 效果

见以下条款：

更新：

话虽如此，下面代码中的

num

似乎没有定义

rockArray.forEach((item) => {
 item.style.left = `${num}px`;
});

---

${num}px

中

num

的来源是什么？它似乎未定义。

请显示完整代码。.style.left还取决于对象的位置是相对的还是绝对的，修正了等等。CSS可能会很棘手。A在这里会非常有用。div还需要有

位置：absolute

CSS属性。因此，当创建div时，位置设置为absolute，位置left是随机设置的，我只需要再次更改位置，但是对于数组中的每个新div。我理解，但是，我的代码在这里工作

rock.style.left=

${num}px

然后我想再次更改rockArray.forEach（（item）=>{item.style.left=

${num}px

；}）；因此num是全局定义的

let num=Math.floor（Math.random（）*1000）我还尝试在函数内部定义它。当代码运行时，我也没有收到任何错误…你介意在codepen上复制它，然后在这里附加链接吗？
rockArray.forEach((item) => {
 item.style.left = `${num}px`;
});