JQueryを使った外部htmlの読み込みについて

現在、html5でwebページを作っているのですが、JQueryを使って外部htmlファイルを読み込もうと思っているのですが、出来ません。
一応、サイトを参考にしてやってみたのですが何も表示されないです。
どうすればよいのでしょうか?

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-3.1.1.js"></script>
</head>
<body>
<script type="text/javascript">
 	 //共通パーツ読み込み
 	 $(function() {
 	 $("#side").load("TopPage.html");
 	 });
 	</script>
<div id="side"></div>
</body>
</html>

参考にしたサイト

sii_side

2016/10/18 05:17

環境は何でしょうか？また、ローカルでのテストでしょうか？

MikeDavis

2016/10/18 05:39

ローカルです。

sii_side

2016/10/18 06:03

環境は何でしょうか？Chrome、IEなどなど。IEの場合はバージョンも添えてください。

行動規範の内容に同意します

回答2件

ローカルではajaxは機能しませんので xampp などしてローカルサーバーを立てるとよいと思います。

投稿2016/10/18 07:41

machine_machine

総合スコア162

jqueryの3を使っているようですが、確かloadは廃止されたような。
バージョン1か2を使えば大丈夫だと思います。

あとhtml5であればtype="text/javascript"は不要ですよ。

投稿2016/10/18 03:24

takepieee

総合スコア686

sii_side

2016/10/18 05:21

3.0になって廃止されたのは $(window).load(function() { ... }); のようなEventの$.loadで、Ajaxの$.loadは廃止されていませんので、念のため。 Ajax：https://api.jquery.com/load/ Event：https://api.jquery.com/load-event/

行動規範の内容に同意します

あなたの回答