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得到的回答与我的假设有所不同。没有表格，而是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

你可以解析它并创建一个DOM元素并找到你需要的东西。

var tableDom = $(response.responseText);
var th = tableDom.find('th');
var td = tableDom.find('td');

现在迭代td并获取所有jQuery对象的text()，或者所有原始DOM对象的innerText

var data = {};
td.each(function(item,idx){
    data[th[idx].innerText] = item.innerText;
});

现在您只需使用

即可获得所需列的值

data["some column name"];

Answer 2

鉴于您使用的是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);
});

从外部html中提取表格中的信息

2 个答案: