HTML DOM Body 对象-FunTeaLearn Online Web Tutorials

HTML DOM Body 对象

在 Web 开发中，<body> 元素是 HTML 文档中最重要的部分之一。它包含了页面上所有可见的内容，如文本、图像、链接等。在 JavaScript 中，我们可以通过 DOM（文档对象模型）来操作 <body> 元素。

要获取 <body> 元素，我们可以使用 document.body 属性。这个属性返回文档中的 <body> 元素，让我们可以对其进行操作。

const bodyElement = document.body;
console.log(bodyElement); // <body>...</body>

我们可以使用 JavaScript 来修改 <body> 元素的样式，比如更改背景颜色、字体大小等。

document.body.style.backgroundColor = 'lightblue';
document.body.style.color = 'white';
document.body.style.fontSize = '16px';

我们可以使用 JavaScript 来向 <body> 元素中添加子元素，比如添加一个新的 <div> 元素。

const newDiv = document.createElement('div');
newDiv.textContent = 'Hello, World!';
document.body.appendChild(newDiv);

我们可以为 <body> 元素添加事件监听器，以便在特定事件发生时执行相应的操作。

document.body.addEventListener('click', function() {
  console.log('Body clicked!');
});

通过以上方法，我们可以灵活地操作 <body> 元素，实现丰富多彩的网页交互效果。

属性	描述	W3C
aLink	设置或者返回主体元素的 alink 属性。	Yes
background	设置或者返回body元素的 background 属性。	Yes
bgColor	设置或者返回body元素的 bgColor 属性。	Yes
link	设置或者返回主体元素的 link 属性。	Yes
text	设置或者返回主体元素的 text 属性。	Yes
vLink	设置或者返回主体元素的 vLink 属性。	Yes

事件	描述	W3C
onload	脚本在页面完全载入后会被立即执行。	Yes

Feed
back

HTML DOM Body 对象