[jQuery] attr, prop, not - input[type='checkbox'] 체크박스 제어
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8">
<script type="text/javascript" src="js/jquery.js"></script>
<script>
// prop는 dom객체 속성(Property)으로 접근
// attr는 html 마크업 특성(Attribute)으로 접근
$(function(){
$("input[type='checkbox']").prop({
"disabled":true
});
console.log($("input[type='checkbox']").eq(0).prop("checked")); //true
console.log($("input[type='checkbox']").eq(0).attr("checked")); //checked
$("input[type='checkbox']").eq(1).prop("checked", true);
console.log($("input[type='checkbox']").filter(':checked').size()); //체크된 갯수 3
console.log($("input[type='checkbox']").not(':checked').length); //체크되지 않은 갯수 1
console.log($("input[type='checkbox']").eq(2).is(':checked')); //false
console.log($("input[type='checkbox']").eq(2).prop('checked')); //false
//객체의 Property 수정시 prop 사용
var obj = {};
obj.value = "방갑다.";
console.log(obj.value);
$(obj).prop('value', '수정되었어요');
console.log(obj.value);
console.log($(obj).prop('value'));
});
</script>
<title>attr, prop</title>
</head>
<body>
<input type="checkbox" checked="checked" />
<input type="checkbox" />
<input type="checkbox" />
<input type="checkbox" checked="checked" />
</body>
</html>