快速的JavaScript悬停问题

Quick javascript hover question

本文关键字：悬停 问题 JavaScript      更新时间：2023-09-26

我有一个快速的JavaScript问题。我想知道是否有办法制作一个名为 #post li span 的div，当您将鼠标悬停在div"#post li"上时出现（出现）？如果有人能给我一个代码，那就意义重大了。

你可以直接用CSS来做到这一点：

#post li span {
    display: none;
}
#post li:hover span {
    display: inline;
}

如果你想使用 JavaScript 并拥有 jQuery，你可以使用：

$('#post li span').hide();
$('#post li').hover(
    function() { $('span', $(this)).show(); },
    function() { $('span', $(this)).hide(); }
);

如果你想使用JavaScript并且没有jQuery，事情就会变得更加复杂。

在较旧的IE中，您将无法访问无锚标记上的：hover伪类。 所以你可以像这样使用JavaScript：

$('#post li').hover(function() {
    $(this).find('span').show();
  },
  function() {
    $(this).find('span').hide();
  }
);

查看 jQuery 悬停以获取有关其工作原理的更多信息

你可以使用 CSS。
将display: none应用于#post li span，然后添加display:block以进行#post li:hover span

相关文章：