Parsing the CSS of an HTML "object"

Question

I'm trying to find the widths of successive <td> elements in a table.

$("tbody > tr")[0]

This returns an object that looks like HTML in the console. I don't what this is.

typeof($("tbody > tr")[0])

This returns "object", which is also unhelpful.

I'm afraid that if I stringily this object, I won't be able to parse the css values. What is this object and how should I find the width of every nth td element in the first tr of a table?

EDIT

I'm trying to find the width of the td. I can't target $("tbody > tr")[0][0].clientWidth because that's not array. Again, I don't know what this "object" is or what it's API is or how I'm suppose to interact with it without possibly destroying the CSS data by stringifying it.

It's an Html element.$("tbody > tr") gets a collection of elements, and you're getting the first one from the collection. You can inspect it in your browsers console, right? — user47589
– user47589, Commented Nov 15, 2019 at 21:05
you're already using jQuery, so you can easily get the css values of this element with $("tbody > tr").eq(0).css("css-property-name-goes-here"). Or use $("tbody > tr").each(function() { ... }); to do something with each element — Robin Zigmond
– Robin Zigmond, Commented Nov 15, 2019 at 21:08
I just wasn't sure what I could do with that object or what it's API is since it seems like it's markup and not a typical object. — Alexander Kleinhans
– Alexander Kleinhans, Commented Nov 15, 2019 at 21:12
Does this answer your question? How do I retrieve an HTML element's actual width and height? — Martin
– Martin, Commented Apr 28, 2021 at 9:08

fin444 · Accepted Answer · 2019-11-15 21:19:31Z

1

Because grabbing an index from JQuery gives the standard HTML element, you can use standard JS to get the width of the element.

$("tbody > tr")[0].clientWidth

This will return the width of your object in an integer of pixels.

To get the td within, use CSS selectors inside of JQuery.

$("tbody > tr:first-child > td")[0].clientWidth

edited Nov 15, 2019 at 21:19

answered Nov 15, 2019 at 21:08

fin444

7472 gold badges14 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Alexander Kleinhans Over a year ago

So this returns the width of the table row. I'm trying to find the width of the td. I can't target $("tbody > tr")[0][0].clientWidth because that's not array.

fin444 Over a year ago

$("tbody > tr:first-child > td")[0].clientWidth

Alexander Kleinhans Over a year ago

That was it. Thanks, fin444!

Collectives™ on Stack Overflow

Parsing the CSS of an HTML "object"

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related