Javascript 元素在悬停状态下相互切换

我试图在.content元素悬停后使开关可见，并使标题消失

正如元素ID所建议的那样，switch元素应该替换悬停时的标题。我用Javascript解决了这个问题，但onmouseover和onmouseout函数无法使用。内容、标题和切换在悬停状态下突然改变

document.getElementById'caption'.onmouseover=function{ 显示开关 }; document.getElementById'switch'.onmouseout=function{ 隐藏开关 }; 功能显示开关{ document.getElementById'caption'.style.display=none； document.getElementById'switch'.style.display=inline块； } 功能隐藏开关{ document.getElementById'switch'.style.display=none； document.getElementById'caption'.style.display=block； } 身体{ 利润率：50像素； } .内容{ 高度：500px； 宽度：100%； 边框：3倍纯黑； } 标题{ 字号：3em； } 开关{ /*元素是预先隐藏的*/ 显示：无； } 乱数假文 Lorem ipsum dolor sit amet，是一位杰出的献身者。不允许有自由和通廊。在accumsan和est dapibus viverra

根据您的要求“在.content元素悬停后使开关可见并使标题消失”，在content元素中添加了新的id框。并将onmouseover和onmouseout事件绑定到box元素

请验证输出，是按照您的要求还是我做了一些不同的事情

document.getElementById'box'.onmouseover=function{ 显示开关 }; document.getElementById'box'.onmouseout=function{ 隐藏开关 }; 功能显示开关{ document.getElementById'caption'.style.display=none； document.getElementById'switch'.style.display=inline块； } 功能隐藏开关{ document.getElementById'switch'.style.display=none； document.getElementById'caption'.style.display=block； } 身体{ 利润率：50像素； } .内容{ 高度：500px； 宽度：100%； 边框：3倍纯黑； } 标题{ 字号：3em； } 开关{ /*元素是预先隐藏的*/ 显示：无； } 乱数假文 Lorem ipsum dolor sit amet，是一位杰出的献身者。不允许有自由和通廊。在accumsan和est dapibus viverra

---

你的问题是什么？看起来您已经实现了所描述的预期行为。我的问题是如何使其在框悬停时显示Lores Ipsum文本，而不是标题。而且，它现在的行为也不是一帆风顺的。文本也在突然和随机地切换。