jQueryは.load（）を使用して外部HTMLテンプレートを読み込みません

Question

ナビゲーションリンクをクリックしたときにjQueryを使用してホームページのメインコンテンツ領域を変更しようとしています。私はこれを行うにはload（）を使用していますが、参照している外部HTMLページはロードされません（何も起こりません）。

custom.js

$(document).ready(function(){ 
    $("#about").click(function(event){ 
    event.preventDefault(); 
     $(".main-content").fadeToggle("slow", function(){ 
     $(this).load("about-us.html") 
     }); 
    }); 
}); 

index.htmlを

<div class="inner cover main-content"> 
    <h1 class="cover-heading">A heading</h1> 
    <p class="lead">This is the best page of all time.</p> 
</div> 

Answer 1

それはとても些細な何かを把握するために時間を要したので、私は自分の質問に答えるはずと考えました。

jQueryをローカルにロードする場合は、単に「クリック」するのではなく（たとえば、ブラウザでファイルをロードする）、MAMPのようなローカルWebサーバーを使用してファイルを実行する必要があります。

jQueryは、何らかの種類のWebサーバーから提供されていない外部ファイルをロードしません。

コンソールをチェックすると、あなたが何かというエラー表示されます：あなた自身の答えを受け入れない理由

MLHttpRequest cannot load file:///Users/yourname/filepath/index.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.