카테고리 없음

2. j query 배열 메서드

깡출깡충 2024. 8. 19. 14:35

목차

  • $.inArray() / $.isArray() / $.merge()메서드
  • $.index()메서드

 

$.inArray() / $.isArray() / $.merge()메서드
$.inArray()메서드는 배열에 지정된 데이터 중 지정한 데이터를 찾아 인덱스 번호를 반환합니다.
$.isArray()메서드는 지정한 데이터가 배열 객체면 true를, 배열이 아니면 false를 반환합니다.
$.merge()메서드는 두 배열객체를 하나의 객체로 묶습니다.

(기본형)
1. $.inArray(data, Array, start index)
2. $.isArray(object)
3. $.merge(array1, array2)

 

$.inArray() / $.isArray() / $.merge()메서드 사용해보기

 

 let arr1 = ["서울", "대전", "부산", "전주"];
        let arr2 = ["한국", "미국", "일본", "중국"];
        let obj = {
          name: "김땡땡",
          area: "서울",
        };

        let idxNum = $.inArray("부산", arr1); // 2
        console.log(idxNum);

        let okarray1 = $.isArray(arr1); // true
        let okarray2 = $.isArray(obj); // false
        console.log(okarray1, okarray2);

        $.merge(arr2, arr1);
        console.log(arr2);

 

$.index()메서드
$.index()메서드는 지정한 선택 요소를 찾아서 인덱스값을 반환합니다.

(기본형)
$.("요소선택").index("지정 선택 요소");

 

$.index()메서드 사용해보기

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>제이쿼리 배열 메서드</title>
    <script src="./js/jquery.min.js"></script>
  </head>
  <body>
    <ul>
      <li>내용1</li>
      <li>내용2</li>
      <li id="list3">내용3</li>
      <li>내용4</li>
    </ul>
    <script>
      $(function () {
        // 인덱스 메서드
        let idxNum2 = $("li").index($("#list3"));
        console.log(idxNum2);
      });
    </script>
  </body>
</html>