Video, Audio 태그 LoadedMetaData 에서 얻을수 있는 정보
2025. 6. 8. 16:49ㆍ프로그램/Javascript
loadedmetadata 이벤트가 발생한 후에는 HTMLMediaElement 객체의 다음 속성들을 통해 미디어에 대한 정보를 얻을 수 있습니다:
- duration: 🎧 비디오 또는 오디오의 총 재생 시간을 초 단위로 반환합니다. (예: 120.5 for 2분 30초 500밀리초).
- videoWidth: 🎥 비디오 트랙의 픽셀 단위 너비를 반환합니다. 오디오 요소에는 해당되지 않습니다.
- videoHeight: 🎥 비디오 트랙의 픽셀 단위 높이를 반환합니다. 오디오 요소에는 해당되지 않습니다.
- clientWidth: 📏 요소의 가시적인 너비를 픽셀 단위로 반환합니다. 이는 CSS에 의해 결정되는 실제 요소의 너비입니다.
- clientHeight: 📏 요소의 가시적인 높이를 픽셀 단위로 반환합니다. 이는 CSS에 의해 결정되는 실제 요소의 높이입니다.
- offsetWidth: 📏 요소의 레이아웃 너비를 반환합니다. 이는 clientWidth와 패딩, 스크롤바, 테두리까지 포함하는 값입니다.
- offsetHeight: 📏 요소의 레이아웃 높이를 반환합니다. 이는 clientHeight와 패딩, 스크롤바, 테두리까지 포함하는 값입니다.
- currentTime: ⏳ 현재 재생 헤드의 위치를 초 단위로 반환합니다. loadedmetadata 시점에는 일반적으로 0입니다.
- initialTime: 미디어의 시작 시간을 초 단위로 반환합니다. 대부분 0입니다.
- paused: ▶️ 미디어가 일시 중지되었는지 여부를 나타내는 불리언 값(true/false)을 반환합니다. loadedmetadata 시점에는 보통 true입니다.
- ended: ⏹️ 미디어 재생이 끝났는지 여부를 나타내는 불리언 값(true/false)을 반환합니다. loadedmetadata 시점에는 보통 false입니다.
- loop: 🔁 미디어가 반복 재생 설정되었는지 여부를 나타내는 불리언 값(true/false)을 반환합니다.
- muted: 🔇 미디어가 음소거 설정되었는지 여부를 나타내는 불리언 값(true/false)을 반환합니다.
- volume: 🔊 미디어의 볼륨 레벨을 0.0(가장 작음)에서 1.0(가장 큼) 사이의 값으로 반환합니다.
- currentSrc: 📄 현재 로드된 미디어 리소스의 URL을 반환합니다.
- readyState: ℹ️ 미디어의 로드 상태를 나타내는 숫자 값을 반환합니다. loadedmetadata 시점에는 보통 HTMLMediaElement.HAVE_METADATA(1) 또는 그 이상입니다.
- networkState: 🌐 미디어의 네트워크 상태를 나타내는 숫자 값을 반환합니다. (예: HTMLMediaElement.NETWORK_IDLE, HTMLMediaElement.NETWORK_LOADING 등)
- textTracks: 📝 미디어와 관련된 텍스트 트랙(예: 자막, 캡션) 목록을 반환합니다.
'프로그램 > Javascript' 카테고리의 다른 글
| jquery radio 값 가져오기 (0) | 2025.06.04 |
|---|---|
| 구조화된 데이터 (Schema Markup) - VideoObject 설정 방법 (0) | 2025.06.04 |
| JavaScript 로 동영상 해상도 확인후 서버로 전송하기 (0) | 2025.06.04 |
| JavaScript Beautifier (0) | 2025.05.21 |