<分区>
javascript - 为什么 "$(element).height()"显示为0？
标签 javascript jquery css
我有这样的结构。一个包含 5 张卡片的容器(5 个元素，每个元素都有页眉、内容和页脚)。页眉、页脚和内容具有静态高度，但卡片本身具有动态高度(因为内容可以动态增长)。我正在尝试使用 css3 添加动画，我需要在附加内容时获取卡片的高度。
这是将内容附加到卡片的代码部分
function card_constructor(data) {
$card = $(cards_template(data)); //pass data to template
card_id = data.id;
$contentJQuery = $card.find('.content');
content = data.options;
template = data.template;
is_visible = true;
if(content.length === 0) is_visible = false; //if no content available, do not show card
//loop through content array in order to append its data to the card
for (var d=0; d<content.length; d++) {
$contentJQuery.append(template(content[d]));
}
console.log($card.height()); // here is where 0 is returned
//also tried console.log($card) and that returns the card with all its //content
}
我不知道为什么会这样。当我尝试直接从 Chrome 的控制台获取高度时，它起作用了
最佳答案
因为你需要$(document).ready(function () { ... });在您尝试从 DOM 读取属性之前。尺寸很可能尚未呈现。 IE。将必要的代码包装在此函数中，以便在执行代码之前为文档加载时间。或者，将您的脚本附加到结尾 </body> 之前标签，以同样的方式。
关于javascript - 为什么 "$(element).height()"显示为0？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38384938/