JavaScript,获取没有 ID 的 table 的值

JavaScript, get value of table without ID

这是我的 table,我想获得 "Spielzeit" 和 "Coins" 的值。

我试过很多像

document.querySelector("div.page Spielzeit");

document.getElementById('page').getElementsByTagName('th');

document.querySelectorAll("#page th");  

但没有任何效果。

我找不到我的 table,因为没有 table id。

也许你知道如何"find"我的价值观。

谢谢

<div id="page">
    <table style="margin-left: 125px; margin-top:50px; width: 300px;">
        <tbody>
            <tr>
                <th style="text-align: left;">Benutzername:</th>
                <th style="color: #9e7538; text-align: right;">Dantes999</th>
            </tr>
            <tr>
                <th style="text-align: left;">Reich:</th>
                <th style="color: #9e7538; text-align: right;">Not empire</th>
            </tr>
            <tr>
            </tr>
            <tr>
                <th style="text-align: left;">Charaktere:</th>
                <th style="color: #9e7538; text-align: right;">0</th>
            </tr>
            <tr>
                <th style="text-align: left;">Spielzeit:</th>
                <th style="color: #9e7538; text-align: right;"> Minuten</th>
            </tr>
            <tr>
                <th style="text-align: left;">Coins:</th>
                <th style="color: #9e7538; text-align: right;">0 I-Coins</th>
            </tr>
            <tr>
                <th style="text-align: left;">Coins:</th>
                <th style="color: #9e7538; text-align: right;">0 V-Coins</th>
            </tr>
            <tr>
                <th style="text-align: left;">Lagerpasswort:</th>
                <th style="color: #9e7538; text-align: right;">000000</th>
            </tr>
            <tr>
                <th style="text-align: left;">Loeschcode:</th>
                <th style="color: #9e7538; text-align: right;">1234567</th>
            </tr>
        </tbody>
    </table>
</div>

如果您的页面上只有一个 table,document.querySelector("table").get(0) 应该会给您 table。

其次,page 是您 HTML 中的一个 ID,而不是 class。所以它应该是 selected with # 而不是 .

您可以将 HTML 更改为:

<div id="page">

<table style="margin-left: 125px; margin-top:50px; width: 300px;">
    <tbody><tr>
        <th class="item" style="text-align: left;">Benutzername:</th> <th class="value" style="color: #9e7538; text-align: right;">Dantes999</th>
    </tr>
    <tr>
        <th class="item" style="text-align: left;">Reich:</th> <th 
class="value" style="color: #9e7538; text-align: right;">Not empire</th>
    </tr><tr>
    </tr><tr>
        <th class="item" style="text-align: left;">Charaktere:</th> 
<th class="value" style="color: #9e7538; text-align: right;">0</th>
    </tr>
    <tr>
        <th class="item" style="text-align: left;">Spielzeit:</th> <th 
  class="value" style="color: #9e7538; text-align: right;"> Minuten</th>
    </tr>
    <tr>
        <th class="item" style="text-align: left;">Coins:</th> <th 
 class="value" style="color: #9e7538; text-align: right;">0 I-Coins</th>
    </tr>
    <tr>
        <th class="item" style="text-align: left;">Coins:</th> <th 
 class="value" style="color: #9e7538; text-align: right;">0 V-Coins</th>
    </tr>

    <tr>
        <th class="item" style="text-align: left;">Lagerpasswort:</th> <th class="value" style="color: #9e7538; text-align: right;">000000</th>
    </tr>
    <tr>
        <th class="item" style="text-align: left;">Loeschcode:</th> <th class="value" style="color: #9e7538; text-align: right;">1234567</th>
    </tr>

    </tbody></table>

现在您可以使用 document.querySelector(".item[text='Spielzeit']); 来 select 相应的项目并获取它的下一个元素的文本作为值

所以你的代码应该是:

var elem = document.querySelector(".item[text='Spielzeit']");
var value = elem.parentNode.querySelectorAll('.value').html;