HTML <data> 요소는 주어진 콘텐츠를 기계가 읽을 수 있는 해석본과 연결합니다. 콘텐츠가 시간 혹은 날짜 관련 정보라면 대신 <time> 요소를 사용하세요.
<p>New Products:</p>
<ul>
<li><data value="398">Mini Ketchup</data></li>
<li><data value="399">Jumbo Ketchup</data></li>
<li><data value="400">Mega Jumbo Ketchup</data></li>
</ul>
data:hover::after {
content: " (ID " attr(value) ")";
font-size: 0.7em;
}
| 콘텐츠 카테고리 | 플로우 콘텐츠, 구문 콘텐츠, 뚜렷한 콘텐츠. |
|---|---|
| 가능한 콘텐츠 | 구문 콘텐츠. |
| 태그 생략 | 불가능, 시작과 끝에 태그를 추가하는 것은 필수입니다. |
| 가능한 부모 요소 | 구문 콘텐츠를 허용하는 모든 요소. |
| 가능한 ARIA 역할 | 모두 |
| DOM 인터페이스 | `HTMLDataElement` |
특성
이 요소는 전역 특성을 포함합니다
value- : 기계가 읽을 수 있는 형태의 콘텐츠 해석본.
예제
밑의 예제는 상품의 이름을 표시하면서, 각각의 상품 번호도 연결합니다.
<p>새로운 상품들</p>
<ul>
<li><data value="398">미니 케찹</data></li>
<li><data value="399">점보 케찹</data></li>
<li><data value="400">메가 점보 케찹</data></li>
</ul>
같이 보기
- HTML
<time>요소.