js如何使用document.write()

54次阅读
没有评论

JavaScript的document.write()方法可以将指定的字符串内容写入到HTML文档中。

下面是一个简单的示例,演示如何使用document.write()方法输出一个简单的HTML页面:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Using document.write()</title>
</head>
<body>
  <script>
    // 使用 document.write() 输出文本
    document.write('<h1>Hello, world!</h1>');
    document.write('<p>This is a simple example of using document.write() method.</p>');
  </script>
</body>
</html>

在这个示例中,我们在HTML页面中插入了一个<script>标签,并在其中使用document.write()方法输出了一些文本。当浏览器解析这个页面时,JavaScript代码会执行,将文本插入到HTML文档中。

需要注意的是,document.write()方法只能在页面加载时使用。如果在页面加载完毕后再调用这个方法,它会覆盖整个文档。因此,在大多数情况下,我们建议使用其他方法来动态地更新HTML内容,例如DOM操作或者使用框架和库。

另外需要注意的是,使用document.write()方法输出的文本会被插入到当前文档的末尾。如果你想在页面中的指定位置插入文本,可以将要插入的文本放到一个字符串变量中,然后将这个变量的值赋给指定元素的innerHTML属性。例如:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Using document.write() to insert content</title>
</head>
<body>
  <h1 id="title">Old Title</h1>

  <script>
    var newTitle = '<h1>New Title</h1>';
    document.getElementById('title').innerHTML = newTitle;
  </script>
</body>
</html>

在这个示例中,我们首先在HTML文档中定义了一个<h1>元素,并给它设置了一个id属性。然后,在JavaScript中,我们将要插入的新文本保存在了一个变量中,并通过document.getElementById()方法获取到了这个<h1>元素,并将新的文本赋给了它的innerHTML属性。最终,这个元素的文本内容就被更新成了“New Title”。

正文完
 
评论(没有评论)