＆＃34;无法读取属性＆＃39; addEventListener＆＃39; of null＆＃34;用于加载元素

Question

我正在使用另一个HTML文件中的jQuery加载表单元素，并使用Firebase进行帐户管理。我已经读过这个问题，因为脚本无法找到它所引用的元素，但我认为这可能是因为该元素在另一个脚本实际加载之前不存在我已经尝试将加载代码移到事件监听器代码上方，但它还没有工作。我该如何解决这个问题？

主要HTML代码段

        <!-- Footer -->
        <div id="footer"></div>

        <!-- Sign in/out modal -->
        <div class="modal fade" tabindex="-1" role="dialog" id="signInModal"></div>
        <div class="modal fade" tabindex="-1" role="dialog" id="signUpModal"></div>

        <!-- Optional JavaScript -->
        <!-- Keep at bottom of code -->
        <!-- jQuery first, then Popper.js, then Bootstrap JS -->
        <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="..." crossorigin="anonymous"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="..." crossorigin="anonymous"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="..." crossorigin="anonymous"></script>

        <!-- My scripts -->
        <script src="scripts/defaults.js"></script>
        <script src="https://www.gstatic.com/firebasejs/4.13.0/firebase.js"></script>
        <script src="scripts/firebase.js"></script>
    </body>
</html>

加载元素代码（defaults.js）

$(function(){
    $('#header').load('defaults/header.html');
    $('#footer').load('defaults/footer.html');
    $('#signInModal').load('defaults/signInModal.html');
});

Firebase代码（firebase.js包括事件侦听器）

(function () {
    // Initialize Firebase
    var config = {
        apiKey: "...",
        authDomain: "app-1234.firebaseapp.com",
        databaseURL: "https://app-1234.firebaseio.com",
        projectId: "app-1234",
        storageBucket: "",
        messagingSenderId: "123456789"
    };
    firebase.initializeApp(config);


    // Get elements
    const signInEmail = document.getElementById('signInEmail');
    const signInPassword = document.getElementById('signInPassword');

    const signUpEmail = document.getElementById('signUpEmail');
    const signUpPassword = document.getElementById('signUpPassword');

    const btnSignIn = document.getElementById('btnSignIn');
    const btnSignUp = document.getElementById('btnSignUp');
    const btnSignInUp = document.getElementById('btnSignInUp');
    const btnMyAccount = document.getElementById('btnMyAccount')


    // Add sign in event
    btnSignIn.addEventListener('click', e => {
        // Get email and pass
        const email = signInEmail.value;
        const pass = signInPassword.value;
        const auth = firebase.auth();

        // Sign in
        const promise = auth.signInWithEmailAndPassword(email, pass);
        promise.catch(e => console.log(e.message));
    });
}());