javascript - 悬停在 Div 上

Question

我是 JS 新手，需要帮助。我试图让以下 div 的内容在我将鼠标悬停在其上时显示，这是我的代码片段。

const currentTab = await Logic.currentTab();
const currentPage = document.getElementById("current-page");
currentPage.innerHTML = `<span class="page-title truncate-text">${currentTab.title}</span>`;
const favIconElement = Utils.createFavIconElement(currentTab.favIconUrl || "");
currentPage.prepend(favIconElement);

#current-tab img {
max-block-size: var(--icon-size);
}
#current-page{
  display: table-cell;
}
#current-tab .page-title {
  font-size: var(--font-size-heading);
  grid-column: 2 / 4;
}

<span><div id="current-page"></div></span>

Answer 1

使用 css，您应该完成隐藏/显示逻辑，我们只需填充 div

#current-page{
  display: none;
}
#current-page:hover{
  display: table-cell;
}