QuillJS-任何人都可以为整个工具栏提供自定义代码，而标题仅适用于选择内容，而不适用于整个文本？ Coldfusion和QuillJS

Question

需要具有完整工具栏的有效QUILLJS代码以及工具栏中的有效标题图标，才能仅将其应用于所选文本，而不能应用于整个文本。

我正在努力避免从付费CKEditor到免费QUILLJS的大量编码。

HTML：

<div id="editor-container" style="height: 350px;">#variables.valTextSettings[url.msg]#</div>
        <textarea id="htmlMessage" name="htmlMessage" style="display:none;"></textarea>

JS： html是通过隐藏变量处理的

$(document).ready(function () {
        var quillcontainter = '#editor-container';
        var hiddenformfield = '#htmlMessage';
        var quill = new Quill(quillcontainter, {
          modules: {
            toolbar: [
              ['bold', 'italic', 'underline', 'strike'],
              [{ 'font': [] }],[{ 'color': [] }, { 'background': [] }],  
              [{ 'list': 'ordered' }, { 'list': 'bullet' }, { 'indent': '-1' }, { 'indent': '+1' }],
              [{ 'direction': 'rtl' }],
              [{ 'header': 1 }, { 'header': 2 }],
              ['blockquote', 'code-block'],
              [{ 'script': 'sub'}, { 'script': 'super' }],
              [{ 'align': [] }],
              ['link'],
              ['clean'],
              ['showHtml']
            ]
          },
          placeholder: 'Transaction Notes..',
          theme: 'snow'  // or 'bubble'
      });
      /* Load Default values */
    $(hiddenformfield).html(quill.root.innerHTML);
        // This will produce a warning message in the console as we are attaching handlers separately, but we can ignore
    var txtArea = document.createElement('textarea');
    txtArea.style.cssText = "width: 100%;margin: 0px;background: rgb(29, 29, 29);box-sizing: border-box;color: rgb(204, 204, 204);font-size: 15px;outline: none;padding: 20px;line-height: 24px;font-family: Arial, Helvetica, sans-serif;position: absolute;top: 0;bottom: 0;border: none;display:none";
    var htmlEditor = quill.addContainer('ql-custom'); htmlEditor.appendChild(txtArea);
    var myEditor = document.querySelector(quillcontainter);
    quill.on('text-change', function (delta, old, source) {
        txtArea.value = quill.root.innerHTML;
        $(hiddenformfield).html(quill.root.innerHTML);
    });
    var customButton = document.querySelector('.ql-showHtml');
    customButton.addEventListener('click', function() {
      if (txtArea.style.display === '') { var html = txtArea.value; quill.pasteHTML(html); }
        // No text change but clicking the Source button
      else { var html = quill.root.innerHTML; quill.pasteHTML(html); }
      txtArea.style.display = txtArea.style.display === 'none' ? '' : 'none'
    });



    });