div에서 클래스의 첫 번째 출현을 찾습니다.

div에서 클래스의 첫 번째 출현을 찾습니다.

아래 html 구조를 가지고 있는데 jQuery를 사용하여 "pop content"로 클래스가 있는 first div의 내부 html을 찾고 싶습니다.

<div>
<div class="popContent">1</div>
<div class="popContent">2</div>
</div>

너는 너 자신을 차게 될 것입니다.. :)

$(".popContent:first").html()

div에서 클래스의 첫 번째 발생

$('.popContent').eq(0).html('value to set');

div에서 클래스가 두 번째로 발생

$('.popContent').eq(1).html('value to set');

사용가능:first이 경우 셀렉터

$('.popContent:first').text();

데모

$("div.popContent:first").html()

첫 번째 디브의 콘텐츠를 제공해야 합니다("이 경우 1").

당신은 문서를 사용할 수 있습니다.쿼리선택기()

지정된 선택자 그룹과 일치하는 문서 내의 첫 번째 요소(문서 마크업의 첫 번째 요소별로 문서 노드의 깊이-첫 번째 사전 순서 순회 사용)를 반환합니다.

첫 기회만 노리기 때문에 jQuery보다 성능이 좋습니다.

var count = 1000;
var element = $("<span>").addClass("testCase").text("Test");
var container = $(".container");
var test = null;
for(var i = 0; i < count; i++) {
	container.append(element.clone(true));
}

console.time('get(0)');
test = $(".testCase").eq(0);
console.timeEnd('get(0)');
console.log(test.length);

console.time('.testCase:first');
test = $(".testCase:first");
console.timeEnd('.testCase:first');
console.log(test.length);

console.time('querySelector');
test = document.querySelector(".testCase");
console.timeEnd('querySelector');
console.log(test);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container"></div>

jsFiddle 버전의 스니펫

아래와 같이 Jquery :first selector를 사용합니다.

$(".popContent:first");

$("div.popContent:first").html();

다음 jQuery 식을 사용할 수 있습니다.

alert(jQuery('div.popContent').eq(0).html());

언급URL : https://stackoverflow.com/questions/6423804/find-first-occurrence-of-class-in-div