js 代碼在 html 文件中工作。 但不適用於 js 文件

Question

此 JS 代碼在 .html 文件中正常工作，但在 .js 文件（外部文件）中無法正常工作。 我想將此 JS 代碼應用於每個頁面，因此計划將其移動到 .js 文件中，誰能幫助我？ 我很感激你的時間。

in.html 文件（此代碼有效）

<script type="text/javascript">
    document.addEventListener("DOMContentLoaded", function () {
        navbar_height = document.querySelector(".navbar").offsetHeight;
        document.body.style.paddingTop = navbar_height + "px";
    });
    
    window.addEventListener("DOMContentLoaded", (event) => {
        var lastScrollTop = 0;
        jQuery(window).scroll(function () {
            var st = jQuery(window).scrollTop();
            if (st > lastScrollTop) {
                jQuery("nav.navbar:not(.navbar-transparent)").slideUp();
            } else {
                jQuery("nav.navbar:not(.navbar-transparent)").slideDown();
            }
            lastScrollTop = st;
        });
    });
    </script>

in.js 文件（此代碼不起作用）

$(document).addEventListener("DOMContentLoaded", function () {
    navbar_height = document.querySelector(".navbar").offsetHeight;
    document.body.style.paddingTop = navbar_height + "px";
});

$(window).addEventListener("DOMContentLoaded", (event) => {
    var lastScrollTop = 0;
    jQuery(window).scroll(function () {
        var st = jQuery(window).scrollTop();
        if (st > lastScrollTop) {
            jQuery("nav.navbar:not(.navbar-transparent)").slideUp();
        } else {
            jQuery("nav.navbar:not(.navbar-transparent)").slideDown();
        }
        lastScrollTop = st;
    });
}); 

Answer 1

在第二行，有語法錯誤。 應該是

let navbar_height