web-dev-qa-db-ja.com

cheerio / jqueryセレクター:ネストされたdiv内の要素のリストを取得する方法?

これに似たマークアップをHTMLページから解析する必要があります。

<div id="list">

  <div class="item-level-a">
    <div class="item-level-b">
      <a href="http://www.example.com/1"></a>
    </div>
  </div>

  <div class="item-level-a">
    <div class="item-level-b">
      <a href="http://www.example.com/2"></a>
    </div>
  </div>

  <div class="item-level-a">
    <div class="item-level-b">
      <a href="http://www.example.com/3"></a>
    </div>
  </div>

</div>

私はこのコードで試しました:

$list = [];
$('div[id="list"]').each(function() {
  var href = $(this).find('div > div > a').attribs('href');
  list.Push(href);
});

成功なし:エラーは:

TypeError: Object <a href="http://www.example.com/1"></a>
                  <a href="http://www.example.com/2"></a>
                  <a href="http://www.example.com/3"></a>
has no method 'attribs'

:-(。

どんな手掛かり?

7
MarcoS

cheerioおよびjqueryでは、attr()ではなく、attrib()を使用して属性を取得します。

コードには他にもいくつか問題があります。これはcheerioを使用した作業バージョンです。おそらくこの方法でもjqueryで動作します。:

var list = [];
$('div[id="list"]').find('div > div > a').each(function (index, element) {
  list.Push($(element).attr('href'));
});
console.dir(list);
13
Trott

機能的なスタイルを好む人のために:

const list = $('div[id="list"]')
  .find('div > div > a')
  .toArray()
  .map(element => $(element).attr('href')));
1
sdgfsdh