Bootstrap4 导航active状态切换

页面HTML代码：

<ul id="menu" class="nav nav-tabs nav-pills nav-fill">
    <li class="nav-item">
        <a class="nav-link" href='{:url("index/index/index")}'>首页</a>
    </li>
    <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="{:url('index/dataStatistics/userList')}" role="button" aria-haspopup="true" aria-expanded="false">数据统计</a>
        <div class="dropdown-menu">
             <a class="dropdown-item" href="{:url('index/dataStatistics/userList')}">用户列表</a>
             <a class="dropdown-item" href="#">Another action</a>
             <a class="dropdown-item" href="#">Something else here</a>
             <div class="dropdown-divider"></div>
             <a class="dropdown-item" href="#">Separated link</a>
        </div>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
    </li>
    <li class="nav-item">
        <a class="nav-link disabled" href="#">Disabled</a>
    </li>
</ul>

js代码如下：

$('.nav-pills').find('a').each(function () {
            if (this.href == document.location.href || document.location.href.search(this.href) >= 0) {
                $(this).addClass('active'); // this.className = 'active';
            }
        });