Computer >> 컴퓨터 >  >> 프로그램 작성 >> HTML

HTML DOM 본문 속성

<시간/>

HTML 요소와 관련된 HTML DOM 본문 속성은 요소의 속성 값을 설정하거나 반환하는 데 사용됩니다. 요소를 반환합니다. 요소 내부의 내용을 변경하는 데 사용할 수 있습니다. 이 속성은 요소 내부에 있는 자식 요소 콘텐츠를 덮어쓸 수 있습니다.

구문

다음은 −

의 구문입니다.

본문 속성 설정 -

document.body = New_Content

여기에서 New_Content는 요소의 새 콘텐츠입니다.

예시

HTML DOM Body 속성에 대한 예를 살펴보겠습니다 -

<!DOCTYPE html>
<html>
<body>
<h2>Sample HEADING</h2>
<p>Click the below button to overwrite child content</p>
<button onclick="OverWrite()">Overwrite Content</button>
<p>A sample paragraph</p>
<script>
   function OverWrite() {
      document.body.innerHTML = "All the content inside the body tag is overwritten";
   }
</script>
</body>
</html>

출력

이것은 다음과 같은 출력을 생성합니다 -

HTML DOM 본문 속성

"콘텐츠 덮어쓰기" 클릭 시 -

HTML DOM 본문 속성

위의 예에서 -

요소 내부에는

요소, 두 개의

요소 및 버튼과 같은 다양한 요소가 있습니다. “Overwrite Content” 버튼은 OverWrite() 함수를 실행합니다.

<button>Overwrite Content</button>

OverWrite() 함수는 문서 본문의 innerHtml을 가져오고 텍스트를 "본문 태그 내부의 모든 내용을 덮어씁니다"로 변경합니다. 이것은 기본적으로 모든 요소를 ​​제거하고 텍스트만 표시되도록 본문 내부의 모든 내용을 덮어씁니다.

function OverWrite() {
   document.body.innerHTML = "All the content inside the body tag is overwritten";
}