JQuery के साथ एक अनुपयुक्त तत्व का सीएसएस प्राप्त करना - जावास्क्रिप्ट, jquery, सीएसएस

मैं विशिष्ट लेआउट के लिए विशिष्ट DOM तत्वों को गतिशील रूप से उत्पन्न कर रहा हूं। कुछ मामलों में मैं jQuery (अन्य लेआउट कारकों को निर्धारित करने के लिए) का उपयोग करके पहले से बनाए गए तत्व की चौड़ाई प्राप्त करने में सक्षम हूं।

var width = parseInt((jQuery(element).css("width")));

हालाँकि यह केवल काम करता है तत्व के बाद खिड़की में जोड़ा गया है। क्या किसी तत्व की सैद्धांतिक चौड़ाई प्राप्त करने का कोई तरीका है, लेकिन अभी तक खिड़की से जोड़ा नहीं गया है?

(अतिरिक्त जानकारी: नीचे समारोह में नंगे हड्डियों, मैं बस के साथ ये पैदा कर रहा हूँ a document.createElement())

उत्तर:

यह "बहुत व्यावहारिक या उपयोगी नहीं है, लेकिन मैंने अभी यह फ़ंक्शन लिखा है जो माता-पिता को क्लोन करके और डोम ऑफ़स्क्रीन में रखकर" सैंडबॉक्स "बनाता है।

var getStyle = function($parent, $element, props){
if(typeof props == "string"){props = [props];}
var $sandbox = $parent.clone().css({
position: "absolute",
display: "inline-block",
width: $parent.width(),
height: $parent.height(),
top: -1000,
left: -1000
});
$("body").append($sandbox);
$sandbox.append($element);
var result = {};
for(var i=0;i<props.length;i++){
var p = props[i];
if(p == "width"){ result[p] = $element.width(); }
else if (p == "height"){ result[p] = $element.height(); }
else{ result[p] = $element.css(p); }
}
$sandbox.remove();
return result;
}


console.log(
getStyle(
$("#name"),                    //parent
$("<div>helo</div>"),          //new elemen
["width","height","color"]     //properties to fetch
)
);

http://jsfiddle.net/beXyM/1/