jquery -Get CSS-Eigenschaften Werte für eine noch nicht angewandte Klasse

Question

Ich habe eine gleiche question fragte hier (konnte nicht kommentieren, vielleicht nicht ein Privileg), ich möchte Css Breite Wert in Stylesheet, aber noch nicht definiert

$('<div/>').addClass('span6').width(); 

angewendet auf ein beliebiges Element in dom, (seine Bootstrap CSS mit Raster mit reaktions Abfragen Medien)

.span6 { 
width: 570px; 
} 

jedoch Lösung in oben genannten Frage return 0 dh wie diese

vorgesehen funktioniert aber wenn ich etwas tun wie dieses

$('<div/>').addClass('span6').hide().appendTo('body').width(); 

jeden einfachen Weg, ohne div anzuhängen?

Answer 1

Um einen CSS-Eigenschaft Wert zu lesen, müssen Sie ein verborgenes Element auf das DOM dynamisch einzufügen, die Eigenschaft lesen und es schließlich entfernen:

var getCSS = function (prop, fromClass) { 

    var $inspector = $("<div>").css('display', 'none').addClass(fromClass); 
    $("body").append($inspector); // add to DOM, in order to read the CSS property 
    try { 
     return $inspector.css(prop); 
    } finally { 
     $inspector.remove(); // and remove from DOM 
    } 
}; 

jsFiddle here

Answer 2

Große Antwort von Jose. Ich habe es modifiziert, um mit komplexeren CSS-Selektoren zu helfen.

var getCSS2 = function (prop, fromClass, $sibling) { 

    var $inspector = $("<div>").css('display', 'none').addClass(fromClass); 
    if($sibling != null){ 
     $sibling.after($inspector); //append after sibling in order to have exact 
    } else { 
     $("body").append($inspector); // add to DOM, in order to read the CSS property 
    } 
    try { 
     return $inspector.css(prop); 
    } finally { 
     $inspector.remove(); // and remove from DOM 
    } 
}; 

JSFiddle