0

ajax リクエストからプレーンな html を受け取っています。

<h1>Title</h1>
<div>
  content
</div>

これは最も単純な形式です。各作品には<h1>、タイトルの<div>タグとコンテンツを含むタグが含まれています。container返された html スニペットを入力する必要がある html ページに適切にフォーマットされています。

これはコンテナです：

<div id="container">
  <div class="header">
  </div>
  <div class="content">
  </div>
</div>

次の JavaScript 関数を使用して を解析htmlし、container.

function loadContent(id, data) {
    var container = $('#'+id);
    var title = '';
    var content = '';

    $(data).filter('h1:first').each(function() {
        title = $(this).html();
        content = $(this).next().html();
    });

    $('div.header',container).html(title);
    $('div.content', container).html(content);
}

すべてが「問題なく」動作しているようで、異なる HTML コンテンツを持つ後続の ajax リクエストはかなり速くロードされます。しかし、ページ全体を更新するリンクをクリックすると、クリックしたハイパーリンクをロードする前に約 3 ～ 4 秒間ハングします。これは、javascript の問題だと思います。おそらく、一部のコンテンツがメモリに残っているのでしょうか? これが非効率になる可能性がある場所を誰かが見ることができますか?

4

2 に答える 2

2

ここで意図を理解しているかどうかはわかりません。タイトルとコンテンツのペアを 1 つだけ割り当てている場合、なぜ .each()?

また、Firebug 自体が重大なパフォーマンスの問題を引き起こすことが多いことにも注意してください。コードが問題であると想定する前に、必ず無効にしてテストしてください。

最後に、そうでない場合は、Firebug のプロファイラーを使用して、コードのどの部分の実行が遅いかを正確に判断してください。

コメントに基づいて更新します。代わりにこれを試してください：

function loadContent(id, data) {
  var container = document.getElementById(id);

  var title = '';
  var content = '';

  $data = $(data);
  $title = $data.filter('h1:first');

  title = $title.html();
  content = $title.next().html();

  $('div.header', container).html(title);
  $('div.content', container).html(content);
}
于 2009-07-26T00:54:45.130 に答える
1

デバッガーを使用して、遅延の原因を見つけます。FireFox w/FireBug のようなもので、ページ全体の更新をトリガーするリンクが実際にこのコードを呼び出しており、他の場所でハングアップしていないことを確認します。そして FireFox w/TamperData は、出入りするリクエストと戻ってくるリクエストを監視して、遅延が外部応答の待機によって引き起こされているかどうかを確認します。

:(

于 2009-07-26T00:12:12.637 に答える