$('div').load('other.html');
"other.html"というファイルを読み込むんだな。
とわかった人は飛ばしてください。
分からなかった人へ：~~上記の通りです。~~次へ進んでください。
#load()とは
任意のファイルをHTMLコンテンツとして取得＆出力することができるメソッド
※HTMLコンテンツ＝全てのWebページで再利用できるHTMLファイルのこと
##使用例（１）
サンプルテキストです
上記のようなつまらないテキストファイルを用意する。
// 略
<body>
<div></div>
<script>
$('div').load('sample.txt');
</script>
</body>
そして上記のようなつまらない空div要素のみのHTMLファイルを作る。
このHTMLファイルを読み込むと、div要素内に「サンプルテキストです」と表示される。
この「サンプルテキストです」がHTMLコンテンツである。
この方法で表示することで、好きな箇所で外部ファイルの中身を出力できる。
##使用例（２）
<ul>
<li>リスト１</li>
<li>リスト2</li>
<li>リスト3</li>
</ul>
上記のように見たら分かるようなリスト要素のみのHTMLファイルを用意する。
// 略
<body>
<div></div>
<script>
$('div').load('list.html');
</script>
</body>
そして上記のようなつまらない空div要素のみのHTMLファイルを作る。
すると、空div要素の中にリスト要素が挿入される。
リスト要素をヘッダー要素にすれば、再利用可能なヘッダーコンテンツとなる。
#ajax()とは
説明するよりコードで解説。
以下の２つは同じ動作をします。
$('div').load('other.html');
.ajax({
type: 'GET',
url: 'other.html',
success: function(data) {
$('div').html(data);
}
})
load()メソッドはHTMLファイルを読み込んで出力するだけの機能
loadメソッドの中身はajax()が動作しています
つまり、
load()メソッド ＝ ajax()メソッドの機能を限定的にした簡易版
##セレクタ指定、要素指定、function関数設定もできる
詳しくは以下のサイトで解説してくれている
text jQuery入門】load()でHTMLを読み込む方法！
・load()関数とは
・load()とajax()の違い
・再利用可能なページとは
これら３つが理解できればよし◎
お疲れ様でした。