javascript - 从外部 html 的表中提取信息

Question

我正在编写一个 GM 脚本来从包含一个表格的网页中删除信息(其中只有一个表格并且没有 ID。)并将该表格中的一些信息附加到现有网页中。除了从 GM_xmlhttprequest 获得的文件中提取信息外，我已经完成了所有工作。

GM_xmlhttpRequest({
  method: 'GET',
  url: tableToBeScrape,
  onload: function (response) {
    var respDoc = response.responseText;
    console.log(respDoc);
    alert(respDoc);
  }
});

respDoc 以完整的 HTML 形式返回网页。但是我很难提取信息。我试过几种方法

var listAllArray = [];
responseHTML = new DOMParser().parseFromString(response.responseText, 'text/html');
listAllArray = responseHTML.getElementsByClassName('table table-bordered table-striped table-condensed');

使用 for 循环并遍历 listAllArray 我没有从数组中得到任何东西。

这是 html 的样子

<table class="table table-bordered table-striped table-condensed">
    <thead>
        <tr>
            <th>Part ID</th>
            <th>Serial Number</th>
            ...
            <th>Location</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            ...
            <td>123</td>
            <td>sn123456</td>
            ...
            <td>shelf 12</td>

        </tr>
    </tbody>
</table>

如何从表中提取部件 ID、序列号和位置？

第 2 部分:我从 response.responseText 得到的响应与我假设的不同。没有 table ，只有 div ul li。

<div class='search_refinements' data-collapsed='true'     data-role='collapsible'>
<h4>Refine Your Results</h4>
<ul data-filter='true' data-role='listview'>
<li data-role='list-divider'>Company Name</li>
<li> ACB Inc. </li>
...
<li data-role='list-divider'>Part</li>
<li> 123 </li>
<li data-role='list-divider'>Serial Number</li>
<li> sn123456</li>
...
<li data-role='list-divider'>Location</li>
<li> shelf 12</li>
</ul>
</div>

Answer 1

鉴于您正在使用 jQuery，

你可以这样做，

var table = $(response.responseText).find("table").find("tbody");

var rows = table.find('tr');
rows.each(function(index, row){
    var columns = $(row).find('td');
    var partId = columns.eq(0).html();
    var serialNumber = columns.eq(1).html();
    var location = columns.eq(2).html();

    console.log("Part Id : " + partId);
    console.log("Serial Number : " + serialNumber);
    console.log("Location : " + location);
});