nth jQuery 요소를 가져오는 방법
jQuery에서$("...").get(3)세 번째 DOM 요소를 반환합니다.세 번째 jQuery 요소를 반환하는 기능은 무엇입니까?
:eq 선택기를 사용할 수 있습니다. 예:
$("td:eq(2)").css("color", "red"); // gets the third td element
또는 eq(int) 함수:
$("td").eq(2).css("color", "red");
또한 인덱스는 0을 기반으로 합니다.
먼저 (짧은) 실렉터 페이지를 찾아보는 것은 어떻습니까?
여기 있습니다. 연산자입니다.다음과 같이 사용됩니다.get()그러나 jQuery 개체를 반환합니다.
또는 사용할 수 있습니다..eq()기능도 합니다.
jQuery 개체를 빌드하는 쿼리를 제어할 수 있는 경우:eq()
$("div:eq(2)")
다른 함수나 다른 함수에서 전달되는 것과 같이 제어할 수 없는 경우 다음을 사용합니다..eq()
var $thirdElement = $jqObj.eq(2);
또는 섹션을 원하는 경우(예: 세 번째, 네 번째, 다섯 번째 요소),.slice()
var $third4th5thElements = $jqObj.slice(2, 5);
이거 쓰셔도 될 것 같아요.
$("ul li:nth-child(2)").append("<span> - 2nd!</span>");
그것은 각 일치된 UL에서 두 번째 li를 찾아 기록합니다.
.eq() - 요소의 0 기반 위치를 나타내는 정수.
예:
간단한 목록이 있는 페이지를 생각해 보십시오.
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
</ul>
이 방법을 목록 항목 집합에 적용할 수 있습니다.
$( "li" ).eq( 2 ).css( "background-color", "red" );
변수에 jquery 개체가 이미 있는 경우 jquery를 사용하지 않고 일반 인덱스 배열로 처리할 수도 있습니다.
var all_rows = $("tr");
for(var i=0; i < all_rows.length; i++){
var row = all_rows[i];
//additionally, you can use it again in a jquery selector
$(row).css("background-color","black");
}
위의 예제는 어떤 식으로든 유용하지 않지만 jquery에서 만든 개체를 인덱스 배열로 처리하는 방법을 나타냅니다.
내가 당신의 질문을 올바르게 이해한다면, 당신은 언제든지 get 함수를 다음과 같이 포장할 수 있습니다.
var $someJqueryEl = $($('.myJqueryEls').get(3));
예를 들어 특정 요소/노드 또는 태그를 루프로 가져오려는 경우.
<p class="weekday" data-today="monday">Monday</p>
<p class="weekday" data-today="tuesday">Tuesday</p>
<p class="weekday" data-today="wednesday">Wednesday</p>
<p class="weekday" data-today="thursday">Thursday</p>
그래서, 위에서 코드 루프가 실행되고 우리는 특정 필드가 선택하기를 원합니다. 우리는 위의 루프에서 예상 요소만 선택할 수 있는 jQuery 선택을 사용해야 합니다. 그래서 코드는
$('.weekdays:eq(n)');
예.
$('.weekdays:eq(0)');
다른 방법으로도
$('.weekday').find('p').first('.weekdays').next()/last()/prev();
하지만 첫 번째 방법이 더 효율적입니다.HTML <tag>고유한 클래스 이름이 있습니다.
참고: 두 번째 방법은 대상 요소 또는 노드에 클래스 이름이 없을 때 사용됩니다.
자세한 내용은 https://api.jquery.com/eq/ 을 참조하십시오.
선택기를 사용하는 반복의 경우 다음과 같이 의미가 없는 것 같습니다.
var some = $( '...' );
for( i = some.length -1; i>=0; --i )
{
// Have to transform in a jquery object again:
//
var item = $( some[ i ] );
// use item at will
// ...
}
jQuery를 사용하여 N번째 요소에 액세스하고 제거하는 실시간 예제:
<html>
<head></head>
<body>
<script type="text/javascript"
src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('li:eq(1)').hide();
});
</script>
<ol>
<li>First</li>
<li>Second</li>
<li>Third</li>
</ol>
</body>
</html>
실행될 때 순서 목록에는 첫 번째와 세 번째 두 항목이 표시됩니다.두 번째는 숨겨졌습니다.
$(function(){
$(document).find('div').siblings().each(function(){
var obj = $(this);
obj.find('div').each(function(){
var obj1 = $(this);
if(!obj1.children().length > 0){
alert(obj1.html());
}
});
});
});
<div id="2">
<div>
<div>
<div>XYZ Pvt. Ltd.</div>
</div>
</div>
</div>
<div id="3">
<div>
<div>
<div>ABC Pvt Ltd.</div>
</div>
</div>
</div>
언급URL : https://stackoverflow.com/questions/1442925/how-to-get-nth-jquery-element
'source' 카테고리의 다른 글
| 열 이름의 Excel 열 번호 (0) | 2023.05.29 |
|---|---|
| 기트풀은 어떤 경우에 해로울 수 있습니까? (0) | 2023.05.29 |
| C#을 사용하여 URL 매개 변수를 디코딩하려면 어떻게 해야 합니까? (0) | 2023.05.29 |
| 설치 프로젝트에 라이센스 계약을 추가하는 방법 (0) | 2023.05.24 |
| jupyter 노트북 실행 중 오류 발생(해당 파일 또는 디렉터리 없음) (0) | 2023.05.24 |