Блог

Главная - Вопросы по программированию - Как получить первый класс из двух одинаковых классов с помощью cheerio

Как получить первый класс из двух одинаковых классов с помощью cheerio

#javascript #node.js #cheerio

#javascript #node.js #приветствие #cheerio

Вопрос:

в настоящее время я создаю веб-скребок с помощью node.Js использует cheerio. я хочу получить данные внутри первого из class="panel-items-list .

html-код выглядит следующим образом

 <div class="margin-bottom-=30">
  <div class="side-list-panel">
    <ul class="panel-item-list">...</ul>
  </div>
</div>
<div class="margin-bottom-=30">
  <div class="side-list-panel">
    <ul class="panel-item-list">...</ul>
  </div>
</div>

мне уже это нравилось

 const relateArticle = $('.panel-items-list').map((i, section)=>{
                    let articles = $(section).find('h5');
                    return articles.text();

                }).get();

но он возвращает данные из обоих class="panel-items-list" . как мне получить данные только из одного класса ? извините, у меня плохой английский. заранее спасибо!

Комментарии:

1. попробуйте добавить индекс нужного элемента .get(0)

2. выбранный вами класс есть, panel-items-list но на самом деле он panel-item-list в вашем HTML….

3. Ваш селектор ‘.panel-items-list’ не соответствует ни одному из элементов, представленных вами в разметке, не могли бы вы добавить больше контекста к примеру?

Ответ №1:

Чтобы получить первый класс только из .panel-item-list использования .get(0) , это означает, что вы выбираете только первый индекс, найденный с помощью .map

Кроме того, в вашем текущем code jQuery вы не выбираете правильный class селектор.

Кроме того, используйте метод .trim() при получении текста, чтобы очистить любые невидимые пробелы в тексте.

Живая рабочая демонстрация:

 const relateArticle = $('.panel-item-list').map((i, section) => {
  let articles = $(section).find('h5');
  return articles.text().trim();
}).get(0)

console.log(relateArticle) //Foo  
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="margin-bottom-=30">
  <div class="side-list-panel">
    <ul class="panel-item-list">
      <h5>
        Foo
      </h5>
    </ul>
  </div>
</div>
<div class="margin-bottom-=30">
  <div class="side-list-panel">
    <ul class="panel-item-list">
      <h5>
        Bar
      </h5>
    </ul>
  </div>
</div>

Ответ №2:

Используйте сначала():

 $('.panel-items-list').first().find('h5').text()