查看: 2847|回复: 1

[jquery] jquery选择器

65 主题	3 好友	739 积分

超级版主

Rank: 8 Rank: 8

自我介绍: 新年第一天据说有雨，全民齐赏日出的计划恐要泡汤。”宋仁宗拍着包拯的肩，“朕决定把你悬挂在城门上。”“但微臣额上的不是太阳是月亮啊！”“没事，挂久一点就会升级成太阳
生肖: 虎
星座: 狮子座
性别: 男

发消息

电梯直达

楼主

发表于 2012-5-24 17:04:21 |只看该作者 |倒序浏览

本帖最后由 rogan 于 2012-5-24 17:07 编辑

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "[url=http://www.w3.org/TR/html4/strict.dtd]http://www.w3.org/TR/html4/strict.dtd[/url]">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<title>Untitled Document</title>
<script src="lib/jquery/jquery-1.4.2.js">
</script>
<script language="JavaScript">
$(document).ready(function(){
// $('#one').css("background", "#bbffaa");
// $('.mini').css("background", "#bbffaa");
// $('div').css("background", "#bbffaa");
// $('*').css("background", "#bbffaa");
// $('span, #two').css("background", "#bbffaa");
/*代码层次*/
// $('body div').css("background", "#bbffaa");
// $('body > div').css("background", "#bbffaa");
// $('.one + div').css("background", "#bbffaa");
// $('.one').next("div").css("background", "#bbffaa");
// $('#two ~ div').css("background", "#bbffaa");
// $('#two').nextAll("div").css("background", "#bbffaa");
//$('.one').nextAll("div").css("background", "#bbffaa");
// $('.one').siblings("div").css("background", "#bbffaa");
/*过滤选择*/
// $('div:first').css("background", "#bbffaa");
// $('div:last').css("background", "#bbffaa");
// $('div:not(.one)').css("background", "#bbffaa");
// $('div:even').css("background", "#bbffaa");
// $('div:eq(3)').css("background", "#bbffaa");
// $('div:gt(3)').css("background", "#bbffaa");
// $('div:lt(3)').css("background", "#bbffaa");
// $(':header').css("background", "#bbffaa");
// $(':animated').css("background", "#bbffaa");
$('div:visible').css("background", "#bbffaa");
$('div:hidden').show(3000);
});
</script>
<style type="text/css">
div, span, p {
width: 140px;
height: 140px;
margin: 5px;
background: #aaa;
border: #000 1px solid;
float: left;
font-size: 17px;
font-family: Verdana;
}
div.mini {
width: 55px;
height: 55px;
background: #aaa;
font-size: 12px;
}
div.hide {
display: none;
}
</style>
</head>
<body>
<div class="one" id="one">
id=one,class=one 的div
<div class="mini">
class = mini
</div>
</div>
<div class="one" id="two" title="test">
id = two,class = one,title = test 的div.
<div class="mini" title="other">
class=mini title=other
</div>
<div class="mini" title="test">
class=mini,title=test
</div>
</div>
<div class="one">
<div class="mini">
class = mini
</div>
<div class="mini">
class = mini
</div>
<div class="mini">
class = mini
</div>
<div class="mini">
class = mini
</div>
</div>
<div class="one">
<div class="mini">
class = mini
</div>
<div class="mini">
class = mini
</div>
<div class="mini">
class = mini
</div>
<div class="mini" title="tesst">
class = mini,title=tesst
</div>
</div>
<div style="display:none;" class="none">
style的display=none的div
</div>
<div class="hide">
class=hide的div
</div>
<div>
包含input的type=hidden的div<input type="hidden" size="8"/>
</div>
<span id="mover">正在执行动画的span元素。</span>
</body>
</html>