[jQuery] jQuery で HTML ファイルを読み込んで表示する

公開日: 2018/10/09

非同期通信でファイルを読み込み、指定された要素に表示する。
共通要素の表示に利用したり。

[markdown]
> * [.load() | jQuery API Documentation](http://api.jquery.com/load/)

同じディレクトリにある `links.html` の `ul` 要素を読み込んで、`#related_links` 要素に表示するよ。

“`javascript:related-links.js
$(document).ready(function() {
$(‘#related_links’).load(‘./links.html ul’);
});
“`

共通要素の `ul` は別ファイルで持っておくよ。

“`html:links.html

Document

“`

いくつかの HTML に表示エリアを用意すると、`div` 配下に `ul` 以下のタグが表示されるよ。

“`html:some.html