网页前端设计

UEditor是由百度web前端研发部开发所见即所得富文本web编辑器，具有轻量，可定制，注重用户体验等特点，开源基于BSD协议，允许自由使用和修改代码。

是一功能强大的编辑器。有很多功能值得赞场的！大家可以去 下载 编辑器。

完全版：

1、加载

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="./ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="./ueditor/ueditor.all.js"></script>

2、创建容器 　有3种创建方法，但是官方推荐的是第2种script标签：

1)：

<div id="editor" style="width:800px;"></div>

2)：

<div style="width:800px;margin:20px auto 40px;">
<script type="text/plain" id="editor" style="width:100%;height:500px;"></script>
</div>

3)：

<textarea name="后台取值的key" id="editor">这里写你的初始化内容</textarea>

3、载入编辑器

var editor = new baidu.editor.ui.Editor();
editor.render('editor');  //editor为编辑器容器的id

或者：

var ue = UE.getEditor('editor',{
      　　toolbars:[　　　　['insertimage','attachment','pasteplain','FontSize','link','unlink']
      　　 ],
          wordCount:true, //开启字数统计
          elementPathEnabled : false,//是否启用元素路径，默认是显示
          maximumWords:10000,       //允许的最大字符数
          initialContent:'欢迎使用ueditor!',    //初始化编辑器的内容,也可以通过textarea/script给值，看官网例子
          autoClearinitialContent:true, //是否自动清除编辑器初始内容，注意：如果focus属性设置为true,这个也为真，那么编辑器一上来就会触发导致初始化的内容看不到了
          pasteplain:true,  //是否默认为纯文本粘贴。false为不使用纯文本粘贴，true为使用纯文本粘贴
     });

迷你版：

1、加载

<script type="text/javascript" src="./umeditor/umeditor.config.js"></script>
<script type="text/javascript" src="./umeditor/umeditor.min.js"></script>

2、创建容器

<div style="width:800px;margin:20px auto 40px;">
<script type="text/plain" id="editor" style="width:100%;height:500px;"></script>
</div>

3、载入编辑器

<script type="text/javascript" charset="utf-8">
        var um = UM.getEditor('editor');
</script>

基本使用方法就介绍到这！（完）

如果您觉得本文的内容对您的学习有所帮助，捐赠与共勉，支付宝(左)或微信(右)