如何实现逗号分隔字符串的页面换行显示？

这事儿很容易踩坑——你用了jQuery的text()方法来修改内容，而这个方法的特性就是把所有传入的内容都当作纯文本处理，它会自动转义HTML标签，所以你替换出来的<br>就被当成普通字符串显示了，自然不会触发换行。

想要让<br>标签被浏览器解析成换行，你需要换成html()方法，这个方法会把内容当作HTML代码来渲染。

修正后的代码如下：

<html> 
<body> 
<div class="content">one,two,three</div> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<script> 
$(".content").html(function(i, val){
    return val.replace(/,/g, "<br>");
});
</script> 
</body> 
</html>

简单说下两者的核心区别：

• text()：处理纯文本，转义所有HTML特殊字符，适合展示用户输入的内容，能避免XSS风险
• html()：解析HTML标签，适合渲染包含HTML结构的内容，前提是你能确保内容是安全的

内容的提问来源于stack exchange，提问作者user9782404