javaScript HTML Parsing

Question

I am trying to get parse HTML document.

this is the HTML:

<div>
    <a class="profilePicThumb" href="https://www.facebook.com/photo.php?fbid=669986173135523&amp;set=a.219741158160029.56045.100003724408511&amp;type=3&amp;source=11" rel="theater">
        <img class="profilePic img" alt="Zinedine Zidane" src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-xtp1/v/t1.0-1/p160x160/11817031_669986173135523_8947137909221952926_n.jpg?oh=e21bb7d0d03858df94987c62e64a6022&amp;oe=56904830&amp;__gda__=1455998716_5401014ec3ef47b8bffd62207c57fda0" />
    </a>
</div>

I need to get the picture and the name.

I try this code:

var list = document.getElementsByClassName("profilePic img");

Anyone can help me? I'm new in javaScript...

Thanks

Answer 1

Your code seems to work fine and correctly finds the HTMLImageElment, see below:

 var list = document.getElementsByClassName("profilePic img"); document.write("<b>Number of element:</b>" + list.length + '<br>'); document.write("<b>alt: </b>" + list[0].alt + '<br>') document.write("<b>src: </b>" + list[0].src + '<br>') 

 <div> <a class="profilePicThumb" href="https://www.facebook.com/photo.php?fbid=669986173135523&amp;set=a.219741158160029.56045.100003724408511&amp;type=3&amp;source=11" rel="theater"> <img class="profilePic img" alt="Zinedine Zidane" src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-xtp1/v/t1.0-1/p160x160/11817031_669986173135523_8947137909221952926_n.jpg?oh=e21bb7d0d03858df94987c62e64a6022&amp;oe=56904830&amp;__gda__=1455998716_5401014ec3ef47b8bffd62207c57fda0" /> </a> </div> 

Answer 2

Your list assignment is ok. Just use:

if list.length > 0 {
    var name = list[0].alt;
    var url = list[0].src;

    // whatever you want to do with name and url
}