jquery - 获取尚未应用的类的CSS属性值

Question

我有一个同样的问题在这里问(不能评论它,也许没有特权),我想得到样式表中定义的css宽度值但尚未应用于dom中的任何元素,(其引导css与网格响应媒体查询)

 .span6 {
 width: 570px;
 }

然而,在上面引用的问题中提供的解决方案返回0,即像这

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

但是如果我做这样的事情就有用

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

没有附加该div的任何简单方法？

Answer 1

为了读取CSS属性值,您需要动态地将隐藏元素插入DOM,读取属性并最终将其删除:

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在这里