js+json用表格实现简单网站左侧导航
闲暇之余,制作一用表格实现的简单的网站导航条,分享给大家。这里的数据基于json格式,学习json的朋友可以参考下。
var tf="if1";
var data=[{m:"体育网站",s:[{sn:"百度体育",st:"http://news.baidu.com/n?cmd=1&class=sportnews"},
{sn:"搜狐体育",st:"http://sports.sohu.com/"},
{sn:"新浪体育",st:"http://sports.sina.com.cn/"}]},
{m:"新闻网站",s:[{sn:"百度",st:"http://news.baidu.com/"},
{sn:"搜狐",st:"http://news.sohu.com/"},
{sn:"新浪",st:"http://news.sina.com.cn/"}]},
{m:"视频网站",s:[{sn:"百度视频",st:"http://vedio.baidu.com/"},
{sn:"搜狐视频",st:"http://tv.sohu.com/"},
{sn:"新浪视频",st:"http://vedio.sina.com.cn/"}]}
];
var nav=new tableNav("table1",data,tf);
var bautoClose=false; //打开当前导航条时其它导航条是否关闭
nav.generateNav(bautoClose);
}
js+json用表格实现简单网站左侧导航的更多相关文章
- js : json和 cookie 的简单操作
使用 cookie,可以记录用户的最近的浏览历史 <!DOCTYPE HTML> <html lang="zh-cn"> <head> < ...
- Table Dragger - 简单的 JS 拖放排序表格插件
Table Dragger 是一个极简的实现拖放排序的表格插件,纯 JavaScript 库,不依赖 jQuery.用于构建操作方便的拖放排序功能,超级容易设置,有平滑的动画,支持触摸事件. 在线演示 ...
- js循环读取json数据,将读取到的数据用js写成表格
①js循环读取json数据的方式: var data=[{"uid":"2688","uname":"*江苏省南菁高级中学 022 ...
- JS组件系列——表格组件神器:bootstrap table
前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...
- [转]JS组件系列——表格组件神器:bootstrap table
原文地址:https://www.cnblogs.com/landeanfen/p/4976838.html 前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉 ...
- JS组件系列——表格组件神器:bootstrap table 包含了js对象的定义和对象成员函数的定义
前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...
- JS组件系列——表格组件神器:bootstrap table(二:父子表和行列调序)
前言:上篇 JS组件系列——表格组件神器:bootstrap table 简单介绍了下Bootstrap Table的基础用法,没想到讨论还挺热烈的.有园友在评论中提到了父子表的用法,今天就结合Boo ...
- JS组件系列——表格组件神器:bootstrap table(三:终结篇,最后的干货福利)
前言:前面介绍了两篇关于bootstrap table的基础用法,这章我们继续来看看它比较常用的一些功能,来个终结篇吧,毛爷爷告诉我们做事要有始有终~~bootstrap table这东西要想所有功能 ...
- 用node.js从零开始去写一个简单的爬虫
如果你不会Python语言,正好又是一个node.js小白,看完这篇文章之后,一定会觉得受益匪浅,感受到自己又新get到了一门技能,如何用node.js从零开始去写一个简单的爬虫,十分钟时间就能搞定, ...
随机推荐
- 用10046 跟踪exp
之前写过一个blog,Oracle expdp为什么比exp快,原理是什么,是从官方文档中获知的,如今通过10046来分析exp的过程. C:\Users\Administrator>exp L ...
- vb.net 模拟UDP通信
Imports System.Net Imports System.Text.Encoding Public Class Form1 Dim publisher As New Sockets.UdpC ...
- Java集合——HashMap、HashTable以及ConCurrentHashMap异同比较
0. 前言 HashMap和HashTable的区别一种比较简单的回答是: (1)HashMap是非线程安全的,HashTable是线程安全的. (2)HashMap的键和值都允许有null存在,而H ...
- 算法笔记_178:历届试题 邮局(Java)
目录 1 问题描述 2 解决方案 1 问题描述 问题描述 C村住着n户村民,由于交通闭塞,C村的村民只能通过信件与外界交流.为了方便村民们发信,C村打算在C村建设k个邮局,这样每户村民可以去离自己 ...
- 几款Android开发人员必备小工具
在这里我介绍一下我常常在Android Studio里面使用的小工具吧,这些工具都能够在plugin里面搜索到. (当然了哈.我也是从网上找的.用着挺方便的,在这里总结一下) Gsonformat: ...
- Redis学习(6)-常用命令
List命令 value值为LinkedList类型. 使用环境: 1,做大数据集合的增删. 2,任务队列.用户任务队列 链表查看 lrange key start end:获取链表从start到en ...
- CentOS 7 网络磁盘挂载到本地 并测试传输速度
本文中的配置只做测试使用,正式环境中考虑到安全,请自行结合网上介绍的配置细节完善配置内容. 首先明确两个概念,服务器和客户端(本地),我们要做的是将服务端的硬盘上的/home/liuyx 目录挂载到本 ...
- Tomcat 签名认证配置简例
在项目的web.xml中增加 <security-constraint> <web-resource-collection> <web-resource-name> ...
- 启动ip wizard时报the ip wizard does not support dhcp
启动ip wizard时报the ip wizard does not support dhcp 阅读:5502012-05-11 11:15 标签:loadrunner 打开ip wizard:开始 ...
- jQuery+PHP动态显示(项目)实时时间和倒计时
jQuery动态显示当前时间: html代码:<div id="current_time"></div> setInterval()使用:setInt ...