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

Html Agility Pack Loop Through Tables - Adding node above as td inside tables until next tag

我正在尝试遍历 tables,但位置信息是按分组使用的。我怎样才能在每个 table 上使用位置信息,直到它在下一次发生变化?有点卡在这里。也许在每个 table 上添加 h4 文本作为 td 可能会解决问题,但我无法做到这一点。我正在使用 selenium 网络驱动程序。

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

示例代码:

<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>

如果您可以将 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++)
};

但是这个解决方案有点慢

我想出了js解决方案

 function test() {
                var loc = "";
                $('div').children().each(function () {
                    var type = $(this).prop('tagName');
                    if (type == "H4")
                    {
                        loc = $(this).text();
                    }
                    else if (type=="TABLE")
                    {
                        $(this).find('td').eq(0).before('<td>' + loc + '</td>');
                    }
                });
            }