网页显示Ueditor编辑保存的内容时背景等信息无效果的处理

之前一直认为Ueditor编辑器生成的html代码直接输出到页面就可以了，但是今天有个客户提交了一个bug，说在添加文章时选择了内容的背景色，竟然在页面上不显示对应效果，于是马上检查，只见ueditor是在html的尾部加入了如下代码：

<p style="display:none;" data-background="background-repeat:no-repeat; background-position:center center; background-color:#548DD4;">
    <br/>
</p>

难怪页面显示不出效果，看来这个东西还需要javascript来进行处理一下，赶紧上ueditor的官网，查看对应的文档，找到了编辑内容展示相关的说明，见：http://fex-team.github.io/ueditor/#start-uparse

其实还是用parse.js来二次处理展示的html内容，并追加对应的css样式。

首先在展示页面加入js引用：

<script src="../ueditor.parse.js"></script>

给我们的输出html内容加个id作为容器，比如：

<div id="content">
    <p>dsfsdF</p>
    <p>sdsdf</p></div>

然后在页面的尾部加入如下：

uParse('#content', {
    rootPath: '../'})

经过这样处理后，ueditor中是什么样子，我们的页面也就显示成什么样子了！