样式化innerHTML输出

Question

我正在尝试使用innerHTML函数创建一个JavaScript程序,其中用户在两个文本框中键入某人的名字和姓氏,然后JavaScript在单击按钮后操作名称,格式如下:

姓氏,名字.

我已经成功地将名称按顺序显示为"onclick",但输出如下所示:

迪克

,

菲利普

.

我希望一切都在一条线上不间断.我已经尝试创建一个会影响div的css类:.nobr {white-space:nowrap; 但是,这不起作用.

到目前为止,我正在使用的HTML看起来像这样:

    <div id='displayName2'></div>,<div id='displayName1'></div>.

Answer 1

要使这两个<div>标签在两者之间没有换行符,请使用CSS属性display: inline; 或者使用<span>标签代替<div>,因为<span>默认情况下显示内联,其中<div>是一个块元素.在语义上,<span>可能更合适.但如果您无法更改HTML,请相应地修改您的CSS:

<div id='displayName2'></div>,<div id='displayName1'></div>

#displayName2, #displayName1 {
   display: inline;
}