如何使用纯JS抓取表的第n列的值

How to scrape the values of the n-th column of a table with pure JS?

本文关键字:何使用 JS 抓取      更新时间:2023-09-26

我一直在网站上寻找这个答案,但所有的答案似乎都是jQuery特定的。

我正在使用Casper JS构建一个scraper,我找不到正确的方法来选择列n的值,其中n是我指定的任意数字。

我是这样选择表格的:

document.querySelector('table.table-responsive.table-noborder');

,我得到了一个表元素,但从那里,我不知道如何向前移动,以获得特定列的内容,而不必迭代整个表(这是我最终做的,以获得数据)

谢谢!

您可以使用document.getElementsByTagName('table')[m]访问相关的第m个索引表。

同样,您可以遍历表内部,并通过innerHTML或nodeValue

获取文本内容。
document.getElementsByTagName('table')[2].getElementsByTagName('tr')[1].childNodes[0].innerHTML
document.getElementsByTagName('table')[2].getElementsByTagName('tr')[1].childNodes[0].nodeValue

您可以编写自己的函数,很好地插入到casper中。这将遍历所有行中的第n个tdth,并将innerText属性的值写入结果数组:

casper.tableColumnText = function(tableSelector, columnNumber, withHeader, merged){
    // columnNumber starts with 1
    var texts = this.evaluate(function(tableSelector, columnNumber, withHeader){
        var headerFields = document.querySelectorAll(tableSelector + " > thead > tr > th:nth-child("+columnNumber+")"),
            bodyFields = document.querySelectorAll(tableSelector + " > tbody > tr > td:nth-child("+columnNumber+")"),
            result = [];
        if (withHeader) {
            Array.prototype.forEach.call(headerFields, function(headerField){
                result.push(headerField.innerText);
            });
        }
        Array.prototype.forEach.call(bodyFields, function(bodyField){
            result.push(bodyField.innerText);
        });
        return result;
    }, tableSelector, columnNumber, withHeader);
    if (merged) {
        return texts.join(' ');
    }
    return texts;
};

tbody将被浏览器(幻影)注入,即使它不存在于原始标记中。