預加載javascript

我有一個腳本來加載時間和日期等。我有結果加載到一個div，該div有一個輸入CSS3動畫。唯一的問題是，實際加載時間和日期需要幾秒鐘，並且突然出現。由於在加載頁面時沒有立即看到它，所以甚至不會看到動畫，因爲在腳本加載完成時它已結束。預加載javascript

所以我的問題是：是否有可能延遲頁面加載，直到時間和日期腳本加載後？

聲明：這是一個純粹的實驗/創意項目，我正在研究，所以我並不擔心效率。

腳本：

<script> 
    var dayarray=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday") 

    var montharray=new Array("January","February","March","April","May","June","July","August","September","October","November","December") 

    function getthedate(){ 
    var mydate=new Date() 
    var year=mydate.getYear() 
    if (year < 1000) 
    year+=1900 
    var day=mydate.getDay() 
    var month=mydate.getMonth() 
    var daym=mydate.getDate() 
    if (daym<10) 
    daym="0"+daym 
    var hours=mydate.getHours() 
    var minutes=mydate.getMinutes() 
    var seconds=mydate.getSeconds() 
    var dn="AM" 
    if (hours>=12) 
    dn="PM" 
    if (hours>12){ 
    hours=hours-12 
    } 
    if (hours==0) 
    hours=12 
    if (minutes<=9) 
    minutes="0"+minutes 
    if (seconds<=9) 
    seconds="0"+seconds 
    //change font size here 
    var cdate="<div class='ref'><span>"+hours+":"+minutes+"</span> "+dn+"</div>"+dayarray[day]+", "+montharray[month]+" "+daym+", "+year+"" 
    if (document.all) 
    document.all.clock.innerHTML=cdate 
    else if (document.getElementById) 
    document.getElementById("time-date").innerHTML=cdate 
    else 
    document.write(cdate) 
    } 
    if (!document.all&&!document.getElementById) 
    getthedate() 
    function goforit(){ 
    if (document.all||document.getElementById) 
    setInterval("getthedate()",1000) 
    } 
</script>

HTML：

<body onLoad="goforit()"> 
    <div id="time-date"></div> 
</body>

來源

2011-06-29 Grefcs

你的代碼中顯式等待一個第二加載數據之前。您應該將到getthedate()立即呼叫setInterval()語句之前：

if (document.all||document.getElementById) 
    getthedate() 
    setInterval("getthedate()",1000) 
    }

這可以避免需要阻止頁面加載。如果這還不夠，您會希望將代碼放在內聯中，而不是通過onload來調用它，該代碼僅在整個頁面加載後才運行。

來源

2011-06-29 18:35:27

很好的捕獲。我沒有看到。 –

我也沒有。謝謝，效果很好！ – Grefcs

您正在調用body onload事件中的腳本，因此根據定義，它將等待頁面完全加載。

如果您希望腳本運行得更早，您可以在HTML中放置一個腳本標記，在解析您希望的位置調用goforit()函數，但結果可能並不會更好。

<div id="time-date"></div> 
<script type='text/javascript'> 
    goforit(); 
</script>

來源

2011-06-29 18:35:49

將此腳本放在您的div下面。在執行腳本之前，您的div必須加載。

<script type='text/javascript'> 
goforit(); 
</script>

來源

2011-06-29 18:35:52

預加載javascript

回答

相關問題