jQuery .load()未加载HTML

时间:2018-11-03 00:04:38

标签: javascript jquery html

我正在尝试编写一个脚本,将我的网站标题导入网页。我已经看过这些文章:

我已经关注了这些站点上的内容,但在控制台中仍然收到此错误:

jQuery.Deferred exception: Object doesn't support property or method 'load' 
TypeError: Object doesn't support property or method 'load'
   at Anonymous function (http://localhost/header-footer.js:4:5)
   at l (https://code.jquery.com/jquery-3.3.1.slim.min.js:2:29559)
   at Anonymous function (https://code.jquery.com/jquery-3.3.1.slim.min.js:2:29869) undefined

我的index.htmlbody部分中具有以下内容:

<div id="header"></div>
<script src="..." integrity="..." crossorigin="anonymous"></script> <!--jQuery-->
<script src="/header-footer.js"></script> <!--Shown below-->

header-footer.js文件包括:

$(document).ready(function () {
    var header = $("#header");
    header.addClass("container-fluid clearfix"); // Bootstrap classes (unrelated as far as I know)
    header.load("/header.html");
});

我不确定我是否犯了一个愚蠢的错误或其他错误。我只想将我的header.html文件导入到我的index.html文件中。

我认为这与错误无关,但这是我的header.html文件的内容:

<ul class="list-inline">
    <li>
        <div class="dropdown">
            <button class="btn btn-primary dropdown-toggle" type="button" id="dropdownButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</button>
            <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownButton">
                <a class="dropdown-item" href="...">Another page</a>
            </div>
        </div>
    </li>
    <li><a class="btn btn-primary" href="/" role="button">Home</a></li>
    <li class="lead" style="float: left;">Website Name</li>
</ul>
<hr>

提前谢谢!

1 个答案:

答案 0 :(得分:1)

您正在使用jQuery slim。

使用code.jquery.com/jquery-3.2.1.min.js而不是苗条版本来使用load方法。