javascript - Html Agility Pack 循环遍历表格 - 将上面的节点添加为表格内的 td，直到下一个标签

Question

我正在尝试循环遍历表格，但位置信息被分组使用。我如何使用每张 table 上的位置信息，直到下一张 table 上的位置信息发生变化？有点卡在这里了。也许在每个表上添加 h4 文本作为 td 可能会解决问题，但我无法做到这一点。我正在使用 selenium Web 驱动程序。

因此每个 h4 内部文本都将用作表格下的位置信息。

示例代码:

<div>
<h4>location1</h4>
<table>
    <colgroup>
        <col class="colwidth3">
        <col class="colwidth3">
        <col class="colwidth4">
        <col class="colwidth4">
        <col class="colwidth4">
    </colgroup>
    <tbody>
        <tr>
            <td></td>
            <td></td>
            <td>16 May 2017</td>
            <td>fdfds</td>
            <td></td>
        </tr>
    </tbody>
</table>
<h4>location2</h4>
<table>
    <colgroup>
        <col class="colwidth3">
        <col class="colwidth3">
        <col class="colwidth4">
        <col class="colwidth4">
        <col class="colwidth4">
    </colgroup>
    <tbody>
        <tr>
            <td></td>
            <td></td>
            <td>21 May 2017</td>
            <td>ghghhgh</td>
            <td></td>
        </tr>
    </tbody>
</table>
<table>
    <colgroup>
        <col class="colwidth3">
        <col class="colwidth3">
        <col class="colwidth4">
        <col class="colwidth4">
        <col class="colwidth4">
    </colgroup>
    <tbody>
        <tr>
            <td></td>
            <td></td>
            <td>25 May 2017</td>
            <td>hgfhfghfgh</td>
            <td></td>
        </tr>
    </tbody>
</table>
<h4>location3</h4>
<table>
    <colgroup>
        <col class="colwidth3">
        <col class="colwidth3">
        <col class="colwidth4">
        <col class="colwidth4">
        <col class="colwidth4">
    </colgroup>
    <tbody>
        <tr>
            <td></td>
            <td></td>
            <td>29 May 2017</td>
            <td>ghhfhgfhfg</td>
            <td></td>
        </tr>
    </tbody>
</table>
<table>
    <colgroup>
        <col class="colwidth3">
        <col class="colwidth3">
        <col class="colwidth4">
        <col class="colwidth4">
        <col class="colwidth4">
    </colgroup>
    <tbody>
        <tr>
            <td></td>
            <td></td>
            <td>03 Jun 2017</td>
            <td>hjhjhj</td>
            <td></td>
        </tr>
    </tbody>
</table>
<h4>location4</h4>
<table>
    <colgroup>
        <col class="colwidth3">
        <col class="colwidth3">
        <col class="colwidth4">
        <col class="colwidth4">
        <col class="colwidth4">
    </colgroup>
    <tbody>
        <tr>
            <td></td>
            <td></td>
            <td>2 Jul 2017</td>
            <td>jujujuj</td>
            <td></td>
        </tr>
    </tbody>
</table>

Answer 1

如果您可以将 h4+table 包装到 div 中，则可以通过以下方式将所有内容包装到列表中:

var elements = document.querySelectorAll('your_selector');

并迭代:

for (var i = 0; element = elements[i]; i++) {
h4header = element.getElementsByTagName('h4');
location = h4header.value;
table = element.getElementsByTagName('table');
// than you can do your rows via for (var i = 0, row; row = table.rows[i]; i++)
};

但是这个解决方案有点慢