end()

<p><span>Hello</span>, how are you?</p>
<script>$("p").find("span").end().css("border", "2px red solid");</script>

找到p 的子元素span ，end（） 返回去找到p 设置p 元素的样式

<body>
<ul class="first">
<li class="foo">list item 1</li>
<li>list item 2</li>
<li class="bar">list item 3</li>
</ul>
<ul class="second">
<li class="foo">list item 1</li>
<li>list item 2</li>
<li class="bar">list item 3</li>
</ul>
<script>$('ul.first').find('.foo').css('background-color', 'red')
.end().find('.bar').css('background-color', 'green');</script>

 先找到类名为 first  的ul，在
在类名为 first 的ul 下面找到类名为foo 的元素，设置它的样式，

 返回去找到ul ，在ul下面找到类名为bar的元素，设置它的样式 </body>

　　andSelf()

<style>
  p, div { margin:5px; padding:5px; }
  .border { border: 2px solid red; }
  .background { background:yellow; }
</style>
</head>
<body>
<ul>
   <li>list item 1</li>
   <li>list item 2</li>
   <li class="third-item">list item 3</li>
   <li>list item 4</li>
   <li>list item 5</li>
</ul>
<script>
$("li.third-item").nextAll().andSelf().css("background-color", "red");    最后三个li 的背景颜色成红色
</script>

　　

<style>
  p, div { margin:5px; padding:5px; }
  .border { border: 2px solid red; }
  .background { background:yellow; }
</style>
</head>
<body>
  <div>
    <p>First Paragraph</p>
    <p>Second Paragraph</p>
  </div>
<script>
    $("div").find("p").andSelf().addClass("border");  div  和  p  都被添加类 
    $("div").find("p").addClass("background");     p 添加类
</script>

　　siblings()

<body>
<ul>
   <li>list item 1</li>
   <li>list item 2</li>
   <li class="third-item">list item 3</li>
   <li>list item 4</li>
   <li>list item 5</li>
</ul>

<script>
$('li.third-item').siblings().css('background-color', 'red');
类名为third-item 的li 元素  的同级元素  的样式

$('li.third-item').siblings().andSelf().css('background-color', 'red');
类名为third-item 的li 元素  的同级元素  包括它自己的样式

$("li.start").siblings().css({"color":"red","border":"2px solid red"});

$("div").siblings(".selected")

  找到每个div的所有同辈元素中带有类名为selected的元素

</script>
</body>

 

 

$("p").prev()    找到每个段落紧邻的前一个同辈元素。

$("p").prev(".selected")   
找到每个段落紧邻的前一个同辈元素中类名为selected的元素。
$("div:last").prevAll().addClass("before");
给最后一个之前的所有div加上一个类

<script>$("div:last").prevAll('.aa').addClass("before");</script>
<!DOCTYPE html>
<html>
<head>
  <script type="text/javascript" src="/jquery/jquery.js"></script>
</head>
<body>
<dl>
  <dt id="term-1">term 1</dt>
  <dd>definition 1-a</dd>
  <dd>definition 1-b</dd>
  <dd id='ha'>definition 1-c</dd>
  <dd>definition 1-d</dd>

  <dt id="term-2">term 2</dt>
  <dd>definition 2-a</dd>
  <dd>definition 2-b</dd>
  <dd>definition 2-c</dd>

  <dt id="term-3">term 3</dt>
  <dd>definition 3-a</dd>
  <dd>definition 3-b</dd>
</dl>

<script>
$("#term-2").prevUntil("dt")
  .css("background-color", "red");

id为term-2 的元素前面所有的元素，知道dt  结束
  
var term1 = document.getElementById('ha');
$("#term-3").prevUntil(term1, "dd")
  .css("color", "blue");
id为term-3  往前到id为ha 的元素，这之间的dd 元素
</script>
</body>
</html>
next()

nextAll()

nextUntil()

parent()

parents()

parentsUntil()

$("div").children()
$("div").children(".selected")

$("p").find("span")  从所有的段落开始，进一步搜索下面的span元素。与$("p span")相同。  
 
 

 

$("p").eq(1)  查找索引为1 的 p 元素 ，即第二个 p 元素
$("p").eq(-2)  查找倒数第二个p元素
$('li').first()   获取匹配的第一个元素
$('li').last()    获取最后个元素


检查当前的元素是否含有某个特定的类，如果有，则返回true。
  if ( $(this).hasClass("protected") )

 

<body>
  <div></div>

  <div class="middle"></div>
  <div class="middle"></div>
  <div class="middle"></div>
  <div class="middle"></div>

  <div></div>

<script>
  $("div").css("background", "#c8ebcc")
    .filter(".middle")
    .css("border-color", "red");
</script>

</body>
$("p").filter(".selected, :first")     保留第一个以及带有select类的元素

 



$("input[type='checkbox']").parent().is("form")   返回 true 或false


 




slice() 把匹配元素集合缩减为指定的指数范围的子集。

<body>
<ul>
  <li>list item 1</li>
  <li>list item 2</li>
  <li>list item 3</li>
  <li>list item 4</li>
  <li>list item 5</li>
</ul>

<script>
$('li').slice(0,2).css('background-color', 'red');    索引从1开始，直到索引为2结束不包括2
查找所有的li元素 ，在其中选取索引为0和1 的元素，即选取第一和第二个

$('li').slice(-4,-2).css('background-color', 'red');
slice（负数，负数），从最后的开始数，-1，-2，-3，-4 ，选取-4到-2 不包括-2

</script>






 




<body>
<ul>
  <li>list <strong>item 1</strong></li>
  <li><span>list item 2</span></li>
  <li>list item 3</li>
</ul>

<script>
$("ul").click(function(event) {
  var $target = $(event.target);
  if ( $target.is("li") ) {
    $target.css("background-color", "red");
  }
});
</script>

</body>


  


$("input[type='checkbox']").parent().is("form")   由于input元素的父元素是一个表单元素，所以返回true。




 


 map()




  $(function(){
           var arr1=[0,3,5];
            var arr2= $.map(arr1,function(item){return item*2;});
            document.write(arr2)
            alert(arr2);
        });




 


 




保留包含特定后代的元素，去掉那些不含有指定后代的元素。

$('li').has('ul').css('background-color', 'red');
给含有ul的li加上背景色








查找DIV中的每个子元素。
$("div").children()
在每个div中查找 .selected 的类。
$("div").children(".selected")