正确的 jquery 选择器是什么

Question

我有一个 div 这样的：

<div id="content">
    <div id="link1">
        <a href="#"><img src="pic1.png"></a>
    </div>
    <div id="link2">
        <a href="#"><img src="pic2.png"></a>
    </div>
</div>

a 标签被隐藏，所以我想通过悬停 link1 或 link2 来显示它我已经做到了这一点，但它不起作用

$("#content a").hide();
$("#content div").hover(function(){
    var id = (this.id);
    $('#' + id + 'a').show();
});

Answer 1

您需要更新

 $('#' + id + 'a').show();

至

 $('#' + id + ' a').show();

Answer 2

您的选择器需要在 id 和 a 之间有一个 space 以便清楚地表明您正在尝试定位后代元素。

$("#content div").hover(function(){
    var id = this.id;
    $('#' + id + ' a').show();
});

也就是说，您已经有了对 this 的引用，因此在字符串中构建选择器是多余的，请使用 find():

$("#content div").hover(function(){
    $(this).find('a').show();
});

正确的 jquery 选择器是什么

what is the correct jquery selector for this

jquery

jquery-selectors