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>