python jQuery筛选器

筛选器：$(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;width: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')移除
posted @ 2018-11-01 14:56  python|一路向前  阅读(348)  评论(0)  编辑  收藏  举报