Javascript:在HTML表中,如何从一列中选择部分文本(匹配一些正则表达式),并将其移动到下一列

Javascript: in an HTML table, how to select part of text (matching some regex) from one column, and move it to the next one?

本文关键字:一列 正则表达式 移动 文本 HTML 表中 选择部 Javascript      更新时间:2023-09-26

我有一个HTML表,例如2列
第一个中的数据是这样的:(第二个是空的-我用_作为"空"-)

1 (5%)  |  _  
2 (10%) |  _  
3 (15%) |  _

供参考的是:

<table id="my_table" >
<tbody>
<tr>
<td>1 (5%)</td>
<td></td>
</tr>
<tr>
<td>2 (10%)</td>
<td></td>
</tr>
<tr>
<td>3 (15%)</td>
<td></td>
</tr>
</tbody>
</table>

对于该列的每个单元格,我都需要(在javascript-greatemonkey-中)
要移动括号内的数字(=正则表达式匹配),
到它旁边的单元格,即到第二列
因此,表格将转换为

1 | 5%  
2 | 10%  
3 | 15%

即:

<table id="my_table" >
<tbody>
<tr>
<td>1</td>
<td>5%</td>
</tr>
<tr>
<td>2</td>
<td>10%</td>
</tr>
<tr>
<td>3</td>
<td>15%</td>
</tr>
</tbody>
</table>

如何做到这一点?

以下是一些简单的函数,可以迭代表的行并执行您想要的操作。modTable函数假定传递了一个id,但它可能是对该表的引用。

function modTable(id) {
  var table = document.getElementById(id);
  var row, rows = table.rows;
  var cell, cells, text, t0, t1;
  for (var i=0, iLen=rows.length; i<iLen; i++) {
    row = rows[i];
    text = getText(row.cells[0]);
    // Get just leading digits
    t0 = text.replace(/'D+.*/,'');
    // Get just the part in brackets
    t1 = text.replace(/(^.+'()|(').*$)/g,'');
    // Set new values
    setText(row.cells[0], t0);
    setText(row.cells[1], t1);
  }
}
// Simple helpers for modern and older browsers
// Get textContent of an element
function getText(el) {
  return el.textContent || el.innerText || '';
}
// Set the textContent of an element
function setText(el, text) {
  if (typeof el.textContent == 'string') {
    el.textContent = text;
  } else if (typeof el.innerText == 'string') {
    el.innerText = text;
  }
}

可以通过按钮调用:

<button onclick="modTable('my_table');">Modify the table</button>