JS change/focus, attr/prop 차이, Masonry와 smooth scrollbar(라이브러리)

·2026년 1월 27일

코딩

목록 보기
35/48

change : 해당 값이 변경됐을 때

$('.form-1__checkbox-all').change(function() {
	console.log(this.checked)
})

console에 checkbox 선택됐을 때 true, 해제됐을 때 false값이 나옴

focus : 마우스 클릭했을 때

현재 사용자의 입력을 받고 있는 대상이 누구인지

f12로 focuse 되었는지 확인가능


attr (attribute) : 정보

: HTML에 적힌 초기값

$('input').attr('checked');

-> "checked" 글자 그대로

  • id, class, href, src 같은 정보를 얻고 싶을 때
#('a').attr('href','google.com');

prop (property) : 상태

: 현재 DOM에 실제 상태

$('input').prop('checked');

-> "true" or "false" 체크했다면 true, 아니라면 false

  • checked, disabled, selected 확인
$('input').prop('disabled',true);

masonry (라이브러리)

: 배치를 자동으로 해줌 (카드 ui에 용이 ex-핀터레스트)
CSS에 반응형은 맞춰두고, 레이아웃값을 masonry에게 맡김

smooth scrollbar

: 스크롤바를 자연스럽게 만들어줌



!! 라이브러리를 여러개 사용할 때, 서로 호환이 되는지 확인해야함


0개의 댓글