javascript - 为什么 document.write 不能处理带有 HTML 标签的变量？

Question

document.write在变量上工作正常。document.write在带有 HTML 标签的字符串上也可以正常工作。但是，当尝试document.write在带有 HTML 标记的 JS 变量上使用时，该程序不起作用。

这是我的代码：

var Foo = "Foo Variable"
document.write(Foo)
document.write("<h1>Foo</h1>");
document.write(<h1>Foo</h1>)

前三行工作正常，但最后一行不显示任何内容。我相信这是一个语法错误，但无论我尝试什么，它似乎仍然不起作用。我试过只将 HTML 标签放在引号中，但无济于事。有什么方法可以让我将字符串变量表示为标题？换句话说，我希望页面将“Foo 变量”作为 h1 标题显示。

提前致谢。

标签： javascripthtmltagsdocument.write

Answer 1

是的，这是一个语法错误。如果要在标签Foo内输出变量的内容，则h1需要使用模板文字（ES2015+）或字符串连接：

// Template literal (ES2015+)
var Foo = "Foo Variable";
document.write(`<h1>${Foo}</h1>`);

或者

// String concatenation
var Foo = "Foo Variable";
document.write("<h1>" + Foo + "</h1>");

但是document.write，在现代网络编程中几乎没有位置。相反，使用DOM添加或更新元素。