如何使用 Puppeteer 在 href 中没有 link 的情况下在 <a href> 标签内获取文本

Question

我想在标签内抓取一些日期，但我不想获取其中的 link。

不太确定如何解决这个问题，因为标签没有 ID 或类

<div id="list-section">
    <ul>
        <li data-store-id="1234">
            <div class="item">
                <p>
                    <strong>
                    <a target="_blank" href="www.somelink.com"> NAME ONE </a>
                    </strong>
                </p>
            </div>
        </li>
        <li data-store-id="1234">
            <div class="item">
                <p>
                    <strong>
                    <a target="_blank" href="www.somelink.com"> NAME TWO </a>
                    </strong>
                </p>
            </div>
        </li>
    </ul>
</div>

我试图将数组中的每个名字都放在末尾 [NAME ONE, NAME TWO] 等

编辑：将 node 与 puppeteer 结合使用

Answer 1

有一种查找元素的方法在名为 xpath 的网络抓取时非常有用。从未使用过 puppeteer，但最近我使用了很多 selenium，并且我使用了很多 xpath。

只是快速浏览了 puppeteer 的文档，我发现了一些可能对您有用的东西。

https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagexexpression

由于我没有完整的 html 页面，所以我制作了一个简单的 xPath 来展示它的强大功能。

//div[@class='item']//a

您还可以测试 xpath 打开 Google Chrome DevTools 在“Elements”选项卡中并按 CTRL+F

这是一个很好的网页抓取工具。

Answer 2

您可以分两步将名称放入数组中：

Select锚标签<a>...</a>
得到他们内心的HTMLs

正如 Douglas 之前提到的，您可以使用 XPath，但在这种情况下，简单的 CSS select or 就可以很好地完成工作。作为 CSS select 或者，许多组合可以获得锚标记：#list-section a、ul a...

选择最适合您且以后最不可能刹车的那一款。我推荐使用第一个：

const anchorTags = await page.$$("#list-section a")

关于获取元素的内部HTML，这个一定能帮到你。我的首选方法是定义一个单独的异步函数，如下所示：

async function getInnerHtml(page, target){
  const innerHTML = await page.evaluate(el => el.innerHTML, target)
  return innerHTML
}

这样你就可以在你的数组上循环并在你的锚标签上调用它。

不要忘记，构建爬虫的方法总是有很多种。在我看来，您似乎过于关注该元素，并且想要 select 它 准确地 。还有就是要好好把握CSSselector，尤其是CSS combbinators.

干杯

如何使用 Puppeteer 在 href 中没有 link 的情况下在 <a href> 标签内获取文本

How to get text inside <a href> tag without the link in href, with Puppeteer

html

testing

web-scraping

puppeteer