Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Getting actual widh/height values of element via attributes.getNamedItem


i am tring to get the width/height values of an element in dom tree (HTML page) and i am using below method:

var event = e || window.event;
var target = event.target || event.srcElement;

i am getting id and class information by using

var classinfo = target.attributes.getNamedItem("class").nodeValue;
var idinfo = target.attributes.getNamedItem("id").nodeValue;

but as you can guess, any elemen doesn't have to has id and/or class nodes so i can't check width="..px" node value or getElementById method
As a result, is there any way to get width and height values of a node element by using getNamedItem method / or any other you can advise.
NOTE: I need to get real width and height not css or inline because maybe width is 60% in css but it is rendered as 100px...
Thanks in advance.
like image 954
Alper Avatar asked Jan 20 '23 06:01

Alper


1 Answers

element.offsetWidth, element.offsetHeight: overall size of the containing box in pixels

element.clientHeight, element.clientWidth: content dimensions

These are read only properties, and always return the current rendered values.

(You need to assign a style property in the element or in a stylesheet to set most elements onscreen height and width.)

like image 55
kennebec Avatar answered Jan 22 '23 20:01

kennebec