How do i get a cell from a HTML table with jquery or DOM?

Question

I have a unchangeable HTML table with CSS. I need to get the value from the first column to filter it. I can't find the jquery or DOM function to do that,

Because i couldn't figure out how to get the value of an cell, i tried to get the value of the first column.
The first column is bold. I tried to get it via the bold tag, but it didn't worked.



title






    

        
        
            School   Adresse

            Stundenplan 2016/2017    Stand: 01.12.2017 10:12
        
    



9.12.2016 Freitag

Nachrichten zum Tag
Indubio Müsli




Klasse(n)
Stunde
(Lehrer)
Vertreter
Fach Raum
Vertretungs-Text


5a
5
Se
Ma
BNT-b
2.25
Vertretung

5a
6
Se
---
---
---
frei

5c
1
Mü
Au
M
1.23
Aufgaben

5c
2
Mü
Gi
M
1.23
Aufgaben

The output is: 5a undefined

Rory McCrossan · Accepted Answer

Firstly the selector for the element is just 'b', not ''.

Secondly, querySelectorAll() returns a nodeList, so there's no innerHTML property on that object. As there are multiple b elements in the table you need to use a loop to build a string from them all. You can do this implicitly by using map().

Finally, in the example below, note the use of .mon_list in the selector to restrict the retrieved elements to only those within the target table and also :nth-child(1) to retrieve the first column cells.

Also, as noted by T.J. Crowder in the comments, you would be better off not relying on the existence of the b element in the cell and just reading the textContent of the td directly.

With all that said, try this:

function filtern() { var klasse = Array.from(document.querySelectorAll('.mon_list td:nth-child(1)')).map(function(el) { return el.textContent; }).join(', '); document.getElementById("ausgabe").innerHTML = klasse } filtern();

Klasse(n) Stunde (Lehrer) Vertreter Fach Raum Vertretungs-Text 5a 5 Se Ma BNT-b 2.25 Vertretung 5a 6 Se --- --- --- frei 5c 1 Mü Au M 1.23 Aufgaben 5c 2 Mü Gi M 1.23 Aufgaben

How do i get a cell from a HTML table with jquery or DOM?

Answers (1)

Related Questions