Question

我有这个javascript用于在两个按钮之间添加空格，我刚创建并插入div：

document.getElementById("divID").appendChild(buttonONE);

document.getElementById("divID").innerHTML + ="           ";

document.getElementById("divID").appendChild(buttonTWO);

两个按钮之间有一个空格，但总是只有一个空格，就像你只按一次空格键一样。

如何将这些空格增加到多个？

由于

Answer 1

HTML中的所有空格（包括换行符）都缩减为一个空格。这是规则。
不要使用空格。他们不准确。使用元素并在CSS中为其指定宽度，填充或边距。
如果必须使用空格，请使用 。这是一个不间断的空间，所有这些都打印出来。但实际上，不要使用它。

Answer 2

您必须为每个空格使用 （不间断空格），以防止浏览器将其显示为一个空格。

Answer 3

CSS解决方案怎么样？您可以为元素提供ID并使用ID选择器：

 #buttonTWO
    {
       margin-left: 20px;
    }

或者如果你不能使用CSS设置它与Javascript：

document.getElementById("divID").appendChild(document.getElementById("buttonONE"));
var buttonTwo = document.getElementById("buttonTWO");
buttonTwo.style.marginLeft = "20px";
document.getElementById("divID").appendChild(buttonTwo);

http://jsfiddle.net/Std8J/

Answer 4

我相信你会因为 html 剥离空间的性质而得到这个。

您也许可以在要呈现该文本的任何元素上使用 white-space: pre css 属性。

<div id="divID" style="white-space: pre"></div>

我对您的申请了解不多，但也许这些就足够了。

Answer 5

（这是一个迟到的答案，但它会让那些登陆此页面的人受益，就像我在寻找解决方案时所做的那样）

使用html的pre标签解决了我的问题。

我正在显示一个有时会有多个空格的数组，我需要保留它而不将其减少到一个空格。

Answer 6

如果您不查找指定的长度，请使用html实体 ，
否则请使用margin-left:10px;
在JavaScript中使用：
{{1} }
，您不需要window.onload = function(){ var element = document.getElementById("Element-Id"); element.style.marginLeft = "20px";，但需要确保该函数直到加载后才执行（您可能知道。）

window.onload = function(){}

var b;
b = 0;

function move() {
  var a = document.getElementById("example");
  b += 20;
  a.style.marginLeft = b + "px" // For moving a specified amount, just remove var b, b = 0, b+=20; and then replace a.style.marginLeft = b+"px"with a.style.marginLeft = "[amount]"; 
}

button{
outline:0;
border-radius:35%;
border-width:0;
background-color:red;
color:white;
cursor:pointer;
}
button:hover{
color:red;
background-color:blue;
}
a{
cursor:default;
border-radius:10%;
border-width:10%;
}

无法在按钮之间添加带有“innerHTML”的空白区域

6 个答案: