jQuery 강좌 | Methods > .get()

.get()은 선택한 요소를 배열(Array)의 객체로 가져옵니다.

문법

.get()

선택한 모든 요소를 가져옵니다.

.get( index )

선택한 요소 중 특정한 것만 가져옵니다.

예제 1

http://book.cmsfactory.net/jQuery/V01/Methods/get-01.html

모든 li 요소를 jb 배열로 가져온 후, 각 요소의 내용을 출력하는 예제입니다.

<!doctype html>
<html lang="ko">
  <head>
    <meta charset="utf-8">
    <title>jQuery Methods | .get()</title>
    <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
    <script>
      $( document ).ready( function() {
        var jb = $( 'li' ).get();
        for ( var i = 0; i < jb.length; i++) {
          $( 'div' ).append( '<p>' + jb[i].innerHTML + '</p>' );
        }
      } );
    </script>
  </head>
  <body>
    <ul>
      <li>Lorem</li>
      <li>Ipsum</li>
    </ul>
    <div></div>
  </body>
</html>

예제 2

http://book.cmsfactory.net/jQuery/V01/Methods/get-02.html

li 요소 중 첫번째만 가져와서 내용을 출력하는 예제입니다.

<!doctype html>
<html lang="ko">
  <head>
    <meta charset="utf-8">
    <title>jQuery Methods | .get()</title>
    <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
    <script>
      $( document ).ready( function() {
        var jb = $( 'li' ).get( 0 );
        $( 'ul' ).after( '<p>' + jb.innerHTML + '</p>' );
      } );
    </script>
  </head>
  <body>
    <ul>
      <li>Lorem</li>
      <li>Ipsum</li>
    </ul>
  </body>
</html>

Category

Created on 2014-07-06 23:56 | Updated on 2015-07-17 01:09

이 글을 공유하기

Kakao

기초 강좌