jquery - 使用 jQuery 隐藏内部 div

Question

    <a href="#"> Link1  </a>  
    <div id="parent">
         <div id="child1">
                    Here is the Child One
         </div>
         <div id="child2">
                    Here is the Child Two
         </div>
    </div>

如何使用 jquery 隐藏 child1 div？

更新

我想在点击 Link1 时隐藏 child1

Answer 1

为什么使用 jQuery？

CSS

 #child1{
   display: none;
 }

或者如果你真的想使用 jQuery

$("#child1").hide();

如果您想在点击时隐藏：因为您在标记中使用了 ID，所以这非常简单

$("#parent").click(function() {
   $("#child1").hide();
});

Answer 2

$('div#parent > div#child1').hide(); 

以上为隐藏的直接子级#parent。

点击

$('YOURLINK').on('click',function()
{
    $('div#parent > div#child1').hide();
});

Answer 3

尝试

$("#child1").hide();

或者你可以试试

$("#child1").css('display','none');

根据您编辑的问题，它应该是

$("#link1").click(function(e){
     e.preventDefault();
     $("#child1").hide();
});

并在http://jquery.com/中查看 jquery 功能

并在http://api.jquery.com/selector/中查看 jquery 选择器

Answer 4

如果你想隐藏 div 内的第一个 Inner 孩子：-

$('#link1ID').click(function(){        
    $('div#parent div:first').hide();    
});

如果您想使用子 ID 隐藏：-

 $('#link1ID').click(function(){            
        $('div#parent div#child1').hide();        
 });

Answer 5

$(document).ready(function(){
     $("#link1").on('click',function(){
         $("#child1").hide();
     });
});

与 child2 相同。

Answer 6

这将隐藏 child1 onclick link1 和 child2 onclick link2

演示

$('a').click(function(e){
    e.preventDefault()
    $(this).closest('div').hide();
});

如果你想隐藏父 div 下任何链接的 child1 onclick

$('a').click(function(e){
    e.preventDefault()
    $(this).parentsUntil('parent').find('#child1').hide();
});

HTML

<div id="parent">
     <div id="child1">
         <a href="#">link1</a>
     </div>
     <div id="child2">
         <a href="#">link2</a>
     </div>
</div>

Answer 7

只需选择并隐藏孩子，如下所示：

$("#parent").children().hide();

然后，随时选择并显示/隐藏/任何孩子。