0

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.

Alexander Kleinhans
  • 5,950
  • 10
  • 55
  • 111
  • 1
    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? –  Nov 15 '19 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 Nov 15 '19 at 21:08
  • I was running this in the console, yes. – Alexander Kleinhans Nov 15 '19 at 21:10
  • 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 Nov 15 '19 at 21:12
  • Does this answer your question? [How do I retrieve an HTML element's actual width and height?](https://stackoverflow.com/questions/294250/how-do-i-retrieve-an-html-elements-actual-width-and-height) – Martin Apr 28 '21 at 09:08

1 Answers1

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
fin444
  • 725
  • 2
  • 14
  • 27