Simon Willison씨가 data- 속성을 통해 HTML 엘리먼트에 필요한 속성을 추가할 수 있는 방법으로 논의되는 HTML 5 스펙의 일부에 대해 글을 썼습니다.
예를 들어, 게임 상의의 우주선이라고 하면 이렇게 표현할 수 있습니다:
[code:Xml]
<div class="spaceship" data-id="92432"
data-weapons="laser 2" data-shields="50%"
data-x="30" data-y="10" data-z="90">
<button class="fire"
onclick="spaceships[this.parentNode.dataset.id].fire()">
Fire
</button>
</div>
<div class="spaceship" data-id="92432"
data-weapons="laser 2" data-shields="50%"
data-x="30" data-y="10" data-z="90">
<button class="fire"
onclick="spaceships[this.parentNode.dataset.id].fire()">
Fire
</button>
</div>
Simon 씨는 "이것은 설정값을 HTML 컨텐트로 저장할 장소가 마땅찮은 겸손한(unobtrusive) JavaScript에서 매우 유용하게 사용할 수 있습니다. 이는 또한 Dojo가 Dojo 위젯임을 표시하기 위해 커스텀 속성을 추가할 수 있는 승인된 방법을 가지게 됐다는 것을 의미합니다." 라는 사실을 지적했습니다.
from Embed your data- in HTML 5 on Ajaxian
'[IT] Web Tech' 카테고리의 다른 글
| TPHP : JavaScript로 만든 명령줄 형태의 시작페이지 (0) | 2008.04.26 |
|---|---|
| 맥용 WaveMaker Visual Ajax Studio (0) | 2008.04.26 |
| 오프라인 웹 응용프로그램을 데스크탑, 그 너머로 (0) | 2008.04.26 |
| GWT-Ext 야, Ext-GWT야? (0) | 2008.04.26 |
| HTML5에서의 data-* 속성 (0) | 2008.04.26 |
| Timeframe: Prototype으로 만든 날짜범위 선택 컴포넌트 (0) | 2008.04.26 |
| OraoWeb: Quicktime + JavaScript (0) | 2008.04.26 |
| 디커플링을 이용해서 응용프로그램 모듈이 서로 통신하게 만들기 (0) | 2008.04.26 |
| Ajax를 사용하지 않는 Google API - 검색, 피드, 번역 (1) | 2008.04.26 |
댓글을 달아 주세요