阅读添加到DOM DIV的尚未CSS属性

如果我从理论上Ajax调用获得以下HTML：阅读添加到DOM DIV的尚未CSS属性

<div class="super"> 
    <span> Some Content </span> 
</div>

，并在jQuery对象$data包裹它，在div变为可用给我操作，但它还没有添加到DOM，直到我用一些操纵函数调用插入它。

在链接的css文件中，我有super css类的宽度和高度设置。

有没有一种方法可以让我读取元素在添加时的宽度和高度？

来源

2012-08-15 Maxim V. Pavlov

这将是一个巧妙的把戏。当然，问题在于CSS是级联的;你将不得不自己解析CSS，并找出浏览器将对其应用的所有修改。 – 2012-08-15 22:22:06

不，因为它还不是DOM对象，并且CSS文件引用了DOM节点。所以这些属性没有设置为.super div，但 – kidwon 2012-08-15 22:23:10

只需创建与同一类假的元素，将其插入到DOM，获取其风格和删除元素：

var elem = $("<div class='super'></div>"), 
    width = elem.appendTo('body').css('width'); 
    elem.remove();

FIDDLE

来源

2012-08-15 22:34:47 adeneo

不，不用jquery，因为你只能在div被插入到DOM后才能获得div的属性。

来源

2012-08-15 22:26:58

甚至没有纯JavaScript。 – 2012-08-15 22:27:38

做

最好的办法，这是与“超”级创建隐藏的元素，然后使用：

var width = $('.super').css('width'); 
var height = $('.super').css('height');

所以，你可以做这样的事情：

var $element = $('<div class="super"><span></span></div>').hide().appendTo("body"); 
var width = $element.css('width'); 
var height = $element.css('height'); 
$element.remove();

有熟悉线程：Get a CSS value from external style sheet with Javascript/jQuery。

来源

2012-08-15 22:32:27 crash01

我所做的是在创建DIV a

<div id="sandbox" style="display:none;"> 

</div>

这样我就可以在DOM中引用它而不会看到它。一旦我完成了操作，将它移动到任何我想要的位置。

来源

2012-08-15 22:37:41 Taylor

那么有几种方法可以做到这一点。如果你想读取样式表的值，你需要通过document.styleSheets对象，并找到你的选择器那里有一个属性的样式表代码将看起来像这样（你可能需要编写代码来搜索类名被返回的对象）：

<style> 
     .super { 
      height: 200px; 
     } 

    </style> 
<script> 
document.styleSheets[0].cssRules[0].style.height 
</script>

替代地简单地添加的元素到DOM某处关闭画面（像在具有上边距设定为-9000px）容器/或作为一个空元素，并获得高度使用jquery height（）或css（）方法添加元素。

来源

2012-08-15 22:41:28 Michal

阅读添加到DOM DIV的尚未CSS属性

回答

相关问题