계층 탐색

• Common by tag

  태그에 따라 공통으로 사용하는 속성

  • autoplay

    비디오, 오디오 미디어에 대한 자동 재생을 설정한다.

  • controls

    비디오나 오디오를 제어하기 위한 UI를 표시한다.

  • crossorigin

    교차출처(CORS) 정책에 따라 리소스를 가져올지를 나타낸다.

  • height

    요소의 세로 크기를 픽셀(pixels)을 기본 단위로 해서 지정한다.

  • href

    하이퍼링크를 위한 연결 URL을 설정한다.

  • loop

    비디오나 오디오 재생이 끝나면 처음으로 돌아가서 다시 재생한다.

  • name

    요소를 식별할 수 있는 값을 지정한다.

  • preload

    미디오 요소(video, audio)로 사용되는 리소스에 대한 네트워크 작업 방식을 지정한다.

  • src

    사용할 리소스의 경로를 설정한다.

  • target

    하이퍼링크 또는 기타 연결을 설정하는 경우 연결된 리소스를 여는 방식을 지정한다.

  • width

    요소의 가로 크기를 픽셀(pixels)을 기본 단위로 해서 지정한다.

• Form

  • Button Element

    • type

      <button> 요소에서 입력 방식과 형태를 결정짓는 값을 가질 수 있다.

  • Input Element

    • type

      <input>요소에서 입력 방식과 형태를 결정짓는 값을 가질 수 있다.

• Globals

  대부분의 모든 태그에서 공통으로 사용하는 속성

  • accesskey

    유저 에이전트가 요소를 활성화하거나 포커스를 맞추는 키보드 단축키를 생성하기 위한 가이드로 사용된다.

  • autocapitalize

    사용자가 입력 또는 편집시 텍스트 입력이 자동으로 대문자로 표시되는지 여부와 방법을 제어한다.

  • autofocus

    페이지가 로드되는 즉시 요소가 포커스를 갖는다. 입력 요소의 경우 입력 대기 상태가 된다.

  • class

    요소를 식별하는 중복될 수 있는 값을 지정한다.

  • contenteditable

    요소의 편집에 대한 여부와 방식을 지정한다.

  • data-*

    사용자 데이터를 지정하는 특별한 속성이다. DOM으로 데이터를 받아 자바스크립트 로직에 사용할 수 있다.

  • dir

    요소의 텍스트 콘텐츠의 방향을 지정한다.

  • draggable

    요소의 드래그 가능 여부를 제어한다.

  • enterkeyhint

    가상 키보드의 엔터(enter)키에 대해 표시할 작업 레이블(또는 아이콘)을 지정하는 열거형 애트리뷰트이다.

  • exportparts

    쉐도우(shadow) 트리에 존재하는 요소를 선택하고 스타일을 지정할 수 있는 식별값으로 사용된다.

  • hidden

    웹브라우저가 요소의 콘텐츠를 출력하지 않아야 함을 나타낸다.

  • id

    요소를 식별할 수 있는 고유 값을 설정한다.

  • inert

    트리 자손을 포함한 모든 요소들이 비활성된다.

  • inputmode

    콘텐츠를 입력하는 사용자에게 가장 유용한 입력 메커니즘의 종류를 지정하는 열거형 애트리뷰트이다.

  • is

    표준 HTML 요소를 사용자 정의 내장 요소처럼 작동하도록 지정한다. 

  • itemid

    고유한 전역 식별자 형식으로 마이크로데이터를 제공한다.

  • itemprop

    마이크로데이터(microdata)를 제공하기 위한 데이터의 이름을 정의한다.

  • itemref

    itemscope가 정의된 요소의 하위 데이터가 아닌 경우 원하는 항목에 연결을 정의할 수 있다.

  • itemscope

    마이크로데이터(microdata)의 범위에 해당하는 요소에게 선언한다.

  • itemtype

    itemscope 애트리뷰트가 정의된 데이터 구조에서 itemprop 애트리뷰트를 정의하는 데 사용되는 어휘의 URL을 지정한다.

  • lang

    요소의 콘텐츠에 대한 기본 언어를 지정한다. 유효한 BCP 47 언어 태그이거나 빈 문자열이어야 한다. 빈 문자열로 지정하면 기본 언어를 알 수 없음을 나타낸다.

  • nonce

    콘텐츠 보안 정책에서 주어진 요소에 대해 주어진 가져오기를 진행할 수 있는지 여부를 결정하는 데 사용할 수 있는 암호화 nonce(한번 사용하는 암호화 임시값)를 정의한다.

  • part

    쉐도우 트리의 모든 요소를 대상으로 사용 가능하며 쉐도우 트리 외부에 요소를 노출하는 데 사용된다.

  • popover

    요소가 명시적으로 표시될 때 까지 숨겨진 상태가 된다.

  • slot

    쉐도우(shadow) 트리(tree)에서 정의된 슬롯(slot)을 요소에 할당한다.

  • spellcheck

    요소의 콘텐츠에 대한 철자 오류 검사 여부를 지정한다.

  • style

    요소에 한정된 스타일을 빠르게 적용할 수 있다.

  • tabindex

    요소에 순차적으로 포커스(focus)를 허용하거나 방지할 수 있으며 순차적(또는 역순) 포커스(focus) 탐색을 위한 상대적 순서를 설정할 수 있다.

  • title

    요소에 대한 필요한 정보를 나타내는 텍스트이며 마우스 포인터를 올리면 말풍선으로 내용을 출력한다.

  • translate

    페이지가 현지화될 때 요소의 애트리뷰트 값과 하위 텍스트를 번역할지에 대한 여부를 지정한다.

• Media

  • type

     <embed>, <link>, <object>, <script>, <style> 요소에서 '유형/타입' 형식 또는 지정된 키워드로 지정한다.

• Private properties

  태그에 따른 전용 속성

  • async

    자바스크립트가 웹 문서에 포함이 되지만 웹 문서와는 완전하게 독립적으로 동작하도록 한다.

  • defer

    웹브라우저가 스크립트 문서를 분석한 후 DOMContentLoaded가 발생되기 이전에 실행하도록 한다.

  • for

    레이블에 연결될 요소의 id를 설정한다.

  • form

    레이블과 연관된 <form> 요소의 id를 설정한다. 따라서 레이블의 위치는 <form> 요소의 하위일 필요는 없다.

  • nomodule

    ES6의 module을 지원하는 웹브라우저에서 실행하지 않을 스크립트임을 나타낸다.

  • poster

    비디오가 재생되기 전 보여질 이미지를 명시적으로 지정한다.