这里如何使用javascript选择单个元素？

请看这里：

我希望当用户移动鼠标时，智能手机和笔记本电脑能够靠近。我正在使用的代码：

HTML:

JS:

document.addEventListener（'mousemove'，视差）；
函数视差（e）{
e、 预防默认值（）；
this.querySelectorAll（'.layer middle'）.forEach（（layer）=>{
设speed=layer.getAttribute（'data-speed'）；
layer.style.transform=`translateX（${e.clientX*speed/1000}px）`；
})
} 

我试图对此进行修改，使.layer top向右移动，但中间层停止移动alltoghter，可能是因为SelectorAll或forEach。我真的不懂javascript，所以我不能简单地让函数为每个元素单独工作

---

谢谢你的帮助

我认为您可以删除

foreach

并分别选择每个元素，如下所示。这样你就可以把笔记本电脑移到右边，把手机移到左边，反之亦然。 我对你的代码做了一点修改。试试看，让我知道，如果它是什么，你正在寻找

<script> document.addEventListener('mousemove', parallax);

    function parallax(e) {
      e.preventDefault();
      laptop = document.querySelector('.layer-middle');
      let speed = laptop.getAttribute('data-speed');
      laptop.style.transform = `translateX(${e.clientX * speed / 1000}px)`;
      phone = document.querySelector('.layer-top');
      phone.style.transform = `translateX(${-1*e.clientX * speed / 1000}px)`;
    } 

</script>

document.addEventListener（'mousemove'，视差）；
函数视差（e）{
e、 预防默认值（）；
laptop=document.querySelector（“.layer middle”）；
设speed=laptop.getAttribute（'data-speed'）；
laptop.style.transform=`translateX（${e.clientX*speed/1000}px）`；
phone=document.querySelector（“.layer top”）；
phone.style.transform=`translateX（${-1*e.clientX*speed/1000}px）`；
} 

您是否在devtools控制台中收到任何错误？

<script> document.addEventListener('mousemove', parallax);

    function parallax(e) {
      e.preventDefault();
      laptop = document.querySelector('.layer-middle');
      let speed = laptop.getAttribute('data-speed');
      laptop.style.transform = `translateX(${e.clientX * speed / 1000}px)`;
      phone = document.querySelector('.layer-top');
      phone.style.transform = `translateX(${-1*e.clientX * speed / 1000}px)`;
    } 

</script>