求本站编辑器实现原理

[myevery]

本站的发帖的编辑器，好像就是个文本框，但能也能保存输入内容中的格式，比如换行，自动加超级链接等，不知道是如何实现的。
比如在某个节点下方的发帖编辑器。
而且，有的编辑器还能保存 markdown 格式。
实在是很厉害，求大神指点下，这是怎么做到的，是什么原理！

[also24]

是后端处理的啊

[shiji]

不知道有没有人和我一样，有一种欲言又止的感觉。

[kaiki]

原样储存，输出时处理即可。

[binux]

代码没有高亮也是能运行的。

[jigi330]

不就是个 textarea 吗， 难道是我理解错了？

[falcon05]

老哥你是程序员吗？

[dlsflh]

楼上的老哥们何必冷嘲热讽，本站有相当比例的人不是程序员。
请楼下信息检索大佬抬出本站自爆职业帖。

[myevery]

@kaiki 真是这样么，原样保存，输出时再加上换行等格式？

[myevery]

@jigi330 是 textarea，关键时显示时能带 html 格式啊。
我们输入时肯定是没有输入格式的，这是怎么处理的，？
是不是保存或输出时，逐行处理加上格式的。
一定是这样吧！

[iConnect]

@myevery 去看源代码就可以，早期版本有开源

[tyx1703]

https://codemirror.net/

好像用的这个。

[myevery]

@iConnect 哪有源代码啊，有源码当然最好了。这个好像是 python 写的吧，估计还看不太懂，哈哈

[jydeng]

就是 textarea

[a22271001]

@kaiki XSS 警告

[Wolther47]

楼主如果是说发布主题的那个编辑框，就是有 Markdown 支持的那个，那的确挺厉害的，至少里面的东西比看起来要复杂，但是应该不是 Livid 自己写的，而是开源项目。

这种东西难就难在看起来很简单，但是需求无限大，坑无限多。楼上说 textarea，但是实际上是 contenteditable 的 tag，现在火的 Notion 、Rome Research，包括各位很喜欢的 Typora，背后都是这个基本原理。大家也知道，有时候会有奇奇怪怪的体验。知乎上有一个问题 https://www.zhihu.com/question/26739121，里面有几个回答写的很详细。

看到楼主应该是刚刚接触，有好奇心其实挺好的，至少比想当然要好。技术好奇不应该被嘲笑，至少不应该在一开始被忽视。

[misaka19000]

简单的正则

[Wolther47]

当然是 JS 写的，划给前端领域

[Wolther47]

现在我也有点欲言又止的感觉了（

[krixaar]

@Wolther47 #15 问题就是，楼主不知道右键一下就能看到是 CodeMirror，然后根据这个水平进行推断，你差不多得用 ELI5 的方式来回答楼主的问题，反而就很难了……

[myevery]

@Wolther47 感谢大神回复这么多，太感谢了！
我确实是新手，研究这个对我来说有点难度！

我不想研究有 Markdown 支持的那个，只想了解一下，这个单贴下面的回复框是怎么实现的，是什么原理？

看样子应该就是个 textarea，就想了解一下，这个如何加的换行，比如我这个回复：我只是换行输入简单的文本，但保存后，再显示出来就自动加上 html 换行标记了。如果有链接也会加上超级链接的格式。
这是怎么实现的呢。。。。

楼上有人说是输出时处理，我觉得肯定不是这样，即使是处理也应该是保存时处理，毕竟保存时只需要处理一次，而如果是输出时处理，那会处理很多次。肯定是不合适的。

希望大神指点一下！