J Query 기초(2)-메소드

김수민·2023년 6월 1일
0

JQuery

목록 보기
2/3

선택 메소드

.end()

직전에 선택한 요소의 상위 요소 선택

$(function() {
    $("button").on("click", function() {
        $("#list")
      // id가 "list"인 요소의 자손 요소 중에서
         .find("li")
      // <li>요소를 모두 선택한 후에,
         .eq(1).html("두 번째 아이템을 선택했어요!!")
      // 그 중에서 두 번째 요소의 값을 설정함.
         .end()
      // 다시 id가 "list"인 요소의 자손 요소 중에서 <li>요소를 모두 선택한 후에,
         .eq(2).html("세 번째 아이템도 선택했어요!!");
      // 그 중에서 세 번째 요소의 값을 설정함.
    });
});

.width() .height()

선택한 요소의 너비/ 높이를 반환하는 메소드

w = $("#box").width();
h = $("#box").height();
$("#box").width(w/2).height(h/2);

getter, setter

getter

값을 가져오기 위한 메소드

setter

값을 수정하기 위한 메소드

$(function() {
    $("button").on("click", function() {var newText = $("h1").html();
      // <h1>요소의 텍스트를 읽어오는 getter 메소드$("#text").html(newText);
      // id가 "text"인 요소에 새로운 텍스트를 설정하는 setter 메소드

    });

});
profile
sumin0gig

0개의 댓글