2008-10-09 2 views
49
<div id="myDiv"> 
    <a>...</a> 
    <a>...</a> 
    <a>...</a> 
    <a>...</a> 
    <a>...</a> 
    <a>...</a> 
</div> 

Если вы хотите выбрать теги 2nd, 3rd и 4th a в приведенном выше примере, как бы вы это сделали? Единственное, о чем я могу думать, это:Как выбрать диапазон элементов в jQuery

$("#myDiv a:eq(1), #myDiv a:eq(2), #myDiv a:eq(3)") 

Но это не выглядит очень эффективным или красивым. Я думаю, вы могли бы также выбрать ВСЕ a с, а затем выполнить за ними .each, но это могло бы стать очень неэффективным, если бы было намного больше a.

ответ

105

jQuery slice() Функция, принимающая индексы первого и последнего необходимых элементов, выбирает подмножество согласованных элементов. Обратите внимание, что он не включает последний элемент.

В вашем конкретном случае, вы должны использовать

$("#myDiv a").slice(1, 4) 
+0

`$ (« Classname»). Ломтика (1, 4)` также может быть полезным, это то, что мне нужно для сценария, большое спасибо за то ход мыслей начал :) – pulkitsinghal 2012-03-25 01:07:11

+0

ли такое расширенный первоначальный отбор увеличивает накладные расходы на обработку, по сравнению с более конкретным селектором? Или вы думаете: lt,: gt, and: eq более ресурсоемкие? – aaronbauman 2014-02-04 18:31:38

9

Использование функции .slice() делает именно то, что мне нужно.

1

Вы должны быть в состоянии сделать это путем извлечения среза массива таким образом. Это линия

$("div[id='myDiv'] > a").slice(1,4).css("background","yellow"); 

, которое вас интересует. Это повлияет на 2-й, 3-й и 4-й элементы.

<html> 
    <head> 
     <script type="text/javascript" src="jquery-1.2.6.pack.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function(){ 
       $("a").click(function(event){ 
        $("div[id='myDiv'] > a").slice(1,4).css("background","yellow"); 
        event.preventDefault(); 
       }); 
      }); 
     </script> 
    </head> 
    <body> 
     <div id="myDiv"> 
      <a>1</a> 
      <a>2</a> 
      <a>3</a> 
      <a>4</a> 
      <a>5</a> 
      <a>6</a> 
     </div> 
     <hr> 
     <a href="" >Click here</a> 
     <hr> 
    </body> 
</html> 
Смежные вопросы