コードはFirefoxでは動作しますが、Chromeでは動作しません

Question

このコードはFirefoxとは完全に動作しますが、Chromeでは動作しません。

ウェブサーバーにはクロムを使用していますので、​​は問題ありません。

$(function(){ 
    $("#header").load("header.html"); 
}); 


$(document).ready(function(){ 
    $('#notif').text("5"); 
} 

クロムを使用してデバッグすると、コードは正常に実行されますが、<span id="notif"></span>には何も挿入されません。

header.htmlにある<span id="notif"></span>は、JSで動的に読み込まれます。

再び、Firefoxではうまく動作しますが、Chromeではうまく動作しません。

Answer 1

ロードは非同期であるため、ドキュメントは読み込みが完了する前に準備ができており、トリガーされています。 ドキュメントがまだ読み込まれていないため、短い$（ 'notif'）は存在しません。

$(function(){ 
    $("#header").load("header.html",function(){ 
    $('#notif').text('5'); 
    }); 
}); 

第2パラメータである匿名関数は、ロードが正常に完了した後に開始されません。

firefoxとchromeの違いはダウンロードの速度に関連する可能性がありますが、私は100％確実ではありません。より多くのテストが必要です。

時には（特にIE）ブレークポイントを介してコードをデバッグすると、document.readyトリガーが読み込みを完了するのに十分な遅延が発生することがあります。したがって、「不具合」は発見されません。