在特定字符后插入文字？

Question

是否可以在一段文本中的一定数量的字符之后插入div ？

如果我的div充满文字，例如：

<div class="content">
Vivamus luctus urna sed urna ultricies ac tempor dui sagittis.
</div>

我想在第13个字符后插入一个div ：

Vivamus luctu<div>s urna sed urna ultricies ac tempor dui sagittis

我可以使用jQuery / Javascript吗？

我正在接收要从getSelection().extentOffset插入div的范围的边界，该边界会产生一个数字，例如13 ，这是我要插入div 。

我能够使它部分工作，就像这样：

$("div").on("mouseup", function () {
    var start = window.getSelection().anchorOffset;
    var end = window.getSelection().extentOffset;
    console.log(start + ", " + end);
    console.log($(".content").text().substring(start, end));
    $('.output').html($('.content').html().substring(0, start) + '<span class="highlight">' + $('.content').html().substring(start, end) + "</span>" + $('.content').html().substring(end));
});

但这会在边界改变时替换整个文本，这意味着div不能包含多个部分。

Answer 1

这是一个相当复杂的问题，尤其是在您尝试实现跨浏览器功能时。 我建议使用该库Rangy也请查看此问题以获取示例用法

Answer 2

您可以使用$(".content").contents()来获取文本DOM节点，并可以将其替换为所需的部分，只需查看nodeType是否是所需的即可。

http://api.jquery.com/contents/