find 메소드
find 메소드는 어떤 요소의 하위 요소 중 특정 요소를 찾을 때 사용합니다.
사용 예시
아래 코드와 같이, aaa라는 id값을 가지고 있는 요소에서 find메소드를 사용하여 class_123이라는 클래스의 value값을 구할 수 있습니다.
<div id="aaa">
<p>
<input type="text" class="class_123" value="abcdefg"/>
</p>
</div>
<script>
var result = $("#aaa").find('.class_123').val();
console.log(result);
</script>
또한, find로 찾은 하위 요소에 다양한 속성을 추가할 수 있습니다.
<div id="aaa">
<p>
<input type="text" class="class_123" value="abcdefg"/>
</p>
</div>
<script>
//선택된 하위 요소에 css요소 추가
var result = $("#aaa").find('.class_123').css( 'font-size', '2em');
</script>
주의할 점
find() 메소드는 하위 요소를 모두 찾기 때문에, 하위 요소의 개수가 많다면 찾는 속도가 오래 걸려 페이지 로딩이 느려질 수 있습니다.
반응형
'JavaScript & JQuery' 카테고리의 다른 글
[JQuery] 사용자 데이터, 커스텀 데이터(custom data - data-xx의 형태) (0) | 2022.12.23 |
---|---|
[JQuery] 속성 추가, 제거(attr, removeAttr) (2) | 2022.12.23 |
[AJAX] ajax를 이용해 배열 형태로 보내기 (2) | 2022.10.07 |
[JavaScript]카카오톡 인앱 브라우저 닫기(안드로이드, IOS) (4) | 2022.08.17 |
[JavaScript]Input type number의 maxlength 적용(slice 메서드) (2) | 2022.05.20 |
댓글