参考资料

  1. HTML DOM 用指定的ID弹出一个元素的innerHTML实例
  2. HTML DOM一个单元格的innerHTML
  3. HTML DOM将下拉列表变成多行列表
  4. HTML DOM 节点
  5. HTML DOM 返回文档中的所有cookies的名称/值对 实例
  6. HTML DOM 用指定的Name弹出元素的数量实例
  7. HTML DOM 返回加载的文档的服务器域名 实例
  8. HTML DOM 返回一个链接的type属性的值实例

HTML DOM document.write() 方法

  1. 基本介绍

  • document.write() 是 JavaScript 中用于向 HTML 文档输出内容的方法

  • 可以直接写入 HTML 标签和文本内容

  • 通常在页面加载过程中使用

  1. 语法
    document.write(content);

  2. 参数说明

  • content: 要写入文档的 HTML 内容（字符串）

  1. 基本用法示例

<script>
document.write("<h1>Hello World</h1>");
document.write("<p>This is a paragraph.</p>");
</script>

  1. 动态内容示例

<script>
var name = "John";
document.write("<p>Welcome, " + name + "!</p>");
</script>

  1. 结合CSS样式

<script>
document.write("<p style='color:blue;font-size:20px;'>Styled text</p>");
</script>

  1. 使用CSS类

<style>
.highlight {
  background-color: yellow;
  padding: 5px;
}
</style>

<script>
document.write("<span class='highlight'>Highlighted text</span>");
</script>

  1. 注意事项

  • 如果在文档加载完成后调用，会覆盖整个文档

  • 不推荐在现代网页开发中频繁使用

  • 更适合用于简单的测试和演示

  1. 替代方法
    现代开发推荐使用：

  • innerHTML

  • textContent

  • DOM 操作方法（createElement, appendChild等）

  1. 完整示例

<!DOCTYPE html>
<html>
<head>
<style>
  .output {
    border: 1px solid #ccc;
    padding: 10px;
    margin: 10px 0;
  }
</style>
</head>
<body>

<script>
document.write("<div class='output'>");
document.write("<h2>Document.write() Demo</h2>");
document.write("<p>Current date: " + new Date() + "</p>");
document.write("</div>");
</script>

</body>
</html>
TAG：文档内容方法示例基本现代直接标签文本页面