html - 附加带换行符的 html 比附加不带空格的 html 更容易吗？

Question

我问自己哪种语法更轻，或者两者之间没有区别:

const html = '
<div class="container">
    <div>
        <input type="text" placeholder="login" />
    </div>
    <div>
        <input type="password" placeholder="password" />
    </div>
</div>
'

$('#global_container').append(html)

还有这个:

const html = 
'<div class="container">'
    + '<div>'
        + '<input type="text" placeholder="login" />'
    + '</div>'
    + '<div>'
        + '<input type="password" placeholder="password" />'
    + '</div>'
+ '</div>'

$('#global_container').append(html)

在我的项目中，如果用户按下修改按钮，我需要添加大量的 html。这就是为什么我想知道如何在 js 文件中编写 html 代码。

Answer 1

最好的选择是使用模板文字，因为这提供了各种选项。如果将来需要，您可以轻松使用动态数据(来自 API 等的数据)。

const html = `
<div class="container">
    <div>
        <input type="text" placeholder="login" />
    </div>
    <div>
        <input type="password" placeholder="password" />
    </div>
</div>
`;

检查MDN DOCS :

针对您的问题，我相信第一个选项会更好，因为我们不必采用不同的串联过程，这显然是一项时间复杂的任务。