javascript - 更改使用 JQuery 的日期

Question

我正在尝试使用 jquery 将所有表的到期日期值从 31 日更改为 25 日。我正在使用的当前代码不起作用，因为它正在放置所有值而不是单个值。

         var dueDate1 = $("td:contains(/31/)").text();
         var dueDate = dueDate1.replace(/31/g, "25");
         $("td:contains(/31/)").text(dueDate);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
        <thead>
        <tr>
            <th>Due Date</th>
            <th>Amount</th>
        </tr>
        </thead>    
        <tbody>
            <tr>
            <td data-title="Due Date">08/31/21</td>
            <td data-title="Amount">$500</td>
            </tr>
            <tr>
            <td data-title="Due Date">07/31/21</td>
            <td data-title="Amount">$1500</td>
            </tr>
            <tr>
            <td data-title="Due Date">06/31/21</td>
            <td data-title="Amount">$2500</td>
            </tr>
        </tbody>
    </table>

标签： javascriptjquery

Answer 1

您的尝试是同时处理整个数据集。

$("td:contains(/31/)").text();将返回所有单元格的所有文本。

相反，循环遍历单元格并单独更新它们。

$("td:contains('31')").each(function(idx, element){
  $(element).text($(element).text().replace("31", "25"));
});

td { padding:2px; border:1px solid grey; } 

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
        <thead>
        <tr>
            <th>Due Date</th>
            <th>Amount</th>
        </tr>
        </thead>    
        <tbody>
            <tr>
            <td data-title="Due Date">08/31/21</td>
            <td data-title="Amount">$500</td>
            </tr>
            <tr>
            <td data-title="Due Date">07/31/21</td>
            <td data-title="Amount">$1500</td>
            </tr>
            <tr>
            <td data-title="Due Date">06/31/21</td>
            <td data-title="Amount">$2500</td>
            </tr>
        </tbody>
    </table>