Jquery 콜론(:) 의미

레거시 코드를 보다보면 $(':radio[name]~~~')와 같이 작성된 코드들이 있다. ':'은 어느 경우에 쓰는 건지 문득 궁금하여 찾아보았다.

 

위의 코드처럼 :radio라고 작성하면 페이지에 있는 모든 radio 버튼 요소에 접근할 수 있다.

 

사용 예시

1. 모든 라디오 버튼을 선택하고자 할 때

페이지에 있는 모든 라디오 버튼의 값을 가져오거나, 상태를 변경하거나, 특정 동작을 수행할 때

 

$(':radio').each(function() { 
	console.log($(this).val()); 
    });

 

2. 모든 라디오 버튼의 상태를 변경하고자 할 때

모든 라디오 버튼을 비활성화하거나 체크 상태를 변경하는 경우

$(':radio').prop('disabled', true); 
$(':radio').prop('checked', false);

 

3. 특정 조건에 맞는 라디오 버튼을 찾고자 할 때

선택된 라디오 버튼만 찾아서 특정 동작을 수행하고자 할 때는 :checked와 함께 사용

var selectedRadioValue = $(':radio:checked').val(); 

console.log(selectedRadioValue);