基于 JavaScript 的面包屑导航

Question

我有 HTML 代码:

<ul class="breadcrumb">
    <li><a href="#">Home</a> <span class="divider">/</span></li>
    <li><a href="#">Library</a> <span class="divider">/</span></li>
    <li class="active"><a href="#">Data</a></li>
</ul>

我想通过基于 javascript $currentPath 变量的 JavaScript 进行更改，该变量存储如下字符串:“/var/www/stackoverflow”因此，在上面的示例中，我的面包屑应该如下所示:

<ul class="breadcrumb">
    <li><a href="#">var</a> <span class="divider">/</span></li>
    <li><a href="#">www</a> <span class="divider">/</span></li>
    <li class="active"><a href="#">stackoverflow</a></li>
</ul>

有人可以帮我解决这个问题吗？

Answer 1

你可以像这样分割变量。

var url = $currentPath.split('/'); //now url = ["", "var", "www", "stackoverflow"]
var breadcrumb = '';
//Use a for loop
for(var i=0;i<url.lenght;i++){
  if(url[i]!=''){
    breadcrumb = '<li><a href="#">'+url[i]+'</a> <span class="divider">/</span></li>'
  }
}