jQuery从href链接中提取html

Question

此Meteor服务器端使用Cheerio从

中提取98771

<li><a href="http://www.postcodes-california.com/postcodes/98771" title="Postcode 98771, California">98771</a>

恰好是数组postcodesLinks中的第33号链接。

我只想获取页面上所有帖子代码的列表，以便我可以将它们保存到mongodb集合中。

let $ = cheerio.load(response.content);
let postcodeLinks = $('a[title^=Postcode]');
console.log(postcodeLinks.length); // <----- this works fine
console.log(postcodeLinks[33].html()); // <----- this fails
console.log(postcodeLinks[33].text()); // <----- this fails

Answer 1

_{Cheerio基于jQuery，所以我会在这个答案中使用Cheerio / jQuery互换，因为核心概念是相同的......}

当您使用765 之类的jQuery选择器时，会返回jQuery object，这实际上是DOM elements的类似数组的集合。

您正在使用$('a[title^=Postcode]')的索引访问集合中的一个元素，这意味着您尝试在本机DOM元素上使用jQuery方法postcodeLinks[33]和.html() 。由于jQuery方法没有在原生HTML元素上实现，因此无效。

因此，您需要在jQuery对象上使用.text() / .html()方法。

一种选择是使用.eq() method（在jQuery和Cheerio中都实现）。这样做时，.text()方法将通过索引访问元素并返回一个jQuery对象：

.eq()

或者，您也可以使用postcodeLinks.eq(33).html() // or.. postcodeLinks.eq(33).text() 包装DOM元素，以便将其转换回jQuery对象：

$()

Answer 2

jQuery .html()期望得到一个jQuery对象，所以你需要：将postcodeLinks[33]包装成$()，如：

$(postcodeLinks[33]).html()

＆＃13;

＆＃13;

let postcodeLinks = $('a[title^=Postcode]');
console.log(postcodeLinks.length); // <----- this works fine
console.log($(postcodeLinks[33]).html()); // <----- this works fine

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
    <li><a href="http://www.postcodes-california.com/postcodes/98771" title="Postcode 98771, California">98771</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98772" title="Postcode 98772, California">98772</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98773" title="Postcode 98773, California">98773</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98774" title="Postcode 98774, California">98774</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98775" title="Postcode 98775, California">98775</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98776" title="Postcode 98776, California">98776</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98777" title="Postcode 98777, California">98777</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98778" title="Postcode 98778, California">98778</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98779" title="Postcode 98779, California">98779</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98780" title="Postcode 98780, California">98780</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98781" title="Postcode 98781, California">98781</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98782" title="Postcode 98782, California">98782</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98783" title="Postcode 98783, California">98783</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98784" title="Postcode 98784, California">98784</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98785" title="Postcode 98785, California">98785</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98786" title="Postcode 98786, California">98786</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98787" title="Postcode 98787, California">98787</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98788" title="Postcode 98788, California">98788</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98789" title="Postcode 98789, California">98789</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98790" title="Postcode 98790, California">98790</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98791" title="Postcode 98791, California">98791</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98792" title="Postcode 98792, California">98792</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98793" title="Postcode 98793, California">98793</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98794" title="Postcode 98794, California">98794</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98795" title="Postcode 98795, California">98795</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98796" title="Postcode 98796, California">98796</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98797" title="Postcode 98797, California">98797</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98798" title="Postcode 98798, California">98798</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98799" title="Postcode 98799, California">98799</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98800" title="Postcode 98800, California">98800</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98801" title="Postcode 98801, California">98801</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98802" title="Postcode 98802, California">98802</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98803" title="Postcode 98803, California">98803</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98804" title="Postcode 98804, California">98804</a></li>
    <li><a href="http://www.postcodes-california.com/postcodes/98805" title="Postcode 98805, California">98805</a></li>
</ul>

＆＃13;

＆＃13;

＆＃13;

在没有jQuery的情况下做同样的事情看起来更像你期望的那样：

＆＃13;

＆＃13;

let postcodeLinks = document.querySelectorAll('a[title^=Postcode]');
console.log(postcodeLinks.length); // <----- this works fine
console.log(postcodeLinks[33].innerHTML); // <----- this works fine

＆＃13;

<ul>
      <li><a href="http://www.postcodes-california.com/postcodes/98771" title="Postcode 98771, California">98771</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98772" title="Postcode 98772, California">98772</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98773" title="Postcode 98773, California">98773</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98774" title="Postcode 98774, California">98774</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98775" title="Postcode 98775, California">98775</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98776" title="Postcode 98776, California">98776</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98777" title="Postcode 98777, California">98777</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98778" title="Postcode 98778, California">98778</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98779" title="Postcode 98779, California">98779</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98780" title="Postcode 98780, California">98780</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98781" title="Postcode 98781, California">98781</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98782" title="Postcode 98782, California">98782</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98783" title="Postcode 98783, California">98783</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98784" title="Postcode 98784, California">98784</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98785" title="Postcode 98785, California">98785</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98786" title="Postcode 98786, California">98786</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98787" title="Postcode 98787, California">98787</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98788" title="Postcode 98788, California">98788</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98789" title="Postcode 98789, California">98789</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98790" title="Postcode 98790, California">98790</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98791" title="Postcode 98791, California">98791</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98792" title="Postcode 98792, California">98792</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98793" title="Postcode 98793, California">98793</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98794" title="Postcode 98794, California">98794</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98795" title="Postcode 98795, California">98795</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98796" title="Postcode 98796, California">98796</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98797" title="Postcode 98797, California">98797</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98798" title="Postcode 98798, California">98798</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98799" title="Postcode 98799, California">98799</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98800" title="Postcode 98800, California">98800</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98801" title="Postcode 98801, California">98801</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98802" title="Postcode 98802, California">98802</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98803" title="Postcode 98803, California">98803</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98804" title="Postcode 98804, California">98804</a></li>
      <li><a href="http://www.postcodes-california.com/postcodes/98805" title="Postcode 98805, California">98805</a></li>
  </ul>

＆＃13;

＆＃13;

＆＃13;