如何在div中每行的开头添加特定字符？（javascript）

我想在html元素的每一行的开头添加字符，如：

<div id="container">
  <p>first part here !</p>
  but they is text here too
  <span>and bla bla bla</span>
  foo
  <p>bar</p>
  baz
</div>

---

您可以循环浏览以下内容：

$（“div”）.contents（）。每个（函数（）{
如果（this.nodeType==1）{//是一个元素
$（this）.prepend（document.createTextNode（“#”））
}else如果（$.trim（this.nodeValue）.length）{//text节点大于返回值
this.nodeValue=“#”+this.nodeValue；
}
})

span{display:block}

第一部分在这里

但这里也有文本
等等
福
酒吧

巴兹

@epascarello已经为这个问题提供了一个超级答案。我在玩弄它，找到了一种进一步压缩代码的方法。可能不是每个人都喜欢，但它将实际的前置操作简化为一行：

$（“div”）.contents（）。每个（（i，obj）=>{
var p=[''，'innerHTML'，''，'nodeValue'][obj.nodeType]；//为文本访问选择方法
var t=obj[p].trim（）；//获取文本并删除周围的空格
if（t.length）obj[p]='#'+t；//if text>“在a前面加前缀”
})

span{display:block}

第一部分在这里

但这里也有文本
等等
福
酒吧

巴兹

这里是我的vanilla.js版本

var el=document.querySelector（'div'）；
函数addchar（项）{
var childNodes=item.childNodes；
var countNode=childNodes.length；
对于（var i=0；i
span{display:block}

第一部分在这里

但这里也有文本
等等
福
酒吧

巴兹
有任何尝试吗？将正则表达式与replace一起使用您不应该在HTML上使用正则表达式。。。。。糟糕的建议这有点棘手，因为你谈论的是“线”，而不是元素（最后一个“#baz”是一个问题。这真的是你想要做的吗？一般来说，你不应该假设html节点被放置在新行上。你为什么要这样做？这将更加棘手，因为如果没有足够的宽度来显示它，文本可以在任何地方打断新行。很好，但我有另一个问题，我以前没有看到它：它是什么n
#conatiner
的宽度为100px（例如），如果文本太长，则仅占用一行。在这种情况下，不会为“每行”添加符号
#
，你明白吗？这确实是一个与我回答的问题不同的问题…这基本上是不可能用这样的代码检测到的，因为显示中的换行符没有换行符…可能必须执行以下操作
<div id="container">
  <p>#first part here !</p>
  #but they is text here too
  <span>#and bla bla bla</span>
  #foo
  <p>#bar</p>
  #baz
</div>

$('#container').addAtEachLine('#')