Javascript 添加带鼠标盖的EventListener以隐藏段落

我试图理解addEventListener，并在有人悬停在按钮上时使用鼠标悬停功能隐藏段落。我没有在chrome开发者中得到任何错误，所以我不确定我遗漏了什么。我错过了什么

document.addEventListener（“mouseover”，myFunction）；
文档。添加了文本列表器（“鼠标悬停”，Mythird函数）；
函数myFunction（）{
document.getElementById（“sun”）.style.visibility=“hidden”；
}
函数myThirdFunction（）{
document.getElementById（“sun”）.style.visibility=“可见”；
}

这段文字将被太阳的热量灼烧
 

不要在页面中重复document.getElementById太多。对于小型应用程序来说，这是可以的——用于练习和学习。来自DOM的引用/拾取太多会降低性能

如前所述，尝试给出有意义的函数名

有多个鼠标事件侦听器。为了达到您的期望，我们需要同时使用mouseleave和mouseover

var buttonElement=document.getElementById（“工具提示btn”）；
var段落=document.getElementById（“sun”）；
函数myFunction（）{
段落.style.visibility=“隐藏”；
}
函数myThirdFunction（）{
段落.style.visibility=“可见”；
}
ButtoneElement.addEventListener（“鼠标悬停”，myFunction）；
ButtoneElement.addEventListener（“mouseleave”，myThirdFunction）

这段文字将被太阳的热量灼烧
 
这是一个非常简单的问题，在您刚开始的时候，我希望这对您有所帮助

就我个人而言，我会停止使用W3School，开始使用MDN。这是一个良好的开端

至于你的问题，有点不对劲。下面是许多常见场景的基本结构


函数paraHide（e）{
var d=document.getElementById（“sun”）；
d、 style.visibility=“隐藏”；
}
功能（e）{
var d=document.getElementById（“sun”）；
d、 style.visibility=“可见”；
}
/*
onload意味着等待HTML加载完毕，然后
自动启动以下JavaScript
*/
window.onload=函数（）{
//使用类“rollOverMe”获取所有元素
var d=document.querySelectorAll（“.rollOverMe”）；
//如果找到任何元素，请继续
如果（d）{
变量i，最大值=d.长度；
//对于找到的每个元素，添加以下内容
//事件指示器
对于（i=0；i1.您需要将侦听器添加到按钮，而不是文档。2.您需要将脚本移动到按钮下方，最好在
之前。此外，请尝试帮助我们（以及您未来的自己）通过使用有意义的函数名。通过使用一个名称来调用函数，该名称提供了有关该函数的用途的线索。@ChrisG好的，老实说，我正在使用w3School网站来学习这些内容。（。在这一点上，它看起来像是给按钮一个id，然后执行buttonID.getelementByid（“buttonID”）。style.Visibility=“hidden”；或者我完全错了。你把东西弄混了：
getElementById
是
document
对象提供的一个函数；它返回具有声明id的元素。因此你要使用
var theButton=document.getElementId（'roll_button'）；
，一旦你有了按钮，你就向它添加侦听器：
theButton.addEventListener（…）
或者您执行他们在w3schools上所做的操作并链接函数调用：
document.getElementId（'roll_button'）.addEventListener（…）；
（顺便说一句，w3schools有它的问题，我建议不要使用它）