Question

我的javascript有问题任何人都可以帮我弄清楚我做错了什么？我试图在我的导航栏选项卡中添加一个活动类，我刚开始使用php而且我遇到了很多麻烦。

<script>
function activePage(evt) {

    var url = window.location.href;     
    var splitUrl = url.split('/');
    var output = splitUrl[splitUrl.length - 1];
    console.log(output);
    console.log(splitUrl);
    console.log(url);

    if (output === 'index.html') {
        evt.currentTarget.className += " active";
    }

    if (output === 'page1.html') {
        evt.currentTarget.className += " active";
    }

    if (output === 'page2.html') {
        evt.currentTarget.className += " active";
    }

    if (output === 'page3.html') {
        evt.currentTarget.className += " active";
    }
}

window.onload = function () {
    activePage(null, null);
};

<div class="navbar">
  <div class="nav-tab"><a href="#" class="logo">logo</a></div>
  <div class="filler"></div>
  <div class="nav-tab"><a href="index.php" onclick="activePage(event)" class="page">Home</a></div>
  <div class="nav-tab"><a href="page1.php" onclick="activePage(event)" class="page">page1</a></div>
  <div class="nav-tab"><a href="page2.php" onclick="activePage(event)" class="page">page2</a></div>
<div class="nav-tab"><a href="page3.php" onclick="activePage(event)" class="page">page3</a></div>

Answer 1

从this answer开始，正如评论所说，使用classList方法。

if (output === 'index.html') {
    evt.currentTarget.classList.add(" active");
}

无法使用Javascript在我的导航栏中将类设置为活动状态

1 个答案: