参考资料

  1. HTML DOM获得有下拉列表的表单的ID
  2. HTML DOM 创建一个链接指向一个低分辨率的image
  3. HTML DOM 被按下的键盘键的keycode?
  4. HTML DOM 节点列表长度
  5. HTML DOM 根节点childNodes 和 nodeValue
  6. HTML DOM改变表格的cellpadding和cellspacing
  7. HTML DOM 返回一个锚的名字 实例
  8. HTML DOM 返回页面上所有相对URL的基URL 实例

HTML DOM write() 和 writeln() 方法

基本介绍

document.write()document.writeln() 都是 JavaScript 中用于向 HTML 文档写入内容的方法。

主要区别

方法描述是否添加换行符
write()向文档写入内容
writeln()向文档写入内容并在末尾添加换行符(\n)

标签和用法

这两个方法都属于 document 对象的方法,语法如下:

document.write(content);
document.writeln(content);

功能

  • 动态生成 HTML 内容

  • 在页面加载过程中插入内容

  • 可以包含 HTML 标签

实例

基本使用

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

带 CSS 扩展的实例

<script>
document.write('<div style="color: blue; font-size: 20px;">Styled content</div>');
document.writeln('<p style="background-color: #f0f0f0; padding: 10px;">Styled paragraph</p>');
</script>

使用外部样式

<style>
.highlight {
  background-color: yellow;
  font-weight: bold;
}
</style>

<script>
document.writeln('<span class="highlight">Highlighted text</span>');
document.write('<div class="highlight">Another highlighted element</div>');
</script>

注意事项

  1. 如果在页面加载完成后调用这些方法,会覆盖整个文档

  2. writeln() 的换行符只在 <pre> 标签中可见

  3. 现代开发中推荐使用 DOM 操作方法(如 createElementappendChild)替代这些方法