[jQuery] 속성 조작 메서드

#  해당 요소의 하위 요소 가져오기 (태그, 텍스트)

$("요소").html();

// 덮어쓰기
$("요소").html("새_요소");

 

#  해당 요소의 하위 텍스트 가져오기

$("요소").text();

// 덮어쓰기
$("요소").text("새_텍스트");

 

#  해당 요소의 하위 요소 중 특정 요소 선택

$("요소").find("찾을_요소");

// 모든 하위 요소 선택
$("요소").find("*");

 

#  iframe() 내부 요소에 접근

$("요소").contents();

 

 

---

#  요소의 상태에 따라 true/false 반환

$("요소").is(":요소상태")

// 요소A가 요소B이기도 하면 true 반환
$("요소A").is("요소B")

// ex: $(this).is("img") -> 대상 요소가 <img>이면 true

  - 요소 상태

    · checked

    · selected

    · visible

    · hidden

    · animated

 

#  전체 요소 중 특정 요소를 제외한 요소들만 선택

$("전체_요소").not("제외_요소");

 

#  전체 요소 중 특정 요소를 포함한 요소들만 선택

$("전체_요소").has("포함_요소");

 

 

반응형

728x90

---

#  해당 요소의 특정 속성 값 가져오기

$("요소").attr("속성명");

// 속성 값 바꾸기
$("요소").attr("속성명", "새_속성값");

 

#  해당 요소의 특정 속성 제거

$("요소").removeAttr("속성명");

 

#  해당 요소의 상태 속성 값 가져오기

$("요소").prop("상태속성명");

// 덮어쓰기
$("요소").prop("상태속성명", "새_속성값");

  - 상태 속성

     · defaultValue : 초기 value 

     · value : 현재 value

     · checked : 체크되어 있으면 true, 아니면 false

     · selected : 선택되어 있으면 true, 아니면 false

     · selectedIndex : 선택되어 있는 옵션의 인덱스

     

#  해당 요소의 value 값 가져오기

$("요소").val();

// 덮어쓰기
$("요소").val("새_값");

 

#  해당 요소의 스타일 속성 값 가져오기

$("요소").css("속성명");

// 덮어쓰기
$("요소").css("속성명", "새_속성값");

 

 

---

#  클래스 제거

$("요소").removeClass("클래스명");

 

#  클래스 추가

$("요소").addClass("클래스명");

 

#  클래스가 있으면 제거, 없으면 추가

$("요소").toggleClass("클래스명");

 

#  클래스가 있으면 true, 없으면 false

$("요소").hasClass("클래스명");