promises - web scraping javascript tutorial

¿Cómo usar CHEERIO.js para este HTML?

Question

<div class="A">
<section class="B" data-vr-zone="B">
    <header class="C"> BarFoo</header>
    <ul class="list">
        <li data-vr-contentbox=""> 
            <a href="http://www.foobar.com/.../html">
                <small>BarBar</small> 
                <span>Foo Bar foobarbar FooFoo?</span>
            </a>

        </li>
        <li data-vr-contentbox=""> 
            <a href="http://www.foofoobar.com/.../html">
                <small>BarBarBar</small> 
                <span>Foo foo FooFoo?</span>
            </a>

        </li>

Quiero acceder a la url en el atributo HREF. Y el texto en el SPAN - De solo el primer elemento de la lista.

Lo que tengo funciona, pero estoy buscando aprender una mejor manera.

var url = $(''div .A'').children().children().children().children()[0].attribs.href;

var title = $(''div .A'').children().children().children().children()[0].children[2].children[0].data;

Answer 1

Desea utilizar una cadena de selector mejor para orientar el elemento y el atributo de interés. Exactamente qué tan vago o preciso sea usted involucra compensaciones de acoplamiento demasiado ajustadas a la estructura DOM y, por lo tanto, un cambio irrelevante en el HTML significa que su selector ya no coincide o usa un selector demasiado vago y combina más elementos de los que pretende.

• vaguest: ''a'' (encuentra todos los anclajes)
• ''.A a'' (cada ancla dentro de la clase div = "A")
• Recomendado: ''.A li a'' (debe ser parte de una lista)
• específico loco: ''div.A section.B ul.list li a''

.

var link = $(''.A li a'');
var href = link.attr(''href'');
var spanText = link.find(''span'').first().text();