具有外部接头的Boostrap Dropdown Active

Question

如何添加boostrap＆＃34; active＆＃34;类在我的导航栏上的外部标题，我的标题代码是这个

<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
        <a class="navbar-brand" href="#"><img src="../assets/img/logo_white.png" style="height: 35px;"></a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarNavDropdown">
            <ul class="navbar-nav">

                <li class="nav-item">
                    <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
                </li>

                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    About
                    </a>
                    <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
                        <a class="dropdown-item" href="about/about-us.html">About Us</a>
                        <a class="dropdown-item" href="about/staff.html">Staff Team</a>
                        <a class="dropdown-item" href="about/partners.html">Partners</a>
                    </div>
                </li>

                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    Resources
                    </a>
                    <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
                    <a class="dropdown-item" href="resources/downloads.html">Downloads</a>
                    <a class="dropdown-item" href="resources/charts.html">Charts</a>
                    <a class="dropdown-item" href="resources/metar.html">METAR Decoder</a>
                    </div>
                </li>

                <li class="nav-item">
                    <a class="nav-link" href="academy/index.html">Academy</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link disabled" href="#">Fly</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" href="https://forums.multicrew.co.uk/">Forums</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" href="https://multicrew.setmore.com/">Book</a>
                </li>

            </ul>
        </div>
    </nav>

例如，如果我导航到关于/ about-us的页面，我希望将活动类添加到li下拉菜单＆＃34; about＆＃34;然后实际下拉＆＃34;关于我们＆＃34;请记住，我使用外部头文件是/header.html。我怎么能这样做？

如果我说我需要使用jQuery或php，我该如何实现呢？

修改 我曾尝试使用Vitaa ActiveNavigation jQuery插件found here，但没有运气

由于