how to extract attribute value using javascript

Question

I'm having trouble extracting "href" value of "LINE_NAME" (expected value is "www.link.com"). It's a content of a table which always has only header + 1 row, column order and number can be different though. "LINE_NAME" column is always there in the exact format

this call returns "undefined":

var url = $('.a-IRR-table tbody').children().eq(2).find('td[headers="LINE_NAME"] a').attr('href');

console.log(url);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table summary="Search Results" class="a-IRR-table" id="79" style="margin-top: -45px;">
  <tbody>
    <tr>
      <th class="a-IRR-header"><a class="a-IRR-headerLink" data-column="625" role="presentation">Av</a>
        <div class="t-fht-line"></div>
      </th>
      <th class="a-IRR-header"><a class="a-IRR-headerLink" data-column="437" role="presentation">CS</a>
        <div class="t-fht-line"></div>
      </th>
      <th class="a-IRR-header"><a class="a-IRR-headerLink" data-column="167" role="presentation">LINE_NAME</a>
        <div class="t-fht-line"></div>
      </th>
      <tr>
        <td class=" u-tC" headers="AVAILABLE" aria-labelledby="AVAILABLE">
          <img src="...png" alt="Av_ICON" title="Available" style="width:16px; padding-top:1px;">
        </td>
        <td class=" u-tL" headers="STATUS" aria-labelledby="STATUS">online</td>
        <td class=" u-tL" headers="LINE_NAME" aria-labelledby="LINE_NAME">
          <a href="www.link.com">url_link</a>
        </td>
      </tr>
  </tbody>
</table>

The argument given to .eq() is zero-based, so I guess you want eq(1) instead of eq(2). — trincot
– trincot, Commented Sep 11, 2019 at 12:23
Just remove .children() and .eq alltogether: $('.a-IRR-table tbody').find('td[headers="LINE_NAME"] a').attr('href'); or $('.a-IRR-table td[headers="LINE_NAME a').attr('href'); — Esko
– Esko, Commented Sep 11, 2019 at 12:24
And remove find.... $('.a-IRR-table tbody td[headers="LINE_NAME"] a') — epascarello
– epascarello, Commented Sep 11, 2019 at 12:25
and simplify to.. $('.a-IRR-table td[headers="LINE_NAME"] a').attr('href') — Geert-Jan
– Geert-Jan, Commented Sep 11, 2019 at 12:26
thanks guys for such a lighting response. Not sure how could I miss the numbering, stupid mistake :) appreciate simplified and cleaner calls! — Jemo
– Jemo, Commented Sep 11, 2019 at 12:30

cloned · Accepted Answer · 2019-09-11 12:25:46Z

Your problem is that .eq() function from jQuery is 0 based, so to get the 2nd element you have to use .eq(1).

var url = $('.a-IRR-table tbody').children().eq(1).find('td[headers="LINE_NAME"] a').attr('href');
console.log(url)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table summary="Search Results" class="a-IRR-table" id="79">
	<tbody>
		<tr>
			<th class="a-IRR-header"><a class="a-IRR-headerLink" data-column="625" role="presentation">Av</a><div class="t-fht-line"></div></th>
			<th class="a-IRR-header"><a class="a-IRR-headerLink" data-column="437" role="presentation">CS</a><div class="t-fht-line"></div></th>
			<th class="a-IRR-header"><a class="a-IRR-headerLink" data-column="167" role="presentation">LINE_NAME</a><div class="t-fht-line"></div></th>
		<tr>
			<td class=" u-tC" headers="AVAILABLE" aria-labelledby="AVAILABLE">
				<img src="...png" alt="Av_ICON" title="Available" style="width:16px; padding-top:1px;">
				</td>
			<td class=" u-tL" headers="STATUS" aria-labelledby="STATUS">online</td>
			<td class=" u-tL" headers="LINE_NAME" aria-labelledby="LINE_NAME">
				<a href="www.link.com">url_link</a>
				</td>
		</tr>
	</tbody>
</table>

CHANist · Accepted Answer · 2019-09-11 12:31:46Z

0

var url = $('.a-IRR-table').find('td[headers="LINE_NAME"] a').attr('href');

console.log('url = ' + url);

should work

answered Sep 11, 2019 at 12:31

CHANist

1,43315 silver badges40 bronze badges

Collectives™ on Stack Overflow

how to extract attribute value using javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related