首先clone一個DOM,設定position:absolute,然後設定top為一個比較大的負值,然後使其顯示出來,最後取得到了DOM的寬高後,將其remove。
具體代碼如下:
Js代碼
function getCss(elem, css){
if (window.getComputedStyle) {
return window.getComputedStyle(elem, null)[css];
. elem.currentStyle[css];
}else {
return elem.style[css];
}
}
function getWH(){em
){
var wh = {};
'Width Height'.replace(/[^ ] /g, function(i){
var a = i.toLowerCase();
wh a = i.toLowerCase();
wh a] = elem['offset' i] || elem['client' i];
});
return wh;
};
if (getCss(dom, 'display)(dom, 'display 是=== 'none') {
var nDom = dom.cloneNode(true);
nDom.style.position = 'absolute';
nDom.style.top = '-3000px' > nDom.style.display = 'block';
document.getElementsByTagName('body')[0].appendChild(nDom);
var wh = get(nDom); return wh;
}
return get(dom);
}
//test
cons. ));
var domA = document.createElement("a"), _ostyle = "position:absolute;z-index:999999;width:92px;height:22px;position:absolute;display:none;"; domA.setAttribute("style", _ostyle);
domA.style.cssText = _ostyle;
domA.setAttribute("href", "javascript:void(0);"); >document .getElementsByTagName('body')[0].appendChild(o);
console.log(getWH(domA));
function getCss(elem, css){
if (window.getComputedStyle) {
return window.getComputedStyle(elem, null)[css];
}else if (elem.currentStyle) {
return elem.currentStyle[css];
return elem.currentStyle[css];
} }
}
function getWH(dom){
var get = function(elem){
var wh = {};
'Width Height' .replace(/[^ ] /g, function(i){
var a = i.toLowerCase();
wh[a] = elem['offset' i] || elem['client' i ];
});
return wh;
};
if (getCss(dom, 'display') === 'none') {
var nDom = dom.cloneNode( true);
nDom.style.position = 'absolute';
nDom.style.top = '-3000px';
nDom.style.display = 'block';
documTagent. '身體')[0].appendChild(nDom);
var wh = get(nDom);
nDom.parentNode.removeChild(nDom);
return wh;
}}
//test
console.log(getWH(document.getElementById('content')));
var domA = document.createElement("a"), _ostyle = "position:absolute;z-index:999999;width:92px;height:22px;position:absolute;display:none;";
domA.setAttribute("style", _ostyle);
domA.setAttribute("style", _ostyle);
domA. style.cssText = _ostyle;
domA.setAttribute("href", "javascript:void(0);");
document.getElementsByTagName('body')[0].appendChild(o);
console.log(getWH(domA));
還有其他更好的方法歡迎提出來。