javascript - 按 ID 识别行，然后按类别识别其中一个单元格

Question

给定这张表:

<table border="1" width="200" id="table1" cellspacing="0" cellpadding="0" style="border-collapse: collapse" bordercolor="#CB2F7F">
    <tr id="st_ppp">
        <td width="60%" class="totalLabels">Price per piece</td>
        <td width="39%" align="right" class="totalElements">unknown</td>
    </tr>
    <tr id="st_qty">
        <td width="60%" class="totalLabels">Quantity</td>
        <td width="39%" align="right" class="totalElements">unknown</td>
    </tr>
    <tr>
        <td width="60%">&nbsp;</td>
        <td width="39%" align="right">&nbsp;</td>
    </tr>
    <tr>
        <td width="60%" class="subTotalLabel">Sub-Total:</td>
        <td width="39%" align="right" class="subTotal">unknown</td>
    </tr>
</table>

我想像下面的伪代码那样做一些事情:

document.getElementById("st_ppp").[td whose class is totalElements].innerHTML="NewPrice";
document.getElementById("st_qty").[td whose class is totalElements].innerHTML="NewQty";

我也乐于接受对 HTML 进行任何其他更改的建议，这些更改将使 JS 更易于使用。

Answer 1

只需使用 querySelector ( MDN link ) 和相应的 CSS 选择器来获取您的元素并更改它们的内容。

document.querySelector( '#st_ppp .totalElements' ).innerHTML = "NewPrice";
document.querySelector( '#st_qty .totalElements' ).innerHTML = "NewQty";