使用 javascript createElement 创建 <br />？

Posted 2023-05-07

【中文标题】使用 javascript createElement 创建 <br />？

【英文标题】：Creating a <br /> with javascript createElement?

【发布时间】：2011-06-06 22:59:19

【问题描述】：

我需要用javascript动态创建一个<br />标签。

var br = document.createElement('br');

和

var br = document.createElement('<br />');

没用

第一个选项当前在不通过 Xhtml 标准的页面上创建了一个<br> 标记，有什么办法吗？

【参考方案1】：

第一种方法不需要通过 XHTML 标准 - 您将标记与操作 DOM 混淆了。

【讨论】：

它的表达方式可以解释为 XHTML 标准很重要，只是不是第一种方法。

【参考方案2】：

HTML 和 JavaScript 的简单脚本，用于在页面中动态添加 br 标记。

 <SCRIPT language="javascript">
    function add() 

     //Create an input type dynamically.
        var br = document.createElement("br");
        var foo = document.getElementById("fooBar");
        foo.appendChild(br);
     
    </SCRIPT>

    <INPUT type="button" value="Add" onclick="add()"/>
    <span id="fooBar">&nbsp;</span>

    This text will go down every time you click on add button

【参考方案3】：

第一个选项将起作用，并且与 XHTML 无关，因为 DOM 操作是在文档解析之后执行的，因此当时没有要符合的 XHTML/HTML 标准.只要您不尝试将 HTML 输出为字符串，这种方法就可以正常工作。

【参考方案4】：

这个问题与标记无关。传递给createElement 的参数是一个元素名称，它不是标记片段或其他任何东西，也不是XML、HTML、XHTML、SGML 或任何形式的标记。

createElement 方法返回一个 DOM 对象，没有标记，从来没有。

请注意，传递给浏览器的标记用于创建文档对象，从那时起，标记就无关紧要了。

【讨论】：

该问题与标记无关（所有答案都固定在标记上），它与提供给函数的元素名称有关。其他人会像我一样遇到这个问题，希望他们能看到所有答案并更好地了解实际问题。

【参考方案5】：

实际上，如果您的 JavaScript 没有完全验证，您的代码仍然会进行验证，因为验证器只解析处理过的 HTML 代码，而不是 JavaScript 创建的动态代码。如果您愿意，也可以使用innerHTML 技巧，或者如果您想强制使用 XHTML 版本，则可以使用document.createTextNode('<br />');，但不建议这样做。 document.createElement('br'); 工作得很好。

【讨论】：

你没有起始标签

【参考方案6】：

除非“<br>”作为 innerHTML 传递给任何元素，否则它不会被呈现为 HTML 标记。所以我们可以使用一个虚拟的 '<span>' 元素并保持 '<br>' 作为它的 innerHTML，这样它就可以按预期呈现。

br = document.createElement("span"); br.innerHTML = "<br/>"; document.body.appendChild(br);