Uncaught TypeError: Cannot read property 'insertAdjacentElement' of nullを解決したい

Djangoを勉強している初心者です。GoogleChromeを使用しているのですが、consoleで「Uncaught TypeError: Cannot read property 'insertAdjacentElement' of null」というエラーが出ます。（エラーが出るのは、https://unpkg.com/ityped@1.0.3のコードで、トップページに使用しています。）
しかしなぜか、test_jqueryのコードを切り取って、何も書いてない状態にして、保存するとエラーが出なくなります。また、トップページ（http://127.0.0.1:8000/）では、エラーが出ないですが、問い合わせページ（http://127.0.0.1:8000/inquiry）ではこのエラーが出ます。

html
1<base.html>
2
3{% load static %}
4<html lang="ja">
5<head>
6  <meta charset="utf-8">
7  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
8  <meta name="description" content="">
9  <meta name="author" content="">
10
11  <title>{% block title%}{% endblock %}</title>
12
13  <!-- Bootstrap core CSS -->
14  <link href="{% static 'vendor/bootstrap/css/bootstrap.css' %}" rel="stylesheet">
15
16  <!-- Custom fonts for this template -->
17  <link href="https://fonts.googleapis.com/css?family=Catamaran:100,200,300,400,500,600,700,800,900" rel="stylesheet">
18  <link href="https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i"
19    rel="stylesheet">
20
21  <!-- Custom styles for this template -->
22  <link href="{% static 'css/one-page-wonder.css' %}" rel="stylesheet">'
23
24  <!-- My style -->
25  <link href="{% static 'css/mystyle_test.css' %}" rel="stylesheet" type="text/css">
26
27
28
29
30  {% block head %}{% endblock %}
31</head>
32
33<body>
34  <div id="wrapper">
35    <!-- Navigation -->
36    <nav class="navbar navbar-expand-lg navbar-dark navbar-custom fixed-top">
37      <div class="container">
38        <a class="navbar-brand" href="{% url 'diary:index' %}">PRIVATE DIARY</a>
39        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive"
40          aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
41          <span class="navbar-toggler-icon"></span>
42        </button>
43        <div class="collapse navbar-collapse" id="navbarResponsive">
44          <ul class="navbar-nav mr-auto">
45            <li class="nav-item {% block active_inquiry %}{% endblock %}">
46              <a class="nav-link" href="{% url 'diary:inquiry' %}">INQUIRY</a>
47            </li>
48          </ul>
49          <ul class="navbar-nav ml-auto">
50            <li class="nav-item">
51              <a class="nav-link" href="#">Sign Up</a>
52            </li>
53            <li class="nav-item">
54              <a class="nav-link" href="#">Log In</a>
55            </li>
56          </ul>
57        </div>
58      </div>
59    </nav>
60
61    {% block header %}{% endblock %}
62
63
64    {% block contents %}{% endblock %}
65
66    <!-- Footer -->
67    <footer class="py-5 bg-black">
68      <div class="container">
69        <p class="m-0 text-center text-white small">Copyright &copy; Private Diary 2020</p>
70      </div>
71      <!-- /.container -->
72    </footer>
73
74    <!-- Bootstrap core JavaScript -->
75
76
77  </div>
78</body>
79<script src="{% static 'vendor/jquery/jquery.min.js' %}"></script>
80<script src="{% static 'vendor/bootstrap/js/bootstrap.bundle.min.js' %}"></script>
81<script src="https://unpkg.com/ityped@1.0.3"></script>
82<script type="text/javascript" src="{% static 'vendor/jquery/test_jquery.js' %}"></script>
83</html>

html
1<index.html>
2
3{% extends 'base.html'%}
4
5{% load static %}
6
7{% block title %}Web上にあなた専用の日記ページを保存できるサービス|Private Diary{% endblock %}
8
9{% block header %}
10
11<header class="masthead text-center text-white">
12  <div class="masthead-content">
13    <div class="container">
14      <span id="ityped" class="masthead-heading mb-0 ityped"></span>
15      <h2 class="masthead-subheading mb-0 my-style_jquery">あなた専用の日記保存サービス</h2>
16      <div class="my-style_jquery2">
17        <a href="#" class="btn btn-primary btn-xl rounded-pill mt-5">Log In</a>
18      </div>
19    </div>
20  </div>
21  <div class="bg-circle-1 bg-circle"></div>
22  <div class="bg-circle-2 bg-circle"></div>
23  <div class="bg-circle-3 bg-circle"></div>
24  <div class="bg-circle-4 bg-circle"></div>
25</header>
26
27{% endblock %}
28
29{% block contents %}
30
31<section>
32  <div class="container">
33    <div class="row align-items-center">
34      <div class="col-lg-6 order-lg-2">
35        <div class="p-5">
36          <img class="img-fluid rounded-circle" src="{% static 'img/01.jpg' %}" alt="">
37        </div>
38      </div>
39      <div class="col-lg-6 order-lg-1">
40        <div class="p-5 my-div-scroll">
41          <h2 class="display-4">Web Diary</h2>
42          <p>Web上で作成・編集・削除ができる日記</p>
43        </div>
44      </div>
45    </div>
46  </div>
47</section>
48
49<section>
50  <div class="container">
51    <div class="row align-items-center">
52      <div class="col-lg-6">
53        <div class="p-5">
54          <img class="img-fluid rounded-circle" src="{% static 'img/02.jpg' %}" alt="">
55        </div>
56      </div>
57      <div class="col-lg-6">
58        <div class="p-5 my-div-scroll2">
59          <h2 class="display-4">Save Your Diary</h2>
60          <p>あなたの日記をWebに保存</p>
61        </div>
62      </div>
63    </div>
64  </div>
65</section>
66
67<section>
68  <div class="container">
69    <div class="row align-items-center">
70      <div class="col-lg-6 order-lg-2">
71        <div class="p-5">
72          <img class="img-fluid rounded-circle" src="{% static 'img/03.jpg' %}" alt="">
73        </div>
74      </div>
75      <div class="col-lg-6 order-lg-1">
76        <div class="p-5 my-div-scroll3">
77          <h2 class="display-4">Membership System</h2>
78          <p>会員制のWeb日記サービス</p>
79        </div>
80      </div>
81    </div>
82  </div>
83</section>
84
85{% endblock %}

html
1<inquiry.html>
2
3{% extends 'base.html' %}
4
5{% block title %}お問い合わせ|Private Diary{% endblock %}
6
7{% block active_inquiry %}active{% endblock %}
8
9{% block contents %}
10<div class="container">
11    <div class="row">
12        <div class="test1">
13            <h1 class="my-style_jquery3">お問い合わせ</h1>
14            <div class="test_jquery1">
15                <form method="post">
16                    {% csrf_token %}
17
18                    {{ form.non_field_errors }}
19
20                    {% for field in form %}
21                    <div class="form-group row">
22                        <label for="{{ field.id_for_label }}" class="col-sm-4 col-form-label">
23                            <strong>{{ field.label_tag }}</strong>
24                        </label>
25                        <div class="col-sm-8">
26                            {{ field }}
27                            {{ field.errors }}
28                        </div>
29                    </div>
30                    {% endfor %}
31
32                    <div class="offset-sm-4 col-sm-8">
33                        <button class="btn btn-primary test_jquery2" type="submit">送信</button>
34                    </div>
35                </form>
36            </div>
37        </div>
38    </div>
39</div>
40{% endblock %}

javascript
1<test_jquery.js>
2
3ityped.init('#ityped', {
4    strings: ['Private Diary'],
5    typeSpeed: 100,
6    startDelay: 500,
7    loop: false,
8});
9
10$(window).on('load', function () {
11    $(".my-style_jquery").delay(2000).animate({opacity: 1}, 1000);
12    $(".my-style_jquery2").delay(2900).animate({opacity: 1}, 1000);
13});
14
15$(window).scroll(function () { 
16    var scroll_jquery = $(this).scrollTop();
17    $("#myscroll").text(scroll_jquery);
18    if (scroll_jquery >= 600 && scroll_jquery < 1100) {
19        $(".my-div-scroll").animate({opacity: 1}, 1000);
20    } else if (scroll_jquery >= 1100 && scroll_jquery < 1600) {
21        $(".my-div-scroll2").animate({opacity: 1}, 1000);
22    } else if (scroll_jquery >= 1600) {
23        $(".my-div-scroll3").animate({opacity: 1}, 1000);
24    }
25});

私としては、先ほども書いたようにtest_jqueryを何も書いていない状態にするとエラーが消えるので、test_jqueryに問題があると思うのですが、トップページでエラーが出ないのが分かりません。
調べても出てきませんでした。何か良い方法はありますでしょうか。

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

回答2件

ベストアンサー

こんな感じにしたら、解決しました。Py_ppさんが書かれているように、test_jquery.jsでは、index.htmlの内容しかないのに、inquiry.htmlでも読み込んでしまったことです。そこで、index.html(トップページ)だけ読み込むようにしました。

html
1<base.html>
2
3{% load static %}
4<html lang="ja">
5<head>
6  <meta charset="utf-8">
7  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
8  <meta name="description" content="">
9  <meta name="author" content="">
10
11　<!-- 省略-->
12
13</body>
14<script src="{% static 'vendor/jquery/jquery.min.js' %}"></script>
15<script src="{% static 'vendor/bootstrap/js/bootstrap.bundle.min.js' %}"></script>
16<script src="https://unpkg.com/ityped@1.0.3"></script>
17{% block script %}{% endblock %}  <!-- ここを変えた -->
18</script>
19</html>

html
1<index.html>
2
3{% extends 'base.html'%}
4
5{% load static %}
6
7{% block title %}Web上にあなた専用の日記ページを保存できるサービス|Private Diary{% endblock %}
8
9{% block header %}
10
11<!-- 省略-->
12
13<!-- これを追加 -->
14{% block script %}
15<script type="text/javascript" src="{% static 'vendor/jquery/test_jquery.js' %}">
16{% endblock %}