Select elements in hierarchy with Javascript

5

I have a hierarchy as follows

<li class="clear2 clearfix" id="field_id16">
<span class="row_title">Link: </span>
<span class="row_data">
    <div class="field_uneditable">http://3.bp.blogspot.com/-O7KAb62ChqU/Tb_wIM-9zOI/AAAAAAAAACA/nG7EnK7xAmY/s1600/ydc9ntyrhmi63s0umu4a881dc4018f7_homer-reggae.jpg</div>
</span>

To get the link that has within span row_data with jQuery I can use this:

$('#field_id16 .row_data div').text();

I would like to know, how do I make this selector where I can filter the elements with pure Javascript? #field_id16 .row_data div

This exists in CSS too, but I do not know how to use it in Javascript.

    
asked by anonymous 05.06.2014 / 15:22

1 answer

10

If you do not need to use old browsers, ie using IE8 or newer, you can use .querySelector () :

var elemento = document.querySelector('#field_id16 .row_data div');
console.log(elemento.innerHTML); // http://3.bp.blogspot.com/-O7KAb62ChqU/Tb_wIM-9zOI/AAAAAAAAACA/nG7EnK7xAmY/s1600/ydc9ntyrhmi63s0umu4a881dc4018f7_homer-reggae.jpg

Example: link

    
05.06.2014 / 15:27