##Space: $('parent childchild') means to get all childchild nodes under parent
##Greater than sign: $('parent >
childchild') means to get all the lower levels under parent childchildPlus sign: $('pre + nextbrother') means to get the next sibling node of the pre node, which is equivalent to the next() method
Tilde sign: $('pre ~ brother') means to get All sibling nodes behind the pre node are equivalent to the nextAll() method
Detailed description<meta charset="utf-8"> <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script> <p id="imgs_box"> <ul class="play_imgs_width imgs_source"> <li><a href="javascript:;"><img src="./images/banner1.jpg" idth="610" height="390"/></a></li> <li><a href="javascript:;"><img src="./images/banner1.jpg" idth="610" height="390"/></a></li> <li><a href="javascript:;"><img src="./images/banner1.jpg" idth="610" height="390"/></a></li> </ul> <ul class="imgs_buttons play_imgs_width"> <li><a href="" class="buttons_ahover">1</a></li> <li><a href="" class="buttons_default">2</a></li> <li><a href="" class="buttons_default">3</a></li> </ul> <ul class="test"> <li> <ul class="test_first_child"> <li></li> <li></li> <li></li> <li></li> </ul> </li> </ul> </p>
Use of spaces
//获取imgs_box下的所有元素 $(function(){ $('#imgs_box a').each(function(){ console.log(this); }); });
The effect is as shown below, As you can see, all elements were obtained
##Use of greater than sign
$(function(){
$('#imgs_box > ul').each(function(){
console.log(this);
});
});
##Use of plus sign
$(function(){
$('.imgs_source + ul').each(function(){
console.log(this);
});
});
Use of tilde
##
$(function(){ $('.imgs_source ~ ul').each(function(){ console.log(this); }); });
The above is the difference between the space and the greater than sign >, the plus sign + and the tilde ~ in the jquery selector. For more related content, please pay attention to the PHP Chinese website (www.php. cn)!