如何使用 jquery/php 替换 td 中的值？ （wordpress）

Question

我在下面有一个 html 代码（使用插件创建）。
我需要将 colspan="6" 更改为 colspan="4"。
我在下面尝试了 jQuery，但它不起作用...
你能帮帮我吗？

<table class="shop_table">
   <thead>
       <tr><th></tr></th>
   </thead>
   <tbody>
    <tr><td class="aa"></td></tr>
    <tr><td class="bb"></td></tr>
    <tr><td class="cc" colspan="6"></td></tr>
   <tbody>
</table>

$('.shop_table').find('td:last-child').contents().filter(function() {
    return this.nodeType===3;
}).remove().end().end().find('colspan="6"').replaceWith($(('colspan="4"'));

谢谢。

Answer 1

使用选择器[colspan="6"]，您可以访问每一个并设置一个新属性：

$('.shop_table [colspan="6"]').each(function() {
  this.setAttribute('colspan', '4');
});
console.log($('table').html());

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="shop_table">
   <thead>
       <tr><th></th></tr>
   </thead>
   <tbody>
    <tr class="aa"><td></td></tr>
    <tr class="bb"><td></td></tr>
    <tr class="cc" colspan="6"><td></td></tr>
   <tbody>
</table>

或者，没有 jQuery：

for (const elm of document.querySelectorAll('.shop_table [colspan="6"]')) {
  elm.setAttribute('colspan', '4');
}
console.log(document.querySelector('table').innerHTML);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="shop_table">
   <thead>
       <tr><th></th></tr>
   </thead>
   <tbody>
    <tr class="aa"><td></td></tr>
    <tr class="bb"><td></td></tr>
    <tr class="cc" colspan="6"><td></td></tr>
   <tbody>
</table>

Answer 2

您可以使用prop() 或attr()，这两种方法都会遍历所有这些方法

$('.shop_table td[colspan="6"]').prop('colSpan', 4)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="shop_table" border=1>
   <thead>
       <tr><th>111</th><th>111</th><th>111</th><th>111</th><th>111</th><th>111</th><th>111</th></tr>
   </thead>
   <tbody>
    <tr><td class="aa">222</td></tr>
    <tr><td class="bb">333</td></tr>
    <tr><td class="cc" colspan="6">444</td></tr>
     <tr><td class="aa">222</td></tr>
    <tr><td class="bb">333</td></tr>
    <tr><td class="cc" colspan="6">444</td></tr>
   <tbody>
</table>

Answer 3

嘿，你的问题的简单答案是这样的：

$("table tr:last td[colspan=6]").attr('colspan',4);

我选择表格，然后是最后一个 TR，然后是代表您要更改的 TD。

然后我添加属性 colspan 4.

这是一个显示它工作的代码笔：https://codepen.io/SweetChillyPhilly/pen/MWJbBPo

这里是 SO question，您可以在其中详细了解该解决方案是如何形成的 Replacing Colspan = "2" with Colspan = "4" using Jquery