Javascript/Jquery - 删除所有文本内容 - 除了最后 10 个字符（或 3 个单词） - 元素之前

Question

我想删除元素之前<p class="content">段落中的所有内容，除了最后 10 个字符，最好在第一个字符之前添加 ...：

我有这个：

<p class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p>

我想以这样的方式结束（它也可以按字 - 在<span class="highlight">之前的 2 或 3 个字）

<p class="content">...med doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p>

Answer 1

您可以使用split来识别突出显示标记并在删除字母之前添加它。 创建一个带有总字母的 var 以在...之后休息；

检查这个例子：

 var el = document.querySelector('.content'); var amountLetterBeforeHighlight = 25; var splitEl = el.innerHTML.split('<span class="highlight">') el.innerHTML = '... :rest<span class="highlight">:splitRest '.replace(/\\:rest/g, splitEl[0].substr(splitEl[0].length - amountLetterBeforeHighlight)).replace(/\\:splitRest/g, splitEl[1])

 .highlight { color: blue }

 <p class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p>

编辑：

所以你想用多个段落创建，所以看看这个：

 var els = document.querySelectorAll('.content'); var amountLetterBeforeHighlight = 25; els.forEach(el => { var splitEl = el.innerHTML.split('<span class="highlight">'); el.innerHTML = '... :rest<span class="highlight">:splitRest '.replace(/\\:rest/g, splitEl[0].substr(splitEl[0].length - amountLetterBeforeHighlight)).replace(/\\:splitRest/g, splitEl[1]); });

 .highlight {color: blue}

 <p class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p> <p class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p> <p class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p>

不管里面是什么，在代码找到highlight标签之后，再一次应用到每个el 。

希望这有帮助！

Answer 2

请参阅下面的示例，代码中的注释。

 //get innerHTML of p var p = document.getElementById("p").innerHTML; //check length of p - uncomment below to see length //console.log(p.length) //length of p was 611 so we just want to get index 605 - 611 of p var pslice = p.slice(605,611); //declare new p for example by id "shortp" var shortp = document.getElementById("shortp") //set innerHTML of example "shortp" with ... + pslice shortp.innerHTML = "..." + pslice

 <p id="p" class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied.</p> <p><i>Your shortened example below</i></p> <p id="shortp"></p>