无法利用应用程序脚本中的 CSS 选择器获取下一页链接

Question

我正在尝试使用应用程序脚本中的CSS选择器从此网页中抓取下一页链接，但结果我总是得到

undefined

，即使我定义的选择器是正确的。

function fetchInformation() {
  const Url = 'https://www.yellowpages.ca/search/si/1/window/Vancouver+BC';
  const userAgent = 'Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like  Gecko) Chrome/88.0.4324.150 Safari/537.36';

  var getOptions = {
    'method': 'GET',
    'headers' : {
       'User-Agent': userAgent
     },
    'muteHttpExceptions': true,
  };

  var response = UrlFetchApp.fetch(Url, getOptions);
  console.log(response.getResponseCode())
  var $ = Cheerio.load(response.getContentText());
  var nextPage = $("a[data-analytics*='load_more'].pageButton").first().attr('href');
  console.log(nextPage);

}

如何使用脚本中的 CSS 选择器获取下一页链接？

Answer 1

您使用的选择器适用于实时页面，而不是静态页面。页面加载后通过 JS 更新元素，fetch 不执行 JS。

您在静态 HTML 中找到的链接是这样的：

<a href="/search/si/2/window/Vancouver+BC"
   data-analytics='{"event_name":"click - load_more - Serp ", ...>

所以尝试一下：

const selector =
  `[data-analytics^='{"event_name":"click - load_more - Serp "']`;
console.log(document.querySelector(selector).href);

<a href="/search/si/2/window/Vancouver+BC" data-analytics='{"event_name":"click - load_more - Serp ","lk_se_id":"515ede01-a8ee-49cd-8152-6fb210b128cf_d2luZG93_VmFuY291dmVyIEJD","lk_name":"next_serp"}'
class="ypbtn btn-theme pageButton" >Next
>></a>

我还没有在 GAS 中对此进行测试，但假设请求通过，它应该可以工作。