Solved

How to read value from a TH in HTML table with Javascript (NO JQuery, if possible)

Posted on 2016-09-22
3
66 Views
Last Modified: 2016-11-03
I'm trying to get the value from a table (I have no control over this format or naming) and I'd like to grab the value of "Opened Account" in the example below but not sure how to go about it? I'm trying to target "th.rich-table-headercell" but not sure how to grab value?

<table class="rich-table home table" id="startForm:OpenedReviewApps" border="1" cellpadding="0" cellspacing="0">
     <colgroup span="0"></colgroup>
     <thead class="rich-table-thead">
         <tr class="rich-table-header">
             <th class="rich-table-headercell" scope="colgroup">Opened Accounts
             </th>
         </tr>
    </thead>
   <tbody id="startForm:OpenedReviewApps:tb">
        <tr class="rich-table-row rich-table-firstrow">
            <td class="rich-table-cell" id="startForm:Open" style="width:80%"> some data here
            </td>
        </tr> 
    </tbody> 
</table>

Open in new window

0
Comment
Question by:894359
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
3 Comments
 
LVL 52

Expert Comment

by:Ryan Chong
ID: 41811775
you can try use document.getElementById, like:
<script language="javascript">
    var v = document.getElementById("startForm:Open").innerText;
    alert("Your var = " + v);
</script>

Open in new window

0
 

Author Comment

by:894359
ID: 41811779
Hi Ryan,
there is no "id" on the "th" I'm trying to read:

<th class="rich-table-headercell" scope="colgroup">Opened Accounts</th>

Thanks
0
 
LVL 52

Accepted Solution

by:
Ryan Chong earned 500 total points
ID: 41811789
ooops, miss understood your question, perhaps you can try this instead:

<script language="javascript">
    var ths = document.getElementsByTagName("th");
    for (var i = 0; i < ths.length; i++) {
        if ((ths[i].getAttribute("class") == "rich-table-headercell") && (ths[i].getAttribute("scope") == "colgroup")) {
            var v = ths[i].innerText;
            break;
        }
    }
    alert("Your var = " + v);
</script>

Open in new window

0

Featured Post

Enroll in May's Course of the Month

May’s Course of the Month is now available! Experts Exchange’s Premium Members and Team Accounts have access to a complimentary course each month as part of their membership—an extra way to increase training and boost professional development.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
CSS question 4 57
Make Float not to Wrap 15 67
How to confirm and grey the submit button using JavaScript ? 14 70
Page link not showing on Mobile Device 3 56
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question