전역속성 - LANG, DATA

1. lang

요소의 언어(ISO 639-1)를 지정.

<p lang="en">This paragraph is English</p>
<p lang="ko">이 단락은 한글입니다.</p>
<p lang="fr">Ce paragraphe est défini en français.</p>

 

 

2. data-*

사용자 정의 데이터 속성을 지정.
HTML에 JavaScript에서 이용할 수 있는 데이터(정보)를 저장하는 용도로 사용.

<!-- data-custom-data-attributes -->
<div id="me" data-my-name="Heropy" data-my-age="851">Heropy</div>
<!-- data인데 my-name이고 이름은 Heropy이다.  
     data인데 my-age이고 이름은 "851" 이다-->

 

이렇게 작성하고 난 후에 다음과 같이 javascript에서 이용 할 수 있다.

// dataset.customDataAttributes
const $me = document.getElementById('me');
console.log($me.dataset.myName); // "Heropy"
console.log($me.dataset.myAge); // "851"

 

출력된 창과 자바스크립트

이와같이 html에 담겨있는 특정한 데이터들을 나중에 자바스크립트에서 쓸 수 있게 하기 위해서 "data-" 속성을 많이 이용한다.