HTML data-* 속성 사용 패턴과 예시
개요 HTML5의 data-* 속성은 마크업에 보이지 않는 커스텀 데이터를 담기 위한 전역 속성 UI와 스크립트 사이 값 전달, 기능 감지 플래그, 간단한 지역화 메타데이터 등에 유용 DOM에서는 element.dataset으로 접근해 읽기/쓰기 가능 핵심 개념 속성명 규칙: data- 접두사 + 소문자 케밥케이스 사용 접근 규칙: data-foo-bar → dataset.fooBar 로 매핑 값 타입: 문자열 저장, 필요 시 직접 직렬화/파싱 처리 필요 보안 유의: 민감정보나 토큰 저장 금지, 노출 전제 데이터만 저장 표준 속성과 역할 혼동 금지, 의미적 데이터는 적절한 속성이나 요소 사용 권장 ...