在Wordpress中的jQuery加载顺序

Question

我有一个jQuery脚本，它读取img高度并将样式标记添加到头标记。

jQuery的

var img = document.getElementById('logomini'); 
height = img.clientHeight; 

$(function(){ 
    $("<style type='text/css' id='style1'>#menu ul { line-height: "+ height +"px }</style>").appendTo("head"); 
}); 

问题：有时脚本正常工作，有时不是。当我刷新我的网站（Wordpress）时，行高为80px或0px。我认为这是脚本加载的问题。当脚本加载速度比img更快时，显示0px。但这只是我的猜测......脚本标签正好在</body>标签之前。

my demo page

任何想法？

Answer 1

如果你想确保图像满载，然后再使用此代码：

/* In WordPress, $ may be used for other libraries, so use this safer "document ready" method */ 
jQuery(function($) { 
    /* wait until everything in the window has loaded */ 
    $(window).load(function() { 
     var img = document.getElementById('logomini'); 
     height = img.clientHeight; 
     // The above two lines could be simplified like so: 
     var height = $('#logomini').height(); 
     $("<style type='text/css' id='style1'>#menu ul { line-height: "+ height +"px }</style>").appendTo("head"); 
    }); 
}); 

也看到这样的回答：Delaying a jquery script until everything else has loaded