我需要在一个可满足内容的div中显示段落标记，空格和其他格式标记，就像你可以在MS Word中通过按格式标记按钮格式标记按钮http://blogs.mccombs.utexas.edu/the-most/files/2011/04/show-hide-button-in-outlook.jpg
是否有一个简单的方法来实现这一点?
<html>
<head>
<style>
span::after{
color:black;
content:" 0b6";
}
p::after{
color:black;
content:" 0b6";
}
</style>
</head>
<body>
<h3>
<span class="label">This is the main label</span>
<span class="secondary-label">secondary label</span>
</h3>
<P>Quote me</p>
</body>
</html>创建一个将空格绘制为点，将换行符绘制为段落标记的字体应该可以解决您的问题。
在代码中，它看起来像.editable-div {
font-family: "Your custom font with spaces as dots and stuff", "Actual character font";
}
这里有一篇文章详细介绍了这种方法http://www.sitepoint.com/joy-of-subsets-web-fonts/
(我无法访问Word，但我假设它是大多数文本编辑器中呈现的完全相同的功能，或者InDesign的'显示隐藏字符'选项&c.)
不，绝对没有简单的方法来做到这一点，因为这是一个相当复杂的功能。
如果您真的想要这样做，最好的办法是在用户输入文本时捕获div中的输入。像Bacon这样的东西可以很容易地将关键用户输入捕获为流(并允许您跨流进行映射)，这会在一定程度上简化过程。
你需要替换*(实时)每个空格/段落标记/&c与相关的标记为用户。实际的输入仍然需要保存为输入，或者在保存之前再次解析以删除新的假装字符。尽管您可以对许多标记(可能是pilcrows ?)使用use unicode实体，但空格(例如)仍将显示为空白(或者如果转义则显示为实体代码)，因此您需要使用代表性图标—本质上，大多数隐藏字符都需要有自己特定的、已定义的呈现规则。
这简直是噩梦。如果你能保证最小化文本的最大数量，如果你能控制用户可以输入的内容，这是可行的。对于大量的文本，我可以看到它变得可怕:不确定JS开销在性能方面会是什么，但我无法想象它会特别好。
*或追加-例如换行符/回车符等都需要作为标记显示，并且实际上出现在可满足元素中。
Edit:除了上述操作之外，您还可以编辑字体，替换/添加隐藏字符的unicode点，而不是可见字符-您仍然需要捕获输入，但这将消除一些令人头痛的问题。例如，它可以很好地处理空格。还是有点像噩梦，但是，嘿。