Programming

jQuery Selector 속성값 다른 것 찾기 [name!=”value”]

알 수 없는 사용자 2018. 3. 8. 17:46
반응형

[name!=”value”]는 [name=”value”]와 반대입니다.


지정된 속성을 갖지 않은 것을 찾으며 :not([attr='value'])와 동일합니다.


예제)

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>attributeNotEqual demo</title>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<div>
  <input type="radio" name="newsletter" value="Hot Fuzz">
  <span>name is newsletter</span>
</div>
<div>
  <input type="radio" value="Cold Fusion">
  <span>no name</span>
</div>
<div>
  <input type="radio" name="accept" value="Evil Plans">
  <span>name is accept</span>
</div>
 
<script>
$( "input[name!='newsletter']" ).next().append( "<b>; not newsletter</b>" );
</script>
 
</body>
</html>

실행결과)
name is newsletter
no name
name is accept

attributeNotEqual demo


설명)

$( "input[name!='newsletter']" ) input 태그를 가진 엘레먼트들 중에 name값이 newsletter가 아닌 것을 찾아

next() 다음 요소에 <b>; not newsletter</b>를 추가하여라가 되겠습니다.

위의 조건이라면 3개의 라디오 버튼 컨포넌트 중에 첫 번째만 newsletter라는 name을 갖고 있고

두, 세번째는 newsletter가 아니므로 조건에 일치합니다.

각각의 다음 요소가  <span>인데 여기 안에 "<b>~</b>"를 추가(append)하게 된 것입니다.


참 쉽죠잉~?



반응형