完成效果圖如下：

可以去官網：https://ueditor.baidu.com/website/index.html

ue版本功能多，um版本日常功能都有，我下載的um把版本

1)  需要依賴static/Ueditor

<link href="${pageContext.request.contextPath}/static/Ueditor/themes/default/css/umeditor.css" 
type="text/css" rel="stylesheet">
<script type="text/javascript" 
src="${pageContext.request.contextPath}/static/common/jquery-3.2.1.min.js"></script>

<script type="text/javascript" charset="utf-8" 
src="${pageContext.request.contextPath}/static/Ueditor/umeditor.config.js"></script>

<script type="text/javascript" charset="utf-8" 
src="${pageContext.request.contextPath}/static/Ueditor/umeditor.min.js"> </script>

<script type="text/javascript" charset="utf-8" 
src="${pageContext.request.contextPath}/static/Ueditor/lang/zh-cn/zh-cn.js"></script>
 

2）html裡用<script>標籤定義一個容器

<div>
    <script id="myEditor" name="myEditor1"  type="text/plain">
         <p style="margin-left: 0px">一、產品介紹</p>
         <p style="margin-left: 0px">二、主要功能點</p>
         <p style="margin-left: 0px">三、可參考品</p>
         <p style="margin-left: 0px">四、人員需求</p>
    </script>
</div>
 

3）jquery的入口函式裡實例化Ueditor

//例項化編輯器

var um = UM.getEditor('myEditor');
//其中myEditor是<script>標籤定義的容器

4)如何設定它的初始化內容：

um.setContent(“新內容”);

5)如何獲取Ueditor的內容

um.getContent();