<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>REM</title>
<script src="./index.js"></script>
<!-- <script src="./index2.js"></script> -->
<!-- <script src="./index.css" rel="stylesheet"></script> -->
<link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">
<script src="https://cdn.quilljs.com/1.3.6/quill.js"></script>
<style>
*{
margin: 0;
padding: 0;
}
</style>
<script>
//https://bingkui.gitbooks.io/quill/content/documentation/api/content.html
</script>
</head>
<body>
<div id="toolbar">
<span class="ql-formats">
<!-- <select class="ql-font"></select> -->
<select class="ql-size"></select>
</span>
<span class="ql-formats">
<button class="ql-bold"></button>
<button class="ql-italic"></button>
<button class="ql-underline"></button>
<!-- <button class="ql-strike"></button> -->
</span>
<span class="ql-formats">
<select class="ql-color"></select>
<select class="ql-background"></select>
</span>
<!-- <span class="ql-formats">
<button class="ql-script" value="sub"></button>
<button class="ql-script" value="super"></button>
</span> -->
<!-- <span class="ql-formats">
<button class="ql-header" value="1"></button>
<button class="ql-header" value="2"></button>
<button class="ql-blockquote"></button>
<button class="ql-code-block"></button>
</span> -->
<!-- <span class="ql-formats">
<button class="ql-list" value="ordered"></button>
<button class="ql-list" value="bullet"></button>
<button class="ql-indent" value="-1"></button>
<button class="ql-indent" value="+1"></button>
</span>
<span class="ql-formats">
<button class="ql-direction" value="rtl"></button>
<select class="ql-align"></select>
</span>
<span class="ql-formats">
<button class="ql-link"></button>
<button class="ql-image"></button>
<button class="ql-video"></button>
<button class="ql-formula"></button>
</span>
<span class="ql-formats">
<button class="ql-clean"></button>
</span> -->
</div>
<div id="editor">
<p>Hello World!</p>
<p>Some initial <strong>bold</strong> text</p>
<p><br></p>
</div>
</body>
</html>
<script>
var toolbarOptions = ['bold', 'italic', 'underline','color','background'];
var quill = new Quill('#editor', {
theme: 'snow',
modules: {
toolbar: '#toolbar'
},
placeholder: ' 请输入评价',
});
// 获取编辑完成的内容：
//const html = document.querySelector('#editor').children[0].innerHTML
//获取内容后置于编辑器中显示：
//const html = document.querySelector('#editor').children[0].innerHTML
// quill.pasteHTML('<h3>add some title</h3>' + html)
</script>
