基於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的基於存儲的字符串這樣的javascript $ currentPath變量改爲：「在/ var/WWW /計算器」 所以例如我的麪包屑上面應該看起來像：

<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>' 
    } 
} 

Answer 2

勾畫過程你：

1. split的$currentPath串上'/'。這給你一個數組（麪包屑）。
2. for each元素數組中：
   1. create（或clone）一個<li> - 元素根據自己的喜好，因爲你需要設置的內容。
   2. append您的新<li><ul>列表。

隨意問，如果你想詳細信息，否則享受工作吧;）

谷歌：

• mdn split
• jquery clone
• jquery text
• jquery append