将文本切成两段而不会破坏jQuery中的标签

Question

我通过合并不同的资源成功编写了以下代码。 这是将内容的html分成两半（对于更多应用程序而言）。 下面的代码不会打断单词（一直等到单词结尾）。

var minCharCount = 600;
var divcontent = $('#myDiv').html();

var firstHalf = divcontent.substr(0, minCharCount);
firstHalf = firstHalf.substr(0, Math.min(firstHalf.length, firstHalf.lastIndexOf(" ")));

var secondHalf = divcontent.substr(firstHalf.length, divcontent.length);

但是，与此有关的最后一个问题是，它可能破坏html标签，从而导致错误的代码。 有没有办法确保代码在任何潜在标签结束后将它们分成两部分？

编辑：可能有点难以理解。 我想要的是：

long text comes here with tags like <b>bold</b> or even <i>italic</i>.
                              ^1         ^2    ^3

所以我的意思是，如果我们在1处打破就好了，但是如果我们在2打破并把这两部分附加到某个地方，就会遇到问题。 因此，在突破2之前，我们需要检查它是否位于标签中间。 如果是，则等待直到标签结束然后中断：即在3 。

Answer 1

工作演示

代替

 $('#myDiv').html();

在从返回的字符串上运行函数

  $('#myDiv').text();

这样，您在输入字符串中不会得到任何html标记。

http://api.jquery.com/text/

更新：（回应评论）

由于需要html标记，因此可以遍历目标的children（），测量其.text（）的长度，然后将它们添加到输出中，直到达到minChars数量。 然后对您遇到的最后一个孩子执行相同的操作，直到达到与目标字符数最接近的文本数量。

children（）不包含文本节点，因此您必须使用contents（）。 但是，这种方法很麻烦。 我认为您最好的选择是创建一个范围对象，请参见此处： https : //developer.mozilla.org/en-US/docs/Web/API/Document.createRange