2

When we inspect element on chrome browser its shows height and width of that element. So my question is that can we get that calculated height and width using any scripting language like javascript or any external api?

enter image description here

Vikas
  • 141
  • 1
  • 12
  • 2
    [`.getComputedStyle()`](https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle), [How do i get a computed style?](http://stackoverflow.com/questions/5910004/how-do-i-get-a-computed-style) – Andreas Jul 20 '15 at 13:55
  • If you have jQuery available, try one of methods width(), outerWidth(), innerWidth(), height(), innerHeight(), outerHeight(). See https://api.jquery.com/category/dimensions/ – Ondra Koupil Jul 20 '15 at 13:57
  • yes i have tried them all. But the result is not satisfactory – Vikas Jul 20 '15 at 13:57
  • I have tried .width(), .offsetwidth, .clientWidth, but it none of them is able to give the exact value like chrome. – Vikas Jul 20 '15 at 14:01
  • tried $(element).offset().top and $(element).offset().left from jquery?? – Vanojx1 Jul 20 '15 at 14:02
  • yes i have tried $(element).offset().top and $(element).offset().left but i want height and width of that element. – Vikas Jul 20 '15 at 14:18
  • And where is the code you've been trying? Post a demo in a fiddle to replicate your issue. – lshettyl Jul 20 '15 at 14:18

2 Answers2

1

You can use 

var height = document.getElementById(<id of the element>).offsetHeight;
var width = document.getElementById(<id of the element>).offsetWidth;

in a JavaScript file, embedded on that page if that is what you are searching for.

Oliver
  • 31
  • 1
  • 6
0

Ondra is right,

you need to include jQuery and the following code will get you started (based on the element you've highlighted (The first function() line is to make sure your document is ready:

<script>
$(function() {
  width = $('div#t8_2').width();
  height = $('div#t8_2').height();
});
</script>

Edit: Seems to me like you're trying to calculate Text width and not an element's width.

I'm taking the answer from this question from philfreo:

Calculating text width

Here's his jsFiddle: http://jsfiddle.net/philfreo/MqM76/

That should work.

Community
  • 1
  • 1
Alexandre Voyer
  • 809
  • 6
  • 11
  • Chrome shows 408px width but .width() shows 1470px. – Vikas Jul 20 '15 at 14:05
  • Can I see part of your html code with div#t8_2 and whatever elements are inside? And what if you try google's full css path as follow: width = $('div#t8_2.t.s7_2').width(); – Alexandre Voyer Jul 20 '15 at 14:19