htmldivelement

<div id="exampleDiv" class="container">
  <h1>Hello, World!</h1>
  <p>This is an example of a HTML div element.</p>
</div>

<script>
  // 获取 div 元素
  const divElement = document.getElementById('exampleDiv');

  // 修改 div 的样式
  divElement.style.border = '1px solid black';
  divElement.style.padding = '10px';

  // 向 div 中添加新的内容
  const newParagraph = document.createElement('p');
  newParagraph.textContent = 'This paragraph was added dynamically.';
  divElement.appendChild(newParagraph);
</script>

解释说明：

• <div> 是一个通用的容器元素，用于对页面上的内容进行分组和布局。
• id="exampleDiv" 和 class="container" 是用来标识和样式化这个 div 元素的属性。
• 使用 document.getElementById 可以获取指定 ID 的元素，并对其进行操作。
• divElement.style 用于修改元素的内联样式。
• document.createElement 和 appendChild 用于动态创建和添加新的子元素到现有的 div 中。