wangEditor富文本编辑器的使用

最新推荐文章于 2025-04-20 23:15:00 发布

冷血～多好

最新推荐文章于 2025-04-20 23:15:00 发布

阅读量463

点赞数 1

分类专栏： HTML 文章标签：前端

本文链接：https://blog.youkuaiyun.com/qq_44716544/article/details/115284117

版权

HTML 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了如何使用开源富文本编辑器wangEditor。通过引入wangEditor.min.js，创建编辑器实例，并展示了获取HTML和text文本的方法。此外，还提及了设置editor.config.uploadImgShowBase64为true以支持base64格式保存图片。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

富文本编辑器wangEditor的使用，这是一个开源的框架，官方网站地址：https://www.wangeditor.com/

使用该框架，需要接入一个js:wangEditor.min.js,

官方下载下载地址：https://www.jsdelivr.com/package/npm/wangeditor

云盘下载：https://pan.baidu.com/s/1OkbmUcP2OsxSPStwiNC6ug
提取码：sdkh

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"> 
	<title> 实例 </title>
	<script src="https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/wangEditor.min.js"></script> 	
		

</head>
<body>
<div id="div1">
    <p>欢迎使用 <b>wangEditor</b> 富文本编辑器</p>
</div>

<!-- 引入 wangEditor.min.js -->
<script type="text/javascript">
    const E = window.wangEditor
    const editor = new E('#div1')
    // 或者 const editor = new E( document.getElementById('div1') )
    editor.create()
</script>
			
</body>
</html>