如何使用 JavaScript 创建空白 space 作为按钮值

Question

我在下面有这个脚本。 ' '在将它用作按钮标签时不作为 space 工作：

var space = '&nbsp;';
var button = document.createElement("button");
mytext = "A" + space + space + space + space + "A";
button.textContent = mytext;
document.getElementById("buttonarea").appendChild(button);
document.getElementById("textarea").innerHTML = mytext;

<!DOCTYPE html>

<head>
</head>

<body>
    <div id="textarea"></div>
    <div id="buttonarea"></div>
</body>

</html>

Answer 1

像这样将   转换成它的 Unicode 格式

var space = '\u00A0';

这应该有效。

这是因为 innerHTML DOM 方法将 &、> 等字符转义到其 HTML 实体中，这就是为什么   不行 https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML

Answer 2

您正在使用 HTML 个编码字符，因此您需要将它们呈现为 HTML。

var space = '&nbsp;';
var button = document.createElement("button");
mytext = "A" + space + space + space + space + "A";
button.innerHTML = mytext;
document.getElementById("buttonarea").appendChild(button);
document.getElementById("textarea").innerHTML = mytext;

<!DOCTYPE html>

<head>
</head>

<body>
    <div id="textarea"></div>
    <div id="buttonarea"></div>
</body>

</html>

Answer 3

使用等价于非中断的 unicode space:

var space = '\u00A0';
var button = document.createElement("button");
mytext = `A${space}${space}${space}${space}A`;
button.textContent = mytext;
document.getElementById("buttonarea").appendChild(button);
document.getElementById("textarea").innerHTML = mytext;

<!DOCTYPE html>

<head>
</head>

<body>
    <div id="textarea"></div>
    <div id="buttonarea"></div>
</body>

</html>

Answer 4

您可以简单地将 textContent 替换为 innerHTML，如下所示：

var space = "&nbsp;";
var button = document.createElement("button");
mytext = "A" + space + space + space + space + "A";
button.innerHTML += mytext;
document.getElementById("buttonarea").appendChild(button);
document.getElementById("textarea").innerHTML = mytext;

<div id="buttonarea"></div>
<div id="textarea"></div>

Answer 5

您应该使用 innerHTML 向按钮添加文本

var space = "&nbsp;";
var button = document.createElement("button");
mytext = "A" + space + space + space + space + "A";
button.innerHTML += mytext;
document.getElementById("buttonarea").appendChild(button);
document.getElementById("textarea").innerHTML = mytext;

如何使用 JavaScript 创建空白 space 作为按钮值

How to create a blank space as button value using JavaScript

html

javascript

button