100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > html中js隐藏div的高度 javascript获取隐藏元素(display:none)的高度和宽度的方法

html中js隐藏div的高度 javascript获取隐藏元素(display:none)的高度和宽度的方法

时间:2023-02-16 22:50:37

相关推荐

html中js隐藏div的高度 javascript获取隐藏元素(display:none)的高度和宽度的方法

js获取隐藏元素的尺寸 这是test容器,可见容器

这是test容器,可见容器

这是test容器,可见容器

这是test容器,可见容器

这是test容器,

这是test容器,

这是test容器,

这是test容器,

这是test容器, 这是test容器,这是test容器,

这是test容器,

这是test容器,

这是test容器,

这是test容器,

这是test容器, 点我

//判断对象类型

function getType(o){

var _t;

return ((_t = typeof(o)) == "object" ? o==null && "null" || Object.prototype.toString.call(o).slice(8,-1):_t).toLowerCase();

}

//获取元素样式

function getStyle(el, styleName) {

return el.style[styleName] ? el.style[styleName] : el.currentStyle ? el.currentStyle[styleName] : window.getComputedStyle(el, null)[styleName];

}

function getStyleNum(el, styleName) {

return parseInt(getStyle(el, styleName).replace(/px|pt|em/ig,''));

}

function setStyle(el, obj){

if (getType(obj) == "object") {

for (s in obj) {

var cssArrt = s.split("-");

for (var i = 1; i < cssArrt.length; i++) {

cssArrt[i] = cssArrt[i].replace(cssArrt[i].charAt(0), cssArrt[i].charAt(0).toUpperCase());

}

var cssArrtnew = cssArrt.join("");

el.style[cssArrtnew] = obj[s];

}

}

else

if (getType(obj) == "string") {

el.style.cssText = obj;

}

}

function getSize(el) {

if (getStyle(el, "display") != "none") {

return { width: el.offsetWidth || getStyleNum(el, "width"), height: el.offsetHeight || getStyleNum(el, "height") };

}

var _addCss = { display: "", position: "absolute", visibility: 'hidden' };

var _oldCss = {};

for (i in _addCss) {

_oldCss[i] = getStyle(el, i);

}

setStyle(el, _addCss);

var _width = el.clientWidth || getStyleNum(el, "width");

var _height = el.clientHeight || getStyleNum(el, "height");

for (i in _oldCss) {

setStyle(el, _oldCss);

}

return { width: _width, height: _height };

}

var dd=document.getElementById("test_display_block");

alert(getSize(dd).height);

document.getElementById("test_display_click").οnclick=function(){

dd.style.display="block";

document.getElementById("test_display_none").style.display="block";

}

alert($("#test_display_none").height());

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。