본문 바로가기
프로그래밍/jQuery

jQuery 쉽게하기 - API 깨부시기, 선택자(Selector) : [name~="value"]

by zoo10 2011. 1. 21.

[name~="value"] 는 태그의 name 속성명에 들어가 있는 문자중에 "value" 에 해당되는 문자가 구분되는 단어로 들어가 있는지 확인하는 선택자입니다.

원문 링크 http://api.jquery.com/attribute-contains-word-selector/

attributeContainsWord selector

개요 : 태그가 가진 속성(attributes)의 값(value)에 선택자로 주어진 문자열이 단어의 형태로 들어가 있으면 반환해 줍니다.

  • jQuery('[attribute~="value"]')
  • attribute 태그의 속성
  • value 속성의 값, 따옴표를 사용해야 합니다.

예 제
문서에 있는 input 태그들 중에 name 속성(attribute)의 값이 "man" 이라는 단어를 독립적으로 포함하고 있는 요소를 찾아서 'man 이 단어로 포함되어 있음' 을 입력합니다.

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-1.4.4.js"></script>
</head>
<body>
  <input name="man-news" />

  <input name="milk man" />
  <input name="letterman2" />
  <input name="newmilk" />
<script>$('input[name~="man"]').val('man 이 단어로 포함되어 있음');</script>

</body>
</html>

미리보기

'man'이라는 단어가 name 속성에 들어 있는 요소가 있지만, 문자가 찍히지 않았습니다. man 이 독립된 단어가 아니기 때문입니다. 2번째 input 요소에는 띄어쓰기 다음에 'man' 이라는 단어가 독립형으로 들어 있기 때문에 그 요소에 특정 데이터를 입력할 수 있게 됩니다.

 

요것도 그냥 '음, 이런게 있군'하고 넘어가시면 되겠습니다.

그럼 즐프하세요.

※ 본 예제는 http://www.jquery.com 에 있는 내용임을 밝힙니다.