筛选器：$(this).next() 下一个 $(this).prev 上一个 $(this).parent() 父 $(this).children() 孩 $(this).siblings() 获取兄弟标签 如： $(‘#i1’).siblings()
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>biaoq</title>
<style>
.header{
background-color:black;
color:wheat;
}
.content{
min-height: 50px;
}
.hide{
display :none;
}
</style>
</head>
<body>
<div style='height:400px;200px;border:1px solid #ddddddddd'>
<div class='item'>
<div class='header'>标题一</div>
<div id='i1' class='content hide'>内容</div>
</div>
<div class='item'>
<div class='header'>标题一</div>
<div class='content hide'>内容</div>
</div>
<div class='item'>
<div class='header'>标题一</div>
<div class='content hide'>内容</div>
</div>
</div>
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.12.4.min.js"></script>
<script>
$('.header').click(function(){
$(this).next().removeClass('hide')
$(this).parent().siblings().find('.content').addClass('hide')
//可以合并写成$(this).next().removeClass('hide').parent().siblings().find('.content').addClass('hide')
})
</script>
</body>
</html>
addClass('hide')添加
removeClass('hide')移除