javascript - 为什么我无法使用 jquery content() 来查找我的 dom？

Question

我想给我的表格自定义工具提示。所以我给每个td一个名为trigger1的类。每个td都有一个默认隐藏的自定义工具提示内容。现在我添加 mouseover 和 mouseout 事件，但我发现它不起作用。当我删除 contents() 时，它工作得很好。有人能告诉我原因吗？我什么时候应该使用 contents( )？

 $(function(){
 $(".trigger1").each(function () { 
        $(this).on('mouseover', function () { 
  //not work: $(this).contents().find(".tooltipcontent").show();            
  $(this).find(".tooltipcontent").show(); 
        });
        $(this).on('mouseout', function () {
             /*not work: $(this).contents().find(".tooltipcontent").hide(); */
            $(this).find(".tooltipcontent").hide(); 
        });
    }); 
});

而每个td内容是这样的:

  <td align="center" class="trigger1">
   <a target="_blank" href="#">1234511</a> 
   <div class="tooltipcontent" style="display: none;">
      some content
      <a  target="_blank" href="#">more</a>
   </div>
</td>

Answer 1

根据jQuery .contents() documentation ， .contents() 和 .children() 之间的区别在于 .contents() 还返回文本和注释元素，其中大量大多数 jQuery 方法不支持。

你几乎肯定会因为使用它而感到困惑。将 .contents() 实例替换为 .children() 将以您想要的方式工作，如下所示:

$(this).children('.tooltipcontent').hide();