加载的html没有获取javascript文件

Question

我有一个html页面，可以动态地将另一个html文件的内容加载到div中。

function loadHTML(url, id) {
    req = new XMLHttpRequest();
    req.open('GET', url);
    req.send();
    req.onload = () => {
        console.log(req.responseText);
        document.getElementById(id).innerHTML = req.responseText;
    }
}

我致电loadHTML("/lib/header/header.html","header")，将/lib/header/header.html的内容加载到主html <div id="header"></div>

中的div中

/lib/header/header.html

<script src="/lib/header/header.js"></script>
<link href="/lib/header/header.css" rel="stylesheet">
<header>
    <object id="logo" data="/lib/global/Icon.svg"></object>
    <span id="auth">
        <span class="pair" id="login">
            <p>Login</p>
        </span>
        <span class="pair" id="register">
            <p>Register</p>
        </span>
    </span>
</header>

如您所见，header.html文件还包含header.css和header.js文件。 header.css文件被正确加载但header.js文件没有。

它甚至没有列在Chrome开发者工具的“网络”标签中。

我完全不知道为什么会这样。

提前致谢。