<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <script src="./jquery-1.12.4.min.js"></script> <script> $(function(){ //选取class名称为four的div标签 var $div = $('.four') $div.css({"color":"red"}) //平级关系,兄弟 //上一个兄弟 var $result = $div.prev(); //位于前面的所有兄弟 var $result = $div.prevAll(); //下一个兄弟 var $result = $div.next(); //下面所有的兄弟 var $result = $div.nextAll(); //除了他自己以外其他所有平级的节点,也就是兄弟节点 var $result = $div.siblings(); // $result.css({"color":"green"}) //父子关系 //children和find查找子元素 var $result = $div.children('p'); var $result = $div.find('span'); // $result.css({"color":"green"}); //父元素parent var $result = $div.parent(); $result.css({"color":"red"}) }) </script> </head> <body> <div>1</div> <div>2</div> <div>3</div> <div class="four">4 <p class="son">son son son</p> <span>hello world</span> <label for="">label</label> </div> <div>5</div> <div>6</div> <div>7</div> </body> </html>
关于jquery选择器的转移
猜你喜欢
转载自blog.csdn.net/owc1874/article/details/80744657
今日推荐
周排行