HTML DOM Document body 속성

정의와 사용법

body 속성은 문서의 <body> 요소를 설정이나 반환합니다。

주의사항：설정 body 속성은 문서 <body> 내의 모든 요소를 덮어쓰습니다。

주의

document.body 와 document.documentElement 차이점은：

  • document.body는 <body> 요소를 반환합니다
  • document.documentElement은 <html> 요소를 반환합니다

또한 참조하세요：

Document documentElement 속성

HTML <body> 태그

HTML DOM Body 객체

예제

예제 1

문서의 HTML 내용을 가져옵니다：

const myBody = document.body.innerHTML;

직접 시도해 보세요

예제 2

문서의 배경색 변경：

document.body.style.backgroundColor = "yellow";

직접 시도해 보세요

예제 3

문서의 <body>를 변경합니다(모든 기존 내용을 덮어쓰기)：

document.body.innerHTML = "Some new HTML content";

직접 시도해 보세요

예제 4

<p> 요소를 생성하고 문서의 본문에 추가하세요：

const para = document.createElement("p");
const node = document.createTextNode("This is a paragraph.");
para.appendChild(node);
document.body.appendChild(para);

직접 시도해 보세요

문법

body 속성 반환：

document.body

body 속성 설정：

document.body = newContent

속성 값

값 설명
newContent <body> 요소의 새 내용。

반환 값

타입 설명
객체 문서의 body 요소。

브라우저 지원

document.body DOM Level 1 (1998) 기능입니다。

모든 브라우저가 완전히 지원합니다：

크롬 IE 에지 파이어폭스 사파리 오페라
크롬 IE 에지 파이어폭스 사파리 오페라
지원 9-11 지원 지원 지원 지원