Javascript 实现 BreadCrumbs(原创)

 源码:   BreadCumbs
可能有些人还不知道什么是BreadCrumbs, 中文叫面包屑,不知道鬼佬为什么喜欢这么叫,大概效果就是这样,其实就是网站的导航,效果如下:
Home-> Page2-> Page22
 
  1. 实现原理

根据用户访问的url, 采用JQuery 读取存放BreadCrumbs数据的xml文件,然后进行展现。

   2.  具体实现

网站的导航一般都是树形结构,所以设计了以下的数据结构,并采用xml文件保存。

 

Code

 

接下来就是实现BreadCrumbs.js。

 

Code

 

最后,在demo.htm 文件调用该组件:

 

Code

 

该组件已经在实际项目中使用。

代码里面我还没加异常处理什么的,注释也没怎么写,大家见谅下。

 

你可能感兴趣的:(JavaScript)