javascript - 如何使用外部 JavaScript 在鼠标悬停时显示 div/元素？

Question

我的 div 是嵌套的，所以我知道如果元素已经隐藏，我就无法显示它。我希望信息(p1 在我的 html 代码中)在鼠标悬停在另一个元素(h1 在我的 html 中)上时显示。我已经将我的段落 1 样式设置为 none在JavaScript中，现在我需要它重新出现，我尝试了以下代码来尝试使其重新出现 document.getElementById("1").onmouseover.style.display = "block";但没有成功。

This is My HTML code, ignore the order im new to web dev lol

This is the code i have tried but it doesnt seem to work

This is the end result i want, the circled text on hover display the paragraph

Answer 1

有几件事。对于初学者，将实际代码而不是屏幕截图放入您的问题中。如果我们无法重现您的问题，通常很难仅通过图片进行故障排除。

接下来，您可能会进一步熟悉语法，因为 p1 不是有效的 HTML 元素。

然后，尽量不要过多依赖 JavaScript，并将演示内容保留在合成器线程上。这是一个无需 JavaScript 即可实现目标的示例。希望对您有帮助，干杯!

p {
  display: none;
}

h1:hover + p {
  display: block;
}

<h1>Hover me</h1>

<p>PEEK A BOO!</p>