JavaScript의 document.embeds 속성을 사용하면 현재 HTML 문서에 포함된 <embed> 태그의 개수를 손쉽게 확인할 수 있습니다. 이 속성은 문서 내 모든 임베드 요소를 담고 있는 컬렉션(HTMLCollection)을 반환하며, length 프로퍼티를 통해 해당 개수에 접근할 수 있습니다.
document.embeds란 무엇인가?
document.embeds는 읽기 전용(read-only) 속성으로, 웹 페이지 안에서 사용된 모든 <embed> 요소의 목록을 반환합니다. 외부 콘텐츠(멀티미디어 파일, 플러그인 기반 리소스 등)를 페이지에 삽입할 때 활용되는 <embed> 태그가 몇 개나 있는지 파악해야 하는 상황에서 유용하게 사용됩니다.
사용 예제
아래 코드를 실행하면 문서에 포함된 <embed> 태그의 개수를 화면에 출력할 수 있습니다.
<!DOCTYPE html>
<html>
<head>
<title>JavaScript 예제</title>
</head>
<body>
<embed src = "/html/yourfile.mid" width = "250" height = "100" />
<script>
var num = document.embeds.length;
document.write("<br>embed 태그 개수: " + num);
</script>
</body>
</html>코드 설명
위 예제에서는 하나의 <embed> 태그로 미디어 파일을 페이지에 삽입한 뒤, 스크립트 부분에서 document.embeds.length를 호출하여 임베드 요소의 총 개수를 구합니다. 이 경우 결과값으로 1이 출력됩니다.
참고 사항
document.write()는 간단한 데모에는 편리하지만, 실제 서비스 환경에서는 DOM 조작 방식(textContent, innerHTML 등)을 사용하는 것이 권장됩니다. 또한 최신 웹 표준에서는 <video>, <audio>, <iframe> 등의 태그 사용이 더 일반적이므로, 상황에 맞는 요소를 선택하는 것이 좋습니다.