javascript - 用另一个文本替换选定的文本

Question

我正在尝试用另一个文本替换选定的文本。
考虑以下是文本行。

你好世界。早上好。你好世界。早上好。

在这里，如果我选择第二个morning文本并且我想用晚上替换早上的文本。所以输出需要看起来像这样：

你好世界。早上好。你好世界。晚安。

我尝试了替换功能，但它正在替换第一天早上的文字。
任何人都可以为此提出解决方案吗？

Answer 1

要获取 HTML5 中的当前选择，请使用DOM Range API。

要编辑选择，可以使用选择 API 。

另请参阅：文本选择 API 去了哪里？

如果您使用 jQuery，则使用wrapSelection 插件

Answer 2

你可以这样做：

看演示

function swapSelection(swapText) {
  var sel = window.getSelection ? window.getSelection() : document.selection.createRange();
  if (sel != "") {
    if (sel.getRangeAt) {
      var range = sel.getRangeAt(0);
      var newNode = document.createElement("span");
      newNode.setAttribute('class', 'swapclass');
      range.surroundContents(newNode);
    } else {
      sel.pasteHTML('<span class="swapclass">' + sel.htmlText + '</span>');

    }
    $('.swapclass').replaceWith(swapText);
  }
}

$('button').click(function () {
  swapSelection('night');
});