html内容代码中的javascript替换语句

我需要你的帮助来替换html内容中的句子，其根本要求是用户选择网页中的任何文本并右键单击该文本

我通过以下方式获得所选文本或句子：

function getHTMLOfSelection() {
    var range;
    if (document.selection && document.selection.createRange) {
        range = document.selection.createRange();
        return range.htmlText;
    }
    else if (window.getSelection) {
        var selection = window.getSelection();
        if (selection.rangeCount > 0) {
            range = selection.getRangeAt(0);
            var clonedSelection = range.cloneContents();
            var div = document.createElement('div');
            div.appendChild(clonedSelection);
            return div.innerHTML;
        }
        else {
            return '';
        }
    }
    else {
        return '';
    }
}

所选文本包含空格，因此我需要将其拆分以获得一个句子，然后我需要使用带有类名和id的span标记包装拆分的文本，并将拆分文本中的每个句子作为span标记的值

请参阅下面我的函数

content_text变量是网页上的原始文本，因此我尝试用上面提到的带有类名和id的span的新内容替换所选文本，但无法替换sentense

内容\文本html内容

<p><span style="color: rgb(36, 41, 46); font-family: -apple-system, system-ui, " segoe="" ui",="" helvetica,="" arial,="" sans-serif,="" "apple="" color="" emoji",="" "segoe="" ui="" emoji";"="">Hi,</span><br style="color: rgb(36, 41, 46); font-family: -apple-system, system-ui, " segoe="" ui",="" helvetica,="" arial,="" sans-serif,="" "apple="" color="" emoji",="" "segoe="" ui="" emoji";"=""><span style="color: rgb(36, 41, 46); font-family: -apple-system, system-ui, " segoe="" ui",="" helvetica,="" arial,="" sans-serif,="" "apple="" color="" emoji",="" "segoe="" ui="" emoji";"="">My app gets data from on iOT device every second via bluetooth. </span></p><p><span style="color: rgb(36, 41, 46); font-family: -apple-system, system-ui, " segoe="" ui",="" helvetica,="" arial,="" sans-serif,="" "apple="" color="" emoji",="" "segoe="" ui="" emoji";"="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; I am using transaction object for batch insert. This query runs every second. On top of that when a user is in Chart View, the app fetches data from the sqflite every 5 seconds. I have used transaction object instead of database object here too. But after couple of minutes I'm getting the database locked warning.</span>
                            </p>

<p><span style="color: rgb(36, 41, 46); font-family: -apple-system, system-ui, " segoe="" ui",="" helvetica,="" arial,="" sans-serif,="" "apple="" color="" emoji",="" "segoe="" ui="" emoji";"="">Hi,</span><br style="color: rgb(36, 41, 46); font-family: -apple-system, system-ui, " segoe="" ui",="" helvetica,="" arial,="" sans-serif,="" "apple="" color="" emoji",="" "segoe="" ui="" emoji";"=""><span style="color: rgb(36, 41, 46); font-family: -apple-system, system-ui, " segoe="" ui",="" helvetica,="" arial,="" sans-serif,="" "apple="" color="" emoji",="" "segoe="" ui="" emoji";"="">My app gets data from on iOT device every second via bluetooth. </span></p><p><span style="color: rgb(36, 41, 46); font-family: -apple-system, system-ui, " segoe="" ui",="" helvetica,="" arial,="" sans-serif,="" "apple="" color="" emoji",="" "segoe="" ui="" emoji";"="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; I am using transaction object for batch insert. This query runs every second. On top of that when a user is in Chart View, the app fetches data from the sqflite every 5 seconds. I have used transaction object instead of database object here too. But after couple of minutes I'm getting the database locked warning.</span>
                            </p>