【js-10】如何实现侧边栏高亮？

分享人：徐炜

目录

1.背景介绍

2.知识剖析

3.常见问题

4.解决方案

5.编码实战

6.扩展思考

7.参考文献

8.更多讨论

1.背景介绍

侧边栏高亮是指选择侧边栏菜单时有一个样式效果,当刷新页面的时候,这个效果还在。

侧边栏高亮有很多种实现方法,根据任务6-10要求,最后用双ng-repeat嵌套的方法，渲染一二级菜单。

2.知识剖析

sessionStorage和localStorage

localStorage生命周期是永久，这意味着除非用户显示在浏览器提供的UI上清除localStorage信息， 否则这些信息将永远存在。存放数据大小为一般为5MB,而且它仅在客户端（即浏览器）中保存，不参与和服务器的通信。

sessionStorage仅在当前会话下有效，关闭页面或浏览器后被清除。存放数据大小为一般为5MB,而且它仅在客户端（即浏览器）中保存， 不参与和服务器的通信。

ng-class

ng-class 指令用于给 HTML 元素动态绑定一个或多个 CSS 类，其值可以是字符串，对象，或一个数组。

如果是字符串，多个类名使用空格分隔。

如果是对象，需要使用 key-value 对，key 为你想要添加的类名，value 是一个布尔值。只有在 value 为 true 时类才会被添加。

如果是数组，可以由字符串或对象组合组成，数组的元素可以是字符串或对象。

ng-repeat

ng-repeat 指令用于循环输出指定次数的 HTML 元素，集合必须是数组或对象。

3.常见问题

如何实现侧边栏高亮，且刷新页面后保持不变？

4.解决方案

5.编码实战

6.扩展思考

7.参考文献

8.更多讨论

感谢观看

by冯亚超|黄苏威|徐炜