[HTML]data 속성

부트스트랩 사용시 버전이슈로 애먹을때 알게된 data속성 잘쓰면 유용할것같다.

 

•  data-* 속성은 표준이 아닌 속성이나 추가적인 DOM 속성
• 어느 요소에나 data-로 시작하는 속성은 무엇이든 사용할 수 있다

 

 

1. 자바스크립트에서 사용

 

      1-1.  getAtttribute(), setAttribute 로 사용

      1-2.  dataset 객체로 사용

              - dataset 객체로 사용시 camelCase 표기법으로 바꿔써야한다.

              - 낮은버전의 브라우저에서는 인식하지 않을 수 있다.

var article = document.getElementById('electriccars');

article.dataset.columns // "3"
article.dataset.indexNumber // "12314"
article.dataset.parent // "cars"

 

 

2. 제이쿼리로 사용한 예제 

 

//예제1
var num = $(this).data('id');
  
//예제2
$num_next.find('.btn-register').addClass('reply')
				.attr('data-ref',ref).attr('data-lev',lev).attr('data-seq',seq).text('답글완료');

 

 

참고 )

전역 특성 - HTML: Hypertext Markup Language | MDN