JavaScript は、非表示の dom の幅と高さを取得します。

まずDOMをクローンし、position:absoluteを設定し、次にtopを比較的大きな負の値に設定してから表示します。最後にDOMの幅と高さを取得した後、それを削除します。
具体的なコードは次のとおりです:
Js コード

コードをコピー コードは次のとおりです:

function getCss(elem, css){
if (window.getComputedStyle) {
return window.getComputedStyle(elem, null)[css];
}else if (elem.currentStyle) ) {
return elem.currentStyle[css];
}else {
return elem.style[css];
}
関数 getWH(dom){
var get = function(elem ){
var wh = {};
'幅 高さ'.replace(/[^ ] /g, function(i){
var a = i.toLowerCase() ;
wh[a] = elem['client' i] ||
return
}; dom, 'display') === 'none') {
var nDom = dom.cloneNode(true);
nDom.style.position = 'absolute'; -3000px';
nDom.style.display = 'ブロック';
document.getElementsByTagName('body')[0].appendChild(nDom); > nDom.parentNode.removeChild (nDom);
return wh;
}
return get(dom);
}
console.log(getWH(document. getElementById('content') ));
var domA = document.createElement("a"), _ostyle = "位置:絶対;z-インデックス:999999;幅:92ピクセル;高さ:22ピクセル;位置:絶対;表示:none;";
domA.setAttribute("style", _ostyle);
domA.style.cssText = _ostyle;
domA.setAttribute("href", "javascript:void(0);" );
ドキュメント .getElementsByTagName('body')[0].appendChild(o);
関数 getCss(elem, css){
(window.getComputedStyle) {
return window.getComputedStyle(elem, null)[css];
}else if (elem.currentStyle) {
return elem.currentStyle[css];
}else {
return elem .style[css];
}
}
function getWH(dom){
var get = function(elem){
var wh = {};
'幅 高さ' .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';
document.getElementsByTagName( 'body')[0].appendChild(nDom);
var wh = get(nDom);
nDom.parentNode.removeChild(nDom);
return wh;
}
return get(dom);
}
//test
console.log(getWH(document.getElementById('content')));
var domA = document.createElement ("a"), _ostyle = "位置:絶対;z-index:999999;幅:92px;高さ:22px;位置:絶対;表示:なし;";
domA.setAttribute("style", _ostyle) ;
domA.style.cssText = _ostyle;
domA.setAttribute("href", "javascript:void(0);");
document.getElementsByTagName('body')[0].appendChild (o);
console.log(getWH(domA));


他のより良い方法を提案することを歓迎します。