頁面在執行$（document）.ready中的腳本之前進行渲染，以重新排列html元素

Question

我正在重新安排一些html，並在我的$(document).ready的JQuery中更改一些css值。不幸的是，如果用戶的計算機速度不是很快，用戶會看到原始佈局，然後看到屏幕上四處移動的東西，直到完成$(document).ready。我可以隱藏主div並在$(document).ready結束時顯示它，但根據頁面的不同，我爲每個html頁面加載了多個javascript頁面，並且這些javascript頁面中的每一個都有一個$（document）.ready功能。所以保證最後一個執行是另一個障礙。

爲了增加更多的複雜性，我從服務器獲得了一個100個跨度的HTML片段，每個片段包含一個圖像。我將只顯示這個html片段的前n個元素，並從dom中移除其餘的元素。 n是在javascript中的客戶端上計算的。我想在圖像實際從服務器拉出之前這樣做，所以我只拉取顯示的圖像。

我如何寫我的代碼：

1. 只有這樣才能真正顯示從服務器拉圖像。和
2. 用戶沒有看到重新排列在其前面的頁面元素。

非常感謝！

Answer 1

1）使用您的內容display:none爲內嵌式的，並告訴他們你的腳本完成後

2）離開SRC空白，並把它變成​​，那麼值，你當複製到SRC」再準備顯示

<img src="" data_src="/images/image1.jpg" /> 

Answer 2

我已經加載的頁面超過一個JavaScript的網頁和每一個都有$（document）.ready函數。所以保證最後一個執行是另一個障礙。

你可以只有一個

$("document").ready({ 
//functions here 
}); 

，並有這裏面定義的所有功能。