자바스크립트 체크박스의 .attr(), .prop() 차이는 뭘까?

참고 : http://javascriptandjquerydev.blogspot.kr/2012/07/attr-prop.html

 

체크박스 제어할 때 늘 attr, prop 차이가 궁금했는데 위 사이트에서 설명이 잘 되어 있다.

 

//하나더 예를 들어보겠습니다. 체크박스의 checked의 대하여 입니다.
<checkbox id="private" type="checkbox" checked /> 
//체크박스의 checked의 값을 확인합니다.
 
var $checkbox = $('#private'); 
alert($checkbox.attr('checked'));  // checked속성의 값을 표시 → "checked"
alert($checkbox.prop('checked'));  // checked프로파티값을 표시 → true
 
//또 화면의 체크박스를 클릭하여 체크를 해제해보겠습니다.
//•.attr() → "checked"
//•.prop() → false
//.attr()의 경우는 변하지않습니다. 체크가 되어있는지 판단을 할경우 .prop()을 사용할 필요가 있습니다.

 

체크박스를 전체 선택하고 해제하는 스크립트를 쓰려면 .prop()로 true/false 를 제어하자.