javascript - 保留 html o/p 中的空白

Question

我正在从富文本框中获取文本

例如：“abc def”。

我应该在这些空白处显示一个下拉框，但浏览器会自动消除这些空白。

我试过这段代码：

var text = div.innerHTML;    
var regex = new RegExp(" ", "g");  
text = text.replace(regex, "   ");  
div.innerHTML = text;  '

这与 2 个额外的空格保持正确对齐

有什么办法可以让我用文本替换空格， 但如果文本出现在标签前。<font size="10"那么字体和大小之间的空间将不会被替换

谢谢

Answer 1

将 div 的样式设置为

white-space: pre;

而且你不必用javascript做所有的事情。

Answer 2

用于  双倍空间。浏览器默认会消除多余的空间。

Answer 3

您可以在 html 中使用 pre 标记"<pre>string</pre>" 或制作一个类似 pre 的 css 类：

.wspaces{
    white-space: pre;
    white-space: pre-wrap;       /* css-3 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}