1

私は ajax を使用して html を取得し、それを div (AjaxPlaceHolder) に配置する単純な Web サイトを持っています。

たとえば、ここに私のウェブページがあります:

<html>

    <body>
           // some html...

           <div id="AjaxPlaceHolder"></div>

    </body>

    <div id="footer"></div>

</html>

今私の問題は、ajaxを使用してhtmlを取得すると、次のようなものが得られることです。

<script type="text/javascript" src="js/someJsFile.js"></script>
<table>html content</table>
// more html

次の行に注意してください。

<script type="text/javascript" src="js/someJsFile.js"></script>

ブラウザーがそのファイル (someJsFile.js) をダウンロードするまで、html コンテンツを配置したくありません。ブラウザがそのスクリプトをいつダウンロードしたかを知るにはどうすればよいでしょうか? そこに someJsFile.js コンテンツを配置して<script type="text/javascript">タグで囲むことができることはわかっていますが、.js ファイルを分離できれば便利です。

編集：

言い換えれば、私がやりたいことは次のとおりです。

ajax を使用して html を取得します。ドキュメントが必要な画像とスクリプトのダウンロードを完了するまで、html をレンダリングしないでください (その間は非表示の div に配置します)。

4

1 に答える 1

1

HTML ajax ロードの残りの部分から、javascript ファイルのロードを分離できます。

それを分離すると、外部スクリプトを同期ロードできます。そうすれば、それらが最初にロードされたことを確認できます。

シンプルな JavaScript では、開くときに Synchronous フラグを設定します。

function getFile(url, passData) {
  if (window.XMLHttpRequest) {              
    AJAX=new XMLHttpRequest();              
  } else {                                  
    AJAX=new ActiveXObject("Microsoft.XMLHTTP");
  }
  if (AJAX) {
    AJAX.open("POST", url, false);
    AJAX.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    AJAX.send(passData);
    return AJAX.responseText;                                         
  } else {
     return false;
  }                                             
}

var fileFromServer = getFile('http://domain.com/scr.js', sendThisDataAsAPost);

jQueryで

jQuery.ajax({
        type: "GET",
        url: url,
         async : false,
        success: callback,
        dataType: "script",
        cache: true
});

同期呼び出しについて : http://www.hunlock.com/blogs/Snippets:_Synchronous_AJAX

jQuery 呼び出し: http://api.jquery.com/jQuery.ajax/

于 2012-06-09T17:25:58.130 に答える