將帶有段落標簽的子字符串包裝在內容可編輯div的字符串中

Question

繼承人的HTML-：

<div contenteditable="true">I am a good person</div>

現在如何使用段落標記將以index 7 to index 17開頭的子字符串包裝index 7 to index 17 ，以便結果如下：- <div contenteditable="true">I am a <p>good person</p> </div>

Answer 1

像這樣的東西：

function wrapSubstring(sourceString, subString, tag) {
    return sourceString.replace(new RegExp("(" + subString + ")", "g"), "<" + tag" + ">$1</" + tag + ">");
}

上面的代碼將替換sourceString中所有subString實例。

重要說明：如果subString可以包含任意文本，則需要引用subString。 請參閱： 如何在javascript中轉義正則表達式？

還有一個不太通用的實現：

// Wrap a subString of sourceString with the given tag
// starting at startIndex(inclusive) and going to endIndex(exclusive)
function wrapSubstring(sourceString, tag, startIndex, endIndex) {
    return sourceString.substring(0, startIndex)
        + "<" + tag + ">"
        + sourceString.substring(startIndex, endIndex)
        + "</" + tag + ">"
        + (endIndex ? sourceString.substring(endIndex) : "");
}

這是一個使用jquery的示例調用：

var $element = $('#someId');
$element.html(wrapSubstring($element.html(), 'p', 7, 17);