您的位置：首页 > Web前端 > JQuery

JQuery 其他选择器

2013-04-17 19:37 267 查看

<head>

<title></title>

<style type="text/css">

.imgclass

{

width: 100px;

height: 100px;

}

div

{

width: 250px;

height: 250px;

background-color: #eee;

border: solid 2px Blue;

}

</style>

<script src="jquery-1.9.1.js" type="text/javascript"></script>

<script type="text/javascript">

$(function () {

$('#Button1').click(function () {

//$('#divfirst img').hide(2000);//获取的是id为divfirst的层中的所有tagname为img的元素，不管这些元素是否还嵌套在别的元素中

//$('#divfirst span img').hide(2000); //获取的是id为divfirst的层中的所有span子元素中的img元素,需要注意的是这个span子元素可以是divFirst的儿子或者孙子

//$('#divfirst>span img').hide(2000); //获取的是id为divFirst的层中的第一级span元素中的所有img元素

//$('#divfirst+div img').hide(2000);//获取的是id为divFirst的层后面的同级的第一个div元素，且此div必须紧随其后，如果中间有别的元素隔开，则不能获取。

//$('#divfirst+div img').hide(2000);

//$('#divfirst').next().hide(2000);//获取的是id为divfirst的层后面的第一个同级元素，不管是什么类型

//$('#divfirst~div img').hide(2000);//获取的divfirst后边所有同级别的，且类型为div里边的所有img元素

//$('#divfirst').nextAll().hide(2000);//获取的是divfirst后变的所有同级元素，不管是什么类型(类型不确定)

})

})

</script>

</head>

<body>

<input id="Button1" type="button" value="层次选择器"/>

<div id="divfirst">

<span>风景

<a href="#">

<img id="img1" src="images/1.jpg" class="imgclass" />

</a>

</span>

<span>

<img id="img2" src="images/2.jpg" class="imgclass" />

</span>

第一层

</div>

<img id="img6" src="images/5.jpg" class="imgclass" />

<div>

第二层<img id="img3" src="images/3.jpg" class="imgclass" />

</div>

<div>

第三层<img id="img4" src="images/4.jpg" class="imgclass" />

</div>

<img id="img5" src="images/5.jpg" class="imgclass" />

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航