Jquery를 사용하여 처음 몇 개의 하위 요소를 얻는 방법-프런트엔드 Q&A-php.cn

Jquery를 사용하여 처음 몇 개의 하위 요소를 얻는 방법

青灯夜游

풀어 주다： 2022-07-25 16:25:56

원래의

2838명이 탐색했습니다.

jquery가 처음 몇 개의 하위 요소를 가져오는 단계: 1. children() 함수를 사용하여 모든 하위 요소를 가져옵니다. "parent element.children();" 구문은 모든 하위 요소를 포함하는 jquery 객체를 반환합니다. 사용: lt () 선택기는 children()에서 얻은 하위 요소의 범위를 좁힙니다. "parent element.children(:lt(index))" 구문은 인덱스 값이 지정된 숫자보다 작은 하위 요소만 가져옵니다. 돌려보내세요.

Jquery를 사용하여 처음 몇 개의 하위 요소를 얻는 방법

이 튜토리얼의 운영 환경: windows7 시스템, jquery3.6.0 버전, Dell G3 컴퓨터.

jquery에서는 children() 함수와 :lt() 선택기를 사용하여 처음 몇 개의 하위 요소를 가져올 수 있습니다.

구현 단계:

1단계: children()을 사용하여 모든 하위 요소를 가져옵니다.

children()은 지정된 상위 노드 아래에서 모든 직접 하위 요소를 가져올 수 있습니다.

父元素.children()

로그인 후 복사

는 모든 하위 요소가 포함된 목록을 반환합니다. elements jquery object

2단계: :lt(index) 선택기를 사용하여 처음 몇 개의 하위 요소를 얻습니다.:lt(index)选择器获取前几个子元素

利用:lt()选择器可以缩小children()获取的子元素范围，只获取 index 值小于指定数字的元素。

父元素.children(:lt(index))

로그인 후 복사

这样就会返回一个包含前几个子元素的jquery对象

完整示例代码：获取父元素ul的前2个子元素li

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script src="js/jquery-3.6.0.min.js"></script>
		<script>
			$(function () {
            $("button").click(function () {
				$("ul").children("li:lt(2)").css("background-color","red");
            })
        })
    </script>
	<style type="text/css">
		ul{
			background-color:yellow;
		}
		li{
			border:1px solid red;
			margin:10px;
		}
	</style>
	</head>
	<body>
		<ul>
			<li>香蕉</li>
			<li>苹果</li>
			<li>梨子</li>
			<li>橘子</li>
		</ul>
		<button>父元素ul的前2个子元素li</button>
	</body>
</html>

로그인 후 복사

Jquery를 사용하여 처음 몇 개의 하위 요소를 얻는 방법

说明：

children() 方法返回被选元素的所有直接子元素。

$(selector).children(filter)

로그인 후 복사

参数	描述
filter	可选。规定缩小搜索子元素范围的选择器表达式。

:lt(index)

:lt() 선택기를 사용하여 다음에서 얻은 하위 요소의 범위를 좁힙니다. children(), only 인덱스 값이 지정된 숫자보다 작은 요소를 가져옵니다.

rrreee

이렇게 하면 처음 여러 하위 요소가 포함된 jquery 개체가 반환됩니다.

전체 샘플 코드: 상위 요소 ul rrreee Jquery를 사용하여 처음 몇 개의 하위 요소를 얻는 방법

🎜🎜설명: 🎜🎜🎜children() 메서드는 선택한 요소는 하위 요소를 직접 지정합니다. 🎜rrreee

매개변수	설명
필터	선택사항. 하위 요소 검색 범위를 좁히는 선택기 표현식을 지정합니다.

🎜:lt(index) 선택기는 인덱스 값이 지정된 숫자보다 작은 요소를 선택합니다. 🎜🎜인덱스 값은 0부터 시작합니다. 🎜🎜가장 일반적인 사용법: 지정된 조합에서 특정 시퀀스 번호 앞에 있는 요소를 선택하기 위해 다른 선택기와 함께 사용됩니다(예: 위의 예). 🎜🎜【추천 학습: 🎜jQuery 동영상 튜토리얼🎜, 🎜웹 프론트엔드 동영상🎜】🎜

위 내용은 Jquery를 사용하여 처음 몇 개의 하위 요소를 얻는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!