HTML 在悬停时更改 <h1> 文本答案

【问题标题】：HTML change <h1> text on hoverHTML 在悬停时更改 <h1> 文本
【发布时间】：2022-10-30 04:38:01
【问题描述】：

嗨，所以我正在制作一个投资组合，因为我的互联网名称是 unofficialdxnny，所以当观众将鼠标悬停在名称 unofficialdxnny 上时，我想在网站上这样做，<h1> 更改为不同的文本。文本将是我的真实姓名。

这可能吗？

【问题讨论】：

这回答了你的问题了吗？ Change text on hover, then return to the previous text
@AndrewMorton 有点。但是它不会使原始标题消失，它会在unofficialdxnny <img src="imgur.com/s7hNlae.png"> 之前声明名称
请澄清您的具体问题或提供其他详细信息以准确突出您的需求。正如它目前所写的那样，很难准确地说出你在问什么。

【解决方案1】：

//your text element
let text = document.getElementById("text");
//checks for hover
text.addEventListener("mouseenter", function( event ) {
   //sets text
   text.innerHTML = "test2";

     setTimeout(function() {
    //sets text after some time
    text.innerHTML = "test1";
  }, 500);
}, false);

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>hover text</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
  </head>
  <body>
    <h1 id="text">test1</h1>
    <script src="script.js"></script>
  </body>
</html>

希望这有效

【讨论】：

欢迎来到 StackOverflow。好的答案包括对解决问题所做的一些解释——不仅仅是工作代码。
您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息，例如引用或文档，以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center。