如何在html标记的innerhtml中使用JavaScript变量（创建一个带有变量名的列表项）

Question

这是我试过的

let somejsvar = 'hello world'
document.getElementById('id_element_in_html').innerHTML = '<li> somejsvar </li>';

我的输出：

>>> - somejsvar

期望的输出：

>>> - hello world

Answer 1

只需通过添加$ {Your Variable}将somejsvar从硬编码更改为变量本身，并使用`来包装整个字符串

document.getElementById('id_element_in_html').innerHTML = `<li> ${somejsvar}</li>`;

Answer 2

你需要打破html

document.getElementById('id_element_in_html').innerHTML = '<li>' + somejsvar + ' </li>';

Answer 3

你必须连接变量值

let somejsvar = 'hello world'
document.getElementById('id_element_in_html').innerHTML = '<li>' + somejsvar + '</li>';

Answer 4

这是因为您尝试将innerHTML的值设置为纯文本'<li> somejsvar </li>'。

相反，你应该使用JS连接：

document.getElementById('id_element_in_html').innerHTML = '<li> ' + somejsvar + ' </li>';