javascript - How to use CHEERIO.js for this HTML? - Stack Overflow

admin管理员组

文章数量:1315982

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

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

        </li>

I want to access the url in the HREF attribute. And the text in the SPAN -- Of only the first list item.

What I have works but I'm looking to learn a better way.

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;

<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./.../html">
                <small>BarBar</small> 
                <span>Foo Bar foobarbar FooFoo?</span>
            </a>

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

        </li>

I want to access the url in the HREF attribute. And the text in the SPAN -- Of only the first list item.

What I have works but I'm looking to learn a better way.

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;

• javascript
• node.js
• web-scraping
• cheerio

Share Improve this question Follow edited Nov 18, 2013 at 20:22 georgecurioz asked Nov 18, 2013 at 17:25 georgecuriozgeorgecurioz 10122 silver badges44 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

You want to use a better selector string to target the element & attribute of interest. Exactly how vague or precise you go involves trade-offs of coupling too tighly to the DOM structure and thus some irrelevant change to the HTML means your selector doesn't match anymore or using too vague a selector and matching more stuff than you intend.

• vaguest: 'a' (find every anchor)
• '.A a' (every anchor inside the div class="A")
• Remended: '.A li a' (must be part of a list)
• crazy specific: '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();

本文标签： javascriptHow to use CHEERIOjs for this HTMLStack Overflow