使用ueditor富文本编辑器 数据回显带有HTML标签的解决办法

遇到的问题：

后台用富文本编辑器编辑好后，在前台读取数据库中的信息，前台读取的数据是带HTML标签的数据格式

 

尝试的解决办法：

1：使用js方法将前台读取出来的数据用html（）方法 innerhtml（） 等js原生方法尽行转换，但是，试了所有的转换方法，结果还是没有解决

当时的思路就是，将数据库中带html标签的数据用某种方法进行解析转化成用富文本编辑器编辑时的数据格式，但是这个想法思路逻辑是没有问题，但是试了许多办法都解决不了，（或许自己的实力搞不定这个问题）

2：利用富文本编辑器解决数据库数据带html标签的解析问题

 在尝试各种原生js解决不了数据回显的问题后，可能是自己的实力不允许，用原生解决不了htnl标签的解析，就只能用一个比较笨的方法，用富文本编辑器决绝数据解析，因为添加数据后台使用富文本编辑器添加的，按照逻辑上来讲，富文本编辑器应该可以按照编辑时的方式回显数据，而这个也是自己用符文本编辑器的初衷（编辑文章不那么丑）

 

使用步骤：

1：前台显示数据的网页，引入富文本编辑器（路径根据自己的项目路径为准）

<script type="text/javascript" charset="utf-8" src="/ueditor/ueditor.config.js"></script> 

<script type="text/javascript" charset="utf-8" src="/ueditor/ueditor.all.min.js"></script> 

<script type="text/javascript" charset="utf-8" src="/ueditor/ueditor.parse.js"></script> 

<script type="text/javascript" charset="utf-8" src="/ueditor/lang/zh-cn/zh-cn.js"></script>

2：在接收后台数据的地方，绑定富文本编辑器

<div class="article_all">    
     <div class="article_list">        
         <a class="article_item" href="javascript:viod(0);">                
             <textarea id="editor"  name="content" ><%=content.content%> </textarea>  
        </a>    
      </div> 
</div>

3：利用js实例化富文本编辑器

<script> var ue = UE.getEditor('editor') </script>

效果图： 

 

 

看到这个 说明已经成功的引入了富文本编辑器，但是前台想获取的是后台的数据，并不希望回显的数据还有富文本编辑器的一切样式（而且，现在的状态，前台是可以对读取来的数据进行编辑，显然并不是我问想要的效果）

4：对前台引入的富文本编辑器进行初始化编辑

<script>
    var ue = UE.getEditor('editor',{
        toolbars:[[]],
        initialContent: '初始化内容',//初始化编辑器的内容
        initialFrameHeight: 200,
        serverUrl: '/server/ueditor/controller.php',
        //关闭字数统计
        wordCount:false,
        readonly : true,
        elementPathEnabled :false,
        initialFrameWidth:'100%',
        initialFrameHeight:660,
        scaleEnabled:false,
        autoHeightEnabled: false
    })
</script>

 

此处可以直接复制使用，需要更多操作，可以在ueditor编辑器的config.js配置文件中进行查看

运行效果：

 

到此，就实现了我想要的结果，或许还有其他办法解决这类情况 ，但是自己实力有限。