为了账号安全,请及时绑定邮箱和手机立即绑定

CKeditor 删除开头多余的空格 - 修剪

CKeditor 删除开头多余的空格 - 修剪

回首忆惘然 2023-03-03 10:17:47
我试图删除ckeditor 生成的文本开头和结尾的额外空格,但不删除文本本身之间的空格。我在开始时有很多空间,然后是实际文本。所以我正在尝试为 ckeditor 生成的文本编写一个修剪函数,传统的 trim() 不能像文本包含的那样工作<p></p> &nbsp;,有时 <br>所以我不能只写一个正则表达式。生成的文本示例<p><br><br><br><br><br><br><br><br><br><br><br>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p><br><br><br><br><br><br>here text begins</p><p><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>another line</p><p><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>third line </p><p><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><strong>fourth line</strong></p><p><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><span class="text-huge"><strong>sdsdsdsdsd</strong></span></p><h2><span class="text-huge"><i><strong><u>sdsdsdsdsdsdsd</u></strong></i></span><br><br><br><br><br><br><span class="text-huge"><i><strong><u>csdsdsdsdsdsds</u></strong></i></span><br><br><br><br><br><br><br><br><br>&nbsp;</h2>我想删除所有标签,直到这里的文本开始,但这个文本可能会有所不同,可能是任何东西,有什么建议么?
查看完整描述

1 回答

?
吃鸡游戏

TA贡献1829条经验 获得超7个赞

好的,我已经设法通过解决方法解决了这个问题,想法是:

1- 将我们从 ckeditor 获得的全部字符串解析content.getData()为 HTMLCollection,

2- 遍历 html 标签并通过检查属性textContent删除任何没有文字的标签,一旦标签有文字退出循环。

3-在其中包含单词的标签内循环,并通过拆分将字符串转换为单词数组str.split(' ')并遍历数组并删除每个单词,<br>或者&nbsp;直到到达这些标签和实体以外的任何内容,然后退出循环。

4- 您需要从(从 ckeditor 获得的全部文本)的开头和结尾经历这个过程。

     trimedCkEditorText() {

            let contentStr = this.content.getData();

            // Remove Extra whitespaces at the begining of the text

            contentStr = this.trimedCkEditorTextAt(contentStr, true);


            // Remove Extra whitespaces at the end of the text

            contentStr = this.trimedCkEditorTextAt(contentStr, false);


            return contentStr;

        },

        trimedCkEditorTextAt(contentStr, startOfText) {

            const parser = new DOMParser();

            const doc = parser.parseFromString(contentStr, "text/html")


            // Check first child 

            while(doc.body.children.length) {

                const index = startOfText ? 0 : doc.body.children.length - 1; 

                const child = doc.body.children[index];

                

                if(child.textContent.replace(/\s/g, '').length) {

                    // Remove <br> tags

                    while(child.children.length) {

                        const index = startOfText ? 0 : child.children.length - 1; 

                        const grandechild = child.children[index];

                        if(grandechild.localName === 'br') grandechild.remove();

                        else break;

                    }


                    // Remove &nbsp;

                    const childTextArray = child.innerHTML.split(' ');

                    while(childTextArray.length) {

                        const index = startOfText ? 0 : childTextArray.length - 1; 

                        if(childTextArray[index] === '&nbsp;') childTextArray.splice(index, 1);

                        else break;

                    }

                    child.innerHTML = childTextArray.join(' ');

                    break;

                } else {

                    child.remove();

                }

            }


            return doc.body.innerHTML;

        }


查看完整回答
反对 回复 2023-03-03
  • 1 回答
  • 0 关注
  • 220 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信