如何將TD字符串分成從第n次出現開始的新行

下面的代碼將每行的文本拆分爲新創建的行，並以特定分隔符分隔。如何將TD字符串分成從第n次出現開始的新行

這工作都很好，但是我怎樣才能在定界符的第n個（即第二個）出現處開始拆分？

期望的結果應該是這樣的：從第二 '/' 分隔符開始分裂：

這樣的：
PMC37516JG/DMM/1946P/C.Q4.DUMMY

變：
PMC37516JG/DMM
1946P
C.Q4.DUMMY

每個字符串中的分隔符數量是可變的。我搜索了互聯網，但在那裏找不到答案。
歡迎任何幫助。

$('#tbl tr').each(function(){ 
 
    var $this = $(this); 
 
    var arr = $this.text().split('/'); 
 
    var len = arr.length; 
 
    var i; 
 
    var $previous = $this; 
 
    for (i = 0; i < arr.length; ++i) { 
 
    var $tr = $this.clone(); 
 
    $tr.find("td").text(arr[i]); 
 
    $previous.after($tr); 
 
    $previous = $tr; 
 
    } 
 
    $this.remove(); 
 
});

th { 
 
    height: 15px; 
 
    min-width: 30px; 
 
    border: 1px solid black; 
 
    font-size: 12px; 
 
    font-family: Courier, monospace; 
 
    padding: 2px 5px 2px 5px; 
 
} 
 
td { 
 
    height: 15px; 
 
    min-width: 30px; 
 
    border: 1px solid black; 
 
    font-size: 12px; 
 
    font-family: Courier, monospace; 
 
    padding: 2px 5px 2px 5px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table id="tbl"> 
 
    <thead> 
 
    <tr class="tbl-header"> 
 
     <th>1</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>UWS</td> 
 
    </tr> 
 
    <tr> 
 
     <td>DA8101A/12.DOH</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC37516JG/DMM/1946P/C.Q4.DUMMY</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC18713DA/DMM/2118P/C.Q4</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC17854DA/DMM/1884P/C.Q5.KIKKER</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC18964DA/DMM/1270P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC13312DA/DMM/1500P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC81630FF/DMM/2316P/C.Q5.DUMMY</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC73647FF/DMM/2540P/C.Q5.DUMMY</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC15970DA/DMM/2780P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC19458DA/DMM/2644P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC13485DA/DMM/2382P/C.Q5.KIKKER</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC88130FF/DMM/2450P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC13913DA/DMM/2930P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC19689DA/DMM/3298P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PGA2002DA/ORD/2155P/C.Q5.TRANSIT</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC11453DA/DMM/3212P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC17664DA/ORD/1800P/C.Q4.TRANSIT</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC90443FF/DMM/520P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC16529DA/DMM/624P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC72784FF/DMM/4218P/C.Q5.DUMMY</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC94058FF/DMM/3120P/C.Q5.DUMMY</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC91247FF/DMM/3466P/C.Q5.KIKKER</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC38632JG/DMM/3094P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC19767DA/DMM/3778P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC16397DA/ORD/1420P/C.Q4.TRANSIT</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC12044DA/DMM/2672P/C.Q4</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC37949JG/DMM/1672P/C.Q6</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC13278DA/ORD/928P/C.PLD.TRANSIT</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC11256DA/ORD/1595P/C.PLD.TRANSIT</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC18938DA/ORD/1458P/C.PLD.TRANSIT</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC12294DA/ORD/4140P/C.PLD.TRANSIT</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC14236DA/ORD/4136P/C.PLD.TRANSIT</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC13867DA/ORD/4126P/C.PLD.TRANSIT</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC7523DA/ORD/4152P/C.PLD.TRANSIT</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC18036DA/ORD/4122P/C.PLD.TRANSIT</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC10478DA/DMM/1548P/C.PWG</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC88389FF/DMM/1164P/C.PLD</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 

 
Expand snippet shareeditflag edited yesterday answered yesterday Sven The Surfer 894518 I guess I was'n clear enough. I need the splitted text to be put on a new line, underneach each other (row) rather than on a new column. – Dummy yesterday OK I see 
 
that you accepted an answer already, but I've updated the code! Mine also separates each into their sub-row so you could space them out/arrange them better – Sven The Surfer yesterday add a comment up vote 0 down vote accept Something like this? Grab 
 
all of the td elements. Split them on the '/'. Clear the row that they are in, then loop through them, creating td elements for each one. Then, add them back to the row. [].forEach.call(document.querySelectorAll('td'), td => { let content = td.innerHTML; 
 
let row = td.parentElement; row.innerHTML = ''; content.split('/').forEach(c => { let td = document.createElement('td'); td.innerHTML = c; row.appendChild(td); }); }); 
 

 
<link href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css" rel="stylesheet" /> 
 
<table id="tbl"> 
 
    <thead> 
 
    <tr class="tbl-header"> 
 
     <th>1</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>UWS</td> 
 
    </tr> 
 
    <tr> 
 
     <td>DA8101A/12.DOH</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC37516JG/DMM/1946P/C.Q4.DUMMY</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC18713DA/DMM/2118P/C.Q4</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC17854DA/DMM/1884P/C.Q5.KIKKER</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC18964DA/DMM/1270P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td contenteditable="false">-PMC13312DA/DMM/1500P/C.Q5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>-PMC81630FF/DMM/2316P/C.Q5.DUMMY</td> 
 
    </tr> 
 
    <tr> 
 

 

 
     <tr> 
 
     <td>-PMC15970DA/DMM/2780P/C.Q5</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC19458DA/DMM/2644P/C.Q5</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC13485DA/DMM/2382P/C.Q5.KIKKER</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC88130FF/DMM/2450P/C.Q5</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC13913DA/DMM/2930P/C.Q5</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC19689DA/DMM/3298P/C.Q5</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PGA2002DA/ORD/2155P/C.Q5.TRANSIT</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC11453DA/DMM/3212P/C.Q5</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC17664DA/ORD/1800P/C.Q4.TRANSIT</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC90443FF/DMM/520P/C.Q5</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC16529DA/DMM/624P/C.Q5</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC72784FF/DMM/4218P/C.Q5.DUMMY</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC94058FF/DMM/3120P/C.Q5.DUMMY</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC91247FF/DMM/3466P/C.Q5.KIKKER</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC38632JG/DMM/3094P/C.Q5</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC19767DA/DMM/3778P/C.Q5</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC16397DA/ORD/1420P/C.Q4.TRANSIT</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC12044DA/DMM/2672P/C.Q4</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC37949JG/DMM/1672P/C.Q6</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC13278DA/ORD/928P/C.PLD.TRANSIT</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC11256DA/ORD/1595P/C.PLD.TRANSIT</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC18938DA/ORD/1458P/C.PLD.TRANSIT</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC12294DA/ORD/4140P/C.PLD.TRANSIT</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC14236DA/ORD/4136P/C.PLD.TRANSIT</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC13867DA/ORD/4126P/C.PLD.TRANSIT</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC7523DA/ORD/4152P/C.PLD.TRANSIT</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC18036DA/ORD/4122P/C.PLD.TRANSIT</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC10478DA/DMM/1548P/C.PWG</td> 
 
     </tr> 
 
     <tr> 
 
     <td>-PMC88389FF/DMM/1164P/C.PLD</td> 
 
     </tr> 
 
    </tbody> 
 
</table>

來源

2017-09-03 Dummy

我將簡化它並在分隔符處分割（'/'），然後加入desi帶有.join（'/'）的結果數組中的紅色項（即第一個和第二個實例）。這樣你所做的就是結合所需的物品 – gavgrif

你可以做這樣的事情：

$('#tbl tr').each(function(){ 
    var $this = $(this); 
    var arr = $this.text().split('/'); 
    var firstTwo = arr.splice(0,2); 
    var firstEl = firstTwo.join('/').trim(); 
    arr.unshift(firstEl); 
    var len = arr.length; 
    var i; 
    var $previous = $this; 
    for (i = 0; i < arr.length; ++i) { 
    var $tr = $this.clone(); 
    $tr.find("td").text(arr[i]); 
    $previous.after($tr); 
    $previous = $tr; 
    } 
    $this.remove(); 
});

要拆分僅第二occurence而不是從第二次出現起：

$('#tbl tr').each(function(){ 
    var $this = $(this); 
    var arr = $this.text().trim().split('/'); 
    var firstTwo = arr.splice(0,2); 
    var firstEl = firstTwo.join('/').trim(); 
    var rest = arr.join('/').trim(); 
    var newArr = []; 

    if(rest !== ''){ 
    newArr.push(firstEl, rest); 
    } else{ 
    newArr.push(firstEl); 
    } 
    var len = newArr.length; 
    var i; 
    var $previous = $this; 
    for (i = 0; i < newArr.length; ++i) { 
    var $tr = $this.clone(); 
    $tr.find("td").text(newArr[i]); 
    $previous.after($tr); 
    $previous = $tr; 
    } 
    $this.remove(); 
});

來源

2017-09-03 09:29:35 adda82

謝謝adda82。這工作 – Dummy

b.t.w.是否有可能得到它也可以工作，例如只分裂第二次事件而不是從第二次事件開始？ – Dummy

我已經在我的答案中包含了新代碼，我希望這是您的需要。如果不讓我知道。 – adda82

如何將TD字符串分成從第n次出現開始的新行

回答

相關問題