参考资料

  1. HTML DOM 返回image的name
  2. HTML DOM 返回一个表单acceptCharset属性的值
  3. HTML DOM 返回和设置链接的charset属性实例
  4. HTML DOM 对image排版
  5. HTML DOM 提交表单
  6. HTML DOM 返回和设置链接的hreflang属性实例
  7. HTML DOM 返回加载的当前文档的URL实例
  8. HTML DOM添加表格行中的单元格

HTML DOM write() 和 writeln()的不同实例

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)替代这些方法