在不换行的情况下更新 HTML 标记 innerHTML

【问题标题】：Update an HTML tag innerHTML without line break在不换行的情况下更新 HTML 标记 innerHTML
【发布时间】：2017-06-20 21:36:55
【问题描述】：

我想将一个变量从 javascript 添加到 HTML 页面。脚本执行后，会添加一个新行（在第二句之前）。我想要做的是仅更新<div> 标记内的 HTML 并继续该行而没有任何中断。

    <html> 
    <body> 
    <p> Some text here <div id="my-id">my text</div>. Other text here.</p>
    <script>
    document.getElementById("my-id").innerHTML = "Add my text here";
    </script>
    </body>
    </html>

【问题讨论】：

尝试将您的内部<div> 更改为<span>。

标签： javascript html

【解决方案1】：

<div> 默认为block-level element。

您可以使用 CSS 覆盖它，但最好使用 <span> 代替，默认情况下它不是块级元素。

<span id='my-id'></span>

如果你绝对必须使用 div，你可以使用内联样式：

<div style='display:inline' id='my-id'></div>

或者你可以在样式表中定义它：

div#my-id { display:inline; }

【讨论】：