Clever Geek Handbook

My attempt to grab the hrefs from the <a> tag group: Explain where I am going wrong

From element tbody 

<tbody id="results">
   <tr>
      <td><input type="checkbox"><a href="/../../Assets/Microsoft-Azure-roman_column.png">/../../Assets/Microsoft-Azure-roman_column.png</a></td>
      <td>Microsoft</td>
      <td>Azure</td>
      <td>roman_column.png</td>
   </tr>
   <tr>
      <td><input type="checkbox"><a href="/../../Assets/Microsoft-Azure-runphp.cmd">/../../Assets/Microsoft-Azure-runphp.cmd</a></td>
      <td>Microsoft</td>
      <td>Azure</td>
      <td>runphp.cmd</td>
   </tr>
   <tr>
      <td><input type="checkbox"><a href="/../../Assets/Microsoft-Azure-runphp.cmd">/../../Assets/Microsoft-Azure-runphp.cmd</a></td>
      <td>Microsoft</td>
      <td>Azure</td>
      <td>runphp.cmd</td>
   </tr>
   <tr>
      <td><input type="checkbox"><a href="/../../Assets/Microsoft-Azure-Picture1.png">/../../Assets/Microsoft-Azure-Picture1.png</a></td>
      <td>Microsoft</td>
      <td>Azure</td>
      <td>Picture1.png</td>
   </tr>
   <tr>
      <td><input type="checkbox"><a href="/../../Assets/Microsoft-Azure-vertical-align-scrnsht.png">/../../Assets/Microsoft-Azure-vertical-align-scrnsht.png</a></td>
      <td>Microsoft</td>
      <td>Azure</td>
      <td>vertical-align-scrnsht.png</td>
   </tr>
   <tr>
      <td><input type="checkbox"><a href="/../../Assets/Microsoft-Azure-vertical-align-scrnsht.png">/../../Assets/Microsoft-Azure-vertical-align-scrnsht.png</a></td>
      <td>Microsoft</td>
      <td>Azure</td>
      <td>vertical-align-scrnsht.png</td>
   </tr>
</tbody>

my procedure is trying to grab href

and insert them into an array named links

:

        var resultRows = $('#results > tr > td > a');
        for (var thisAnchor in resultRows) links.push($(this).attr('href'));
        for (var thisLink in links) console.log(thisLink); // test

But this test is logged

0
1
.
.
.
171
172

to the console, not the expected

/../../Assets/Microsoft-Azure-roman_column.png
/../../Assets/Microsoft-Azure-runphp.cmd
/../../Assets/Microsoft-Azure-runphp.cmd
/../../Assets/Microsoft-Azure-Picture1.png
/../../Assets/Microsoft-Azure-vertical-align-scrnsht.png
/../../Assets/Microsoft-Azure-vertical-align-scrnsht.png

Why is this and how to fix it?

+3


source to share


3 answers


You can just use jQuery.each like:



$('tr').each(function() {
var href = $(this).find('a').attr('href');
links.push(href);
console.log(href);
});
+2


source


First, your selector hasn't created any elements, so change to

$('#results [href]')

Second, use .each

instead of for loop

$('#results [href]').each(function(){
    links.push($(this).attr('href'));
});

Finally, change

for (var thisLink in links) console.log(thisLink);


to

for (var thisLink in links) console.log(links[thisLink]);

When you repeat your foreach loop in javascript like

for(var key in collection)

this is the actual key or index in this case, because you have an array

See how it works here

+1


source


First, your HTML is invalid. You have a private tag input

.

Next, yours tbody

should be wrapped with a tagtable

Then if you are looking for an array hrefs

you should use the jQquery.map function.

Here's a working example: https://jsfiddle.net/p6h7o32m/

+1


source






More articles:


All Articles