jquery -Get wartości właściwości CSS dla jeszcze nie stosowanej klasy

Question

Mam to samo pytanie question tutaj (nie mogłem się wypowiedzieć na ten temat, może nie mam przywileju), chcę uzyskać wartość szerokości css zdefiniowaną w arkuszu stylów, ale jeszcze nie stosowana na dowolnym elemencie w dom, (jego bootstrap css z siatki z zapytaniami mediów reagujących)

.span6 { 
width: 570px; 
} 

jednak rozwiązanie przewidziane w wyżej przywołanych cofnięcie pytanie 0 IE jak ten

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

ale działa, jeśli coś zrobić lubię to

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

w łatwy sposób bez dołączania tego elementu div?

Answer 1

W celu odczytania wartości właściwości CSS, trzeba dynamicznie wstawić ukryty element do DOM, odczytać właściwość i ostatecznie usunąć go:

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

Wielką odpowiedź przez Jose. Zmodyfikowałem go, aby pomóc w bardziej złożonych selektorach css.

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