Exemplo guiado

lobste.rs

Este é um caso mais irregular do que Hacker News. Cada item mistura score, título, URL, domínio, tags, byline variável e comentários que podem vir como número ou no comments.

lista editorialmodo listirregularidade alta

Objetivo

Extrair links da home

  • título
  • url
  • pontos
  • comentários

URL alvo:

lobste.rs/s/xijpr1/ipv6_traffic_crosses_50_mark

Como preencher

Schema revisado antes de publicar

No modo da extração, selecione list. Para cada dado desejado, preencha um set com:

  • Nome do campo
  • Tipo
  • Descrição
  • Hint de seletor

Nome do campo: título

Tipo: string

Descrição: Título do item na listagem

Hint de seletor: ol.stories li.story .details .link a.u-url

Nome do campo: url

Tipo: url

Descrição: URL principal do item na listagem

Hint de seletor: ol.stories li.story .details .link a.u-url

Nome do campo: pontos

Tipo: number

Descrição: Pontos do item na listagem

Hint de seletor: ol.stories li.story .voters a.upvoter

Nome do campo: comentários

Tipo: string

Descrição: Quantidade de comentários do item na listagem

Hint de seletor: ol.stories li.story .comments_label a

Estrutura do item

Como ler a página mentalmente

Um item da home costuma aparecer assim:

<li class="story"><div class="voters"><a class="upvoter" href="/login">51</a></div><div class="details"><span class="link"><a class="u-url" href="https://www.google.com/intl/en/ipv6/statistics.html?yzh=28197">IPv6 traffic crosses the 50% mark</a></span><span class="comments_label"><a href="/s/xijpr1/ipv6_traffic_crosses_50_mark">19 comments</a></span></div></li>

O Intelbot precisa entender que título, URL, pontos e comentários pertencem ao mesmo item, mesmo com tags, domínio e byline no meio da estrutura.

Como descobrir

Título e URL

Clique com o botão direito no título de uma história, escolha Inspecionar e observe o link principal:

<a class="u-url" href="https://www.google.com/intl/en/ipv6/statistics.html?yzh=28197">IPv6 traffic crosses the 50% mark</a>

O seletor correto é: ol.stories li.story .details .link a.u-url

Esse caminho pega o link principal da história e evita misturar o domínio ou links auxiliares da byline.

Como descobrir

Pontos e comentários

Inspecione o score e o link de comentários separadamente:

<a class="upvoter" href="/login">51</a><span class="comments_label"><a href="/s/xijpr1/ipv6_traffic_crosses_50_mark">19 comments</a></span>

Os seletores corretos ficam:

ol.stories li.story .voters a.upvoterol.stories li.story .comments_label a

Repare que comentários nem sempre vêm como número puro. Em alguns itens o texto pode sair como no comments.

Erros comuns

O que evitar

Misturar domínio com o título

Errado: ol.stories li.story .details

Certo: ol.stories li.story .details .link a.u-url

Descrever comentários como número puro

Errado: Número de comentários

Certo: Quantidade de comentários do item na listagem

Escolher seletor amplo para pontos

Errado: ol.stories li.story

Certo: ol.stories li.story .voters a.upvoter

Este exemplo é útil porque mostra um tipo de item onde o texto principal não está sozinho: ele divide espaço com score, domínio, tags, autoria e comentários.

Resultado esperado

Como saber se ficou bom

  • o retorno deve sair com mode igual a list
  • cada item deve ter um título principal com sua url correta
  • pontos deve sair como número
  • comentários pode sair como texto, inclusive no formato no comments
  • domínio e tags não devem invadir o campo de título
Voltar aos exemplosAbrir site