setTimeout 函数后页面刷新并删除 body 属性

Question

下面的代码设置了 2s 的超时时间来调用 document.write 函数。一旦 document.write() 被调用，它就会自动刷新（正如我所想的那样）页面。不仅如此，它还删除了 bgcolor 和 body 的颜色属性！

// JS
let name = prompt('Enter username: ', 'Captain Anonymous');

function sayHello() {
    document.write('Hello ' + name + '!');
}
setTimeout(sayHello, 2000);

// HTML
<html>
<head><title>Page Title</title></head>
<body bgcolor='blue' color='white'></body>
</html>

我希望这段代码只是简单地在文档中写入消息。我怎样才能做到这一点？

Answer 1

document.write 仅在文档加载时将文本插入到文档中。页面加载后，它将 overwrite your page。当调用 setTimeout 时，页面已经加载。

您可能想要做的是在您的页面中为您的消息放置一个位置。

试试这个。在页面正文中添加 div 标签。

<div id="mytext">

然后把你的 sayHello 函数改成这个

function sayHello() {
    document.getElementById("mytext").innerText = 'Hello ' + name + '!';
}

setTimeout 函数后页面刷新并删除 body 属性

Page refreshes after setTimeout function and removes body attribute

html

javascript

document.write

settimeout