Javascript 填充元素内容的干净方法

我需要将内容（HTML）附加到元素。这就是我目前的做法

element.innerHTML += "<a href=\"" + something[awesome] + "\">" + something[great] + "</a>";
element.innerHTML += "<br>";

element.innerHTML+=”；
element.innerHTML+=“
”；

---

这看起来很乱。有没有更干净的方法？

createElement（）

方法是实现这一点的正确方法吗？

这取决于您的需求，但如果您想保持它的简单性并接近您现在拥有的，只需更改为：

var s = "<a href=\"" + something[awesome] + "\">" + something[great] + "</a>";
element.innerHTML += s + "<br>";

var s=”“；
element.innerHTML+=s+“
”；

---

换句话说，在变量中构建字符串，而不是直接在

innerHTML

属性上。

假设

元素
，
某些东西
，
很棒的
和
很棒的
已经定义，我通常会这样做：

// build anchor
var anchorElement = document.createElement('a');
anchorElement.href = something[awesome];
anchorElement.appendChild(document.createTextNode(something[great]));

// build break tag
var breakElement = document.createElement('br');

// append
element.appendChild(anchorElement);
element.appendChild(breakElement);

休息可能没有必要。只需使用CSS制作锚块或创建视觉分隔

这里有一把小提琴可以玩：
它很乱。createElement是正确的创作方式。与appendChild搭配。“correct”是一个非常强的词。有些人更喜欢只设置
innerHTML
（这一点我个人还没有确认），但同样，可以为API的设计使用方式提供依据。这个问题可能会产生很多简单的基于意见的答案。我正在寻找一种更干净的方法来解决这个问题。。。我现在不在乎表现！这仍然非常重要messy@BruceBlacklaws-我没有说它是原始的、神圣的或天堂般的。只是它减少了多次变异
innerHTML
的负面影响（这很糟糕）。