Javascript 如何将鼠标跟踪效果添加到特定的wordpress行？

我正在尝试向我的wordpress网站添加一个鼠标跟踪效果。我做到了，但我不知道如何将效果添加到特定行

一个简短的介绍，我知道一些关于CSS语言的知识，但是对HTML和JS有一点了解或者一无所知。这就是我所做的：

创建鼠标跟踪效果后，我尝试使用CSS将其添加到特定行（添加到类

ball

static和absolute positions），但没有效果。因此，我创建了一个新的

行ID

（#容器）， 假设将类

ball

应用于新的行ID，但我不知道如何做

HTML:

<h1>Giovanni</h1>`
    <div class="ball">
</div>

<script type="text/javascript">

  document.addEventListener("mousemove",function (event) {
      const mouseX = event.pageX
      const mouseY = event.pageY

      const ball = document.querySelector("div.ball")

      ball.style.left = mouseX + "px"
      ball.style.top = mouseY + "px"
  })
</script>

乔瓦尼` JS:

<h1>Giovanni</h1>`
    <div class="ball">
</div>

<script type="text/javascript">

  document.addEventListener("mousemove",function (event) {
      const mouseX = event.pageX
      const mouseY = event.pageY

      const ball = document.querySelector("div.ball")

      ball.style.left = mouseX + "px"
      ball.style.top = mouseY + "px"
  })
</script>

document.addEventListener（“mousemove”，函数（事件）{
const mouseX=event.pageX
const mouseY=event.pageY
const ball=document.querySelector（“div.ball”）
ball.style.left=mouseX+“px”
ball.style.top=mouseY+“px”
})

---

鼠标跟踪效果正常，但可以在整个页面上运行。

它可以在整个页面上运行，因为您正在使用

文档将其绑定到整个文档。

您需要在dom中定位正确的元素，在本例中使用：

document.getElementByClassName（“ball”）因为您的目标是特定的类名，如果您想使用一个ID，您可以使用
document.getElementById（“ball”）

其中
document.
返回整个页面，这两个函数返回整个文档中具有特定类或id的元素

<h1>Giovanni</h1>`
<div class="ball"></div>
<script type="text/javascript">

var el = document.getElementByClassName("ball"); //select the div with ball class
el.addEventListener("mousemove",function (event) {
const mouseX = event.pageX
const mouseY = event.pageY

const ball = document.querySelector("div.ball")

ball.style.left = mouseX + "px"
ball.style.top = mouseY + "px"
})

</script>

乔瓦尼`
var el=document.getElementByClassName（“ball”）//选择带球的div类
el.addEventListener（“mousemove”，函数（事件）{
const mouseX=event.pageX
const mouseY=event.pageY
const ball=document.querySelector（“div.ball”）
ball.style.left=mouseX+“px”
ball.style.top=mouseY+“px”
})