password 선택자

:password 선택자는 password 타입의 요소를 선택합니다. 비밀번호 입력 필드를 참고하세요. $(':password')의 동등한 표현은 $('[type=password]')입니다. :password는 CSS 사양에 속하지 않으므로, 현대 브라우저에서 성능을 향상시키기 위해 [type='password']를 사용하는 것이 더 좋습니다.

문법

password 타입의 필드를 다음과 같이 선택합니다:

javascript$(':password');

다른 의사 클래스 선택자들(':'로 시작하는)과 마찬가지로, ':' 앞에 태그 이름이나 다른 선택자를 지정하는 것이 좋으며, 그렇지 않으면 '*' 선택자가 적용됩니다. 즉, $(':password')는 $('*:password')로 해석되므로, 대신 $('input:password')를 사용하는 것이 더 좋습니다.

예시

모든 password 타입의 입력 필드를 선택하고, css 메서드를 사용하여 녹색 배경과 빨간색 테두리를 적용해 봅시다:

html<form>
  <input type="button" value="button">
  <input type="file">
  <input type="password">
  <button>button</button>
  <input type="reset">
  <input type="radio" name="test">
  <input type="radio" name="test">
  <input type="checkbox">
  <input type="text">
</form>

<

+javascript+> $('form input:password').css({background: 'green', border: '2px red solid'}); $('form').submit(function(event) { event.preventDefault(); // 폼 제출 방지 });

<

-javascript->

함께 보기

  • password 태그
  • css 메서드,
    요소의 CSS 스타일을 가져오거나 변경할 수 있습니다
  • find 메서드,
    이미 찾은 요소 내에서 요소를 검색합니다