js+json用表格实现简单网站左侧导航
更新时间：2010年04月05日 00:23:08 作者：
闲暇之余，制作一用表格实现的简单的网站导航条，分享给大家。这里的数据基于json格式，学习json的朋友可以参考下。
调用很简单，只要将数据组织成json格式即可：格式如下：
window.onload = function()
{
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);
}
整个实例代码如下：供初学者学习！
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
复制代码 代码如下:
window.onload = function()
{
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);
}
整个实例代码如下：供初学者学习！
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
相关文章
最近遇到这个问题，JS对象和JSON格式数据的相互转换。其实，也就是两个问题：JS对象转换成为JSON格式数据、JSON格式数据转换成为JS对象2012-02-02
通常情况下,json的在项目中的应用都是在后台把数据传到前台,然后前台再获取json中的数据.2012-01-01
改进版通过Json对象实现深复制的方法，需要的朋友可以参考下2012-10-10
主要是了解一下json的简单写法与应用，方便想学习json的朋友2008-08-08
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。JSON采用完全独立于语言的文本格式，这些特性使JSON成为理想的数据交换语言。易于人阅读和编写，同时也易于机器解析和生成2017-09-09
你可能已经从这篇文章的标题中猜到了，Internet Explorer 8（目前是Beta2）提供了原生JSON的解析和序列化。2009-04-04
本文主要介绍了JSON.parse 数据不完整的解决方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-07-07
这篇文章主要介绍了浅谈JSON5解决了JSON的两大痛点，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-12-12
这篇文章主要介绍了10分钟学会js处理json的常用方法,需要的朋友可以参考下2020-12-12
之前因为要用json，在网上，json Generator就不少，但是，parser鲜有后来，在一个老外的启发下，写了一个praser，其实超简单，就是利用了JS的eval来parse，然后，把对象再返回给vbscript代码。2009-12-12
最新评论