如何给HTMLtable中一列的所有单元格添加样式属性？

Question

所以我有一个巨大的 HTML Table，我在下面插入了其中的一些：

<thead>
  <tr class="tableizer-firstrow">
    <th>Name</th>
    <th>Language</th>
    <th>Pages</th>
    <th>Author</th>
    <th>Publisher</th>
    <th>Category</th>
    <th>Class 1</th>
    <th>Class 2</th>
    <th>Class 3</th>
    <th>Class 4</th>
    <th>Class 5</th>
    <th>Class 6</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>Sarvanna Shikshan- Swapna Navhe Hakka!</td>
    <td>Marathi</td>
    <td>64</td>
    <td>Vinaya Deshpande</td>
    <td>Bharat Gyan Vigyan Samuday (BGVS) Maharashtra</td>
    <td>Uncategorized</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>Apalya Gavat Aple Arogya</td>
    <td>Marathi</td>
    <td>&nbsp;</td>
    <td>-</td>
    <td>Cehat Pune</td>
    <td>Uncategorized</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</tbody>

我有几千行，但我想要的每一行都是这样的

<tr>
  <td class="name">Sarvanna Shikshan- Swapna Navhe Hakka!</td>
  <td class="Language">Marathi</td>
  <td class="Pages">64</td>
  <td class="Author">Vinaya Deshpande</td>
  <td class="Publisher">Bharat Gyan Vigyan Samuday (BGVS) Maharashtra</td>
  <td class="Category">Uncategorized</td>
  <td class="Class 1">&nbsp;</td>
  <td class="Class 2">&nbsp;</td>
  <td class="Class 3">&nbsp;</td>
  <td class="Class 4">&nbsp;</td>
  <td class="Class 5">&nbsp;</td>
  <td class="Class 6">&nbsp;</td>
</tr>

有什么方法可以为所有单元格插入这个吗？也许搜索和替换每 13 次迭代或类似的操作？无论如何，我无法手动执行此操作。对不起，如果它在错误的话题中，我对 Whosebug 不是很熟悉。

Answer 1

这是一个 javascript 解决方案：您始终可以在浏览器中运行它，然后 copy/paste DevTool 的输出。

注意： Class属性不能包含space。如果是，该元素将有 2 class。例如：Class 和 1 而不仅仅是 Class 1

var cls = ['name', 'Language', 'Pages', 'Author', 'Publisher', 'Category', 'Class-1', 'Class-2', 'Class-3', 'Class-4', 'Class-5', 'Class-6'];

[].forEach.call(document.querySelectorAll('tbody > tr'), function(row) {
  [].forEach.call(row.querySelectorAll('td'), function(cell, index) {
    cell.classList.add(cls[index]);
  });
});

table {
  border-collapse:collapse;  
}

td {
  border:1px solid;  
}

<table>
  <thead>
    <tr class="tableizer-firstrow">
      <th>Name</th>
      <th>Language</th>
      <th>Pages</th>
      <th>Author</th>
      <th>Publisher</th>
      <th>Category</th>
      <th>Class 1</th>
      <th>Class 2</th>
      <th>Class 3</th>
      <th>Class 4</th>
      <th>Class 5</th>
      <th>Class 6</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Sarvanna Shikshan- Swapna Navhe Hakka!</td>
      <td>Marathi</td>
      <td>64</td>
      <td>Vinaya Deshpande</td>
      <td>Bharat Gyan Vigyan Samuday (BGVS) Maharashtra</td>
      <td>Uncategorized</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>Apalya Gavat Aple Arogya</td>
      <td>Marathi</td>
      <td>&nbsp;</td>
      <td>-</td>
      <td>Cehat Pune</td>
      <td>Uncategorized</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
  </tbody>
</table>

Answer 2

备份 HTML 代码，因为这可能会失败！

首先在Notepad++中打开html。在搜索选项 (Ctrl+F) 中打开 "Search and replace"。检查 "Regular Expresssion" 选项和 "find \r and \n" 选项。

这是搜索文本：

<tr>(.*?)\r\n(.*?)<td>(.*?)</td>\r\n(.*?)<td>(.*?)</td>\r\n(.*?)<td>(.*?)</td>\r\n(.*?)<td>(.*?)</td>\r\n(.*?)<td>(.*?)</td>\r\n(.*?)<td>(.*?)</td>\r\n(.*?)<td>(.*?)</td>\r\n(.*?)<td>(.*?)</td>\r\n(.*?)<td>(.*?)</td>\r\n(.*?)<td>(.*?)</td>\r\n(.*?)<td>(.*?)</td>\r\n(.*?)<td>(.*?)</td>\r\n(.*?)</tr>

单击 "replace all" 或单击 "replace" 逐步进入低谷。

这是替换的样子：

<tr>\r\n<td class=\"name\"></td>\r\n<td class=\"Language\"></td>\r\n<td class=\"Pages\"></td>\r\n<td class=\"Author\"></td>\r\n<td class=\"Publisher\"></td>\r\n<td class=\"Category\"></td>\r\n<td class=\"Class 1\"></td>\r\n<td class=\"Class 2\"></td>\r\n<td class=\"Class 3\"></td>\r\n<td class=\"Class 4\"></td>\r\n<td class=\"Class 5\"></td>\r\n<td class=\"Class 6\"></td>\r\n</tr>

我不是最好的程序员，所以你。我希望这适用于所有人，因为我刚刚在您给我们的小片段上对其进行了测试。

如何给HTMLtable中一列的所有单元格添加样式属性？

How to add style attribute to all cells of a coloumn in a HTML table?

html

replace

text-manipulation