Javascript 在div的最后一个子元素末尾添加html（可能是css）？

我有一个DOM结构，比如

<div id="container">
  <div id="one">Some fancy text</div>
  <div id="two">Some other text</div>
  <div id="three">and that's enough!</div>
</div>

一些文本
其他一些文本
其他一些文本，尝试在最后一个'here'->here后返回

尝试使用css选择器添加边距，而不是空行

#container>div:最后一个子级{
边缘底部：1米；
}

如果出于某种原因需要使用JavaScript插入

标记，以下是一种方法：

function checkBreaks() {

  const container = document.querySelector('#container');
  const existingBreak = document.querySelector('#container br');
  const newBreak = document.createElement("br");

  if (existingBreak) {

    console.log('There\'s already a break in here, let\'s remove it');
    existingBreak.remove();

    console.log('Also let\'s insert a new break at the end');
    container.appendChild(newBreak);

  } else {

    console.log('No breaks, let\'s insert a new one at the end');
    container.appendChild(newBreak)

  }

}

编辑：

---

我将代码示例修改为一个函数，用于检查容器内的单个

。每当编辑器更改结构时，都可以调用

checkBreaks（）
请尝试以下操作，而不是“物理的”

：

div:last child:：after{
内容：''；
显示：块；
}

换行符元素除了强制换行到下一行之外什么都不做，您可以对设置为
display:block的任何元素（甚至是伪元素）执行相同的操作

我希望这会有所帮助。
你可以给最后一个div添加一些样式，并作为
br
不，事实是我需要br来解决另一个html问题，这不是样式问题，然后你需要在其中添加

-CSS不能插入元素（除非您计算：：before：：after etc，但它们不会在HTML中插入元素-因此，您需要自己插入元素-为什么不总是将其放在那里，并在尝试解决问题之前插入/删除元素。插入a
br
是一种不寻常的解决方案，相反，您需要说明为什么要尝试这种方法ach.你不能使用
css
将html元素放入dom，你可以添加内容，但不能添加
html
它应该是
#container>div:last child
这不是一个样式问题。的确，我需要在html代码中加入br来解决另一个更复杂的问题，因此它与样式和空间无关。无论如何，谢谢你，这是你应该采用的方式这样做，而不是插入额外的Domelements@SashaGrievus你能描述一下这个更复杂的问题吗？也许我们可以确定是否需要

。完成，在问题之后。对不起，也许我问这个问题的方法不对。我不明白你为什么要添加你想要的
但是如果你必须添加谢谢，但真正的问题是将它一直保留在最后一个div的末尾，而divs发生了变化，那么您需要将其转换为一个函数，并在每次更新容器内容时运行它。您需要更改的只是执行一个文档。querySelector（'br'））在将该元素添加为最后一个子元素之前，请删除该元素。您很好。问题不仅在于多个br，而且如果在结构中添加了其他div，“last div”变成另一个div，则br仍保留在旧div中，并且“last div”变成另一个div，在前一个“last div”中保留一个br。谢谢您，我尝试过了，但是br需要保留在最后一个div中并将其放入a中fter不能解决问题