Jqueryのloadが突然使えなくなった

前提・実現したいこと

HTMLでサイトを制作していますが、ページ数が増えてきたのでヘッダーとフッターを外部ファイル（header.html footer.html）で共通化したいと思います。

Jqueryでloadを使用すればできるという情報を得て実装でき表示されていましたが、突然表示されなくなってしまいました。

発生している問題・エラーメッセージ

Jqueryのloadを使用できていたのが突然表示されなくなる。

該当のソースコード

表示するページ

html
1<head>
2<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
3<script src="js/load.js"></script><!--load設定の呼び出し-->
4</head>
5
6<body>
7<div id="header"></div><!--ここに表示したい-->
8
9<div id="footer"></div><!--ここに表示したい-->
10</body>

呼び出す内容
フッターは省略させていただきます。

html
1        <nav class="menu">
2            <ul>
3                
4                <li><a href="#">
5                    <i class="fas fa-home"></i><br>
6                    ホーム
7                </a></li>
8        
9                <li><a href="#">
10                    <i class="fas fa-users"></i><br>
11                    協力・支援
12                </a></li>
13                
14                <li><a href="#">
15                    <i class="fas fa-envelope"></i><br>
16                    お問い合わせ
17                </a></li>
18            </ul>
19        </nav>
20    </div>

load.js

js
1$(function() {
2
3 $("#header").load("header/menu.html");
4 $("#footer").load("footer/footer.html");
5
6  });

一応htmlを全部表示します。（一部改変）

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4<meta charset="UTF-8">
5
6<!--========================================================
7　SEO関係
8============================================================-->
9<!--#####　ページタイトル　#####-->
10<title>ばびるでびるば</title>
11<meta name="viewport" content="width=device-width">
12<!--#####　ページ説明文　#####-->
13<meta name="description" content="14歳でインターネットに革命を起こそうとしている[ばびるでびるば]公式サイト。中学生・YouTuber・WEBデザイナーとして活動。愛知県を拠点に好きなことをしています！最新情報、活動内容、イベント予定、コラボ情報、芸能人の裏情報などなど 見て得する情報満載！">
14<!--#####　ページキーワード　#####-->
15<meta name="keywords" content="ばびるでびるば,Babirudebiruba,学生,YouTuber,動画編集,中学生YouTuber,WEBデザイナー,サイト,愛知県,中学生,ホームページ,">
16
17<!--========================================================
18　WEbフォント関係
19============================================================-->
20<!--#####　Googleフォント　#####-->
21<link href="https://fonts.googleapis.com/css?family=Paytone+One|Source+Sans+Pro:300,700" rel="stylesheet">
22<!--#####　？？？　#####-->
23<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
24<!--#####　アイコンフォント？　#####-->
25<link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">
26
27<!--========================================================
28　CSS関係
29============================================================-->
30<link rel="stylesheet" href="css/style.css">
31<link rel="stylesheet" href="css/style-index.css">
32<link rel="stylesheet" href="css/contents.css">
33<link rel="stylesheet" href="css/menu-index.css">
34
35<!--========================================================
36　SNS共有設定関係（OGP）
37============================================================-->
38<!--#####　ページタイトル　#####-->
39<meta property="og:title" content="ばびるでびるば公式サイト" />
40<!--#####　ページタイプ　#####-->
41<meta property="og:type" content="ページのタイプ" />
42<!--#####　ページURL　#####-->
43<meta property="og:url" content="ページのURL" />
44<!--#####　ページイメージ画像　#####-->
45<meta property="og:image" content="img/fv2.png" />
46<!--#####　サイト名　#####-->
47<meta property="og:site_name" content="ばびるでびるば" />
48<!--#####　ページ説明文　#####-->
49<meta property="og:description" content="14歳でインターネットに革命を起こそうとしている[ばびるでびるば]公式サイト。中学生・YouTuber・WEBデザイナーとして活動。愛知県を拠点に好きなことをしています！最新情報、活動内容、イベント予定、コラボ情報、芸能人の裏情報などなど 見て得する情報満載！" />
50<!--#####　カードタイプ　#####-->
51<meta name="twitter:card" content="summary">
52<!--#####　アカウント　#####-->
53<meta name="twitter:site" content="@babirudebiruba">
54
55<!--========================================================
56　埋め込み
57============================================================-->
58<script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
59<script src="js/load.js"></script>
60
61
62<!--========================================================
63　トップへ戻る
64============================================================-->
65<script src="js/top-go.js"></script>
66<link rel="stylesheet" href="css/top-go.css">
67
68
69<!--========================================================
70　スライダー
71============================================================-->
72<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
73    <script src="slide/jquery.bxslider.min.js"></script>
74    <link href="slide/jquery.bxslider.css" rel="stylesheet" />
75    <script type="text/javascript">
76            $(document).ready(function(){
77                $('.bxslider').bxSlider({
78                    auto: true,
79                });
80        	});
81    </script>
82
83<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>    
84
85<link rel="icon" type="image/x-icon" href="./favicon-180.ico">
86<link rel="apple-touch-icon" sizes="180x180" href="./favicon-180.ico">　
87
88
89<!--========================================================
90　webよろず素材館
91============================================================-->
92<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
93<link rel="stylesheet" href="http://u-zoroy.com/sozai/css/style.css" type="text/css">
94<script type="text/javascript" src="http://u-zoroy.com/sozai/js/common.js"></script>
95 
96
97</head>
98<body>
99
100<!--忍者ツールズのアクセス解析-->
101
102<!--#####　メインコンテンツ　#####-->
103<div id="main">
104   
105   <h2>ページ内容</h2>
106 
107</div>
108
109    
110    
111<!--========================================================
112　フッダー
113============================================================-->
114<aside id="fd">
115
116    <div id="footer"></div>
117 
118</aside>
119 
120</body>

試したこと

Jqueryは得意ではなく下記のサイトを参考にしているので何をしたらいいかわかりません。
【jQuery】htmlページをパーツごとに分けて読み込む方法 - 自動化厨のプログラミングメモブログ│CODE-LIFE

補足

phpは使用したくないです。
埋め込むソースをhtmlで作成できる。
できれば簡単。

中学生で自分のサイト制作をしています。なるべくわかりやすく教えてくださるとありがたいです。
ご回答よろしくお願いします。

###追記

ブラウザ開発者ツールでエラーを確認した際の表示

・VM150:1047 WebSocket connection to 'ws://localhost:8125/' failed: Error in connection establishment: net::ERR_CONNECTION_REFUSED
・createWebSocket @ VM150:1047
・RemoteFunctions @ VM150:1062
(anonymous) @ VM150:1078
load.js:4 Uncaught SyntaxError: missing ) after argument list

yu-smc

2019/03/02 10:40

何も変えていないのに突然表示されなくなるということはないはずなのですが、何も心当たりはないですか？また、ブラウザ開発者ツールのコンソールを使うと、エラーを確認できるので、調べてやってみてください。何かわかったら教えてください。

babirudebiruba

2019/03/02 11:46

yu-smcさんいろいろと調べましたが解決するような内容は確認できませんでした。・VM150:1047 WebSocket connection to 'ws://localhost:8125/' failed: Error in connection establishment: net::ERR_CONNECTION_REFUSED ・createWebSocket @ VM150:1047 ・RemoteFunctions @ VM150:1062 (anonymous) @ VM150:1078 load.js:4 Uncaught SyntaxError: missing ) after argument list これがエラーとして出てます。 Googlechromeですが、F12キーを押して赤いバツ印で表示されるので合ってますか？確かに突然起こらないと思うので何かほかに原因があると思って、CSSとloadの記述だけをしたhtmlデータで確認してもダメでした。 load.jsを変更していなくて、ページの内容を変更している時に急に表示が消えました。