Php 同步导航栏内容引导

我想知道是否可以同步引导导航栏的内容，而不必在所有页面上编辑导航栏。有了PHP，使用类似这样的东西是相当容易的，但是，有一些问题我无法解决

我当前的navbar.php是：

我用星号标记的行是需要添加到用户当前所在页面的活动类和当前类的示例。我有什么办法可以做到这一点吗

谢谢

---

Tugzrida

作为一种解决方案，您可以将页面名称作为类添加到每个li项中，然后在页面加载时，解析页面名称并将活动类设置为具有页面名称类的li元素

像这样吗

<ul class="nav navbar-nav">
    <li class="active page1"><a href="page1.html">Item 1<span class="sr-only"> (current)</span></a> </li>
    <li class="page2"><a href="page2.html">Item 2</a> </li>
</ul>


$(function() {
  var path = window.location.pathname;
  var page = path.split("/").pop();
  var pageName = page.substring(0, page.length - 5); // cut .html from the page
  $('.' + pageName).addClass('active');
  $('.' + pageName).append('<span class="sr-only"> (current)</span>'); // add an element for a screenreader
});

---

从你的回答中，我发现了一种使用CSS的方法。将类添加到每个选项卡和每个页面的正文中。然后，您可以使用CSS选择器以当前页面上的选项卡为目标。你对我如何轻松地为屏幕阅读器添加电流有什么想法吗？

<ul class="nav navbar-nav">
    <li class="active page1"><a href="page1.html">Item 1<span class="sr-only"> (current)</span></a> </li>
    <li class="page2"><a href="page2.html">Item 2</a> </li>
</ul>


$(function() {
  var path = window.location.pathname;
  var page = path.split("/").pop();
  var pageName = page.substring(0, page.length - 5); // cut .html from the page
  $('.' + pageName).addClass('active');
  $('.' + pageName).append('<span class="sr-only"> (current)</span>'); // add an element for a screenreader
});