html5实现树形结构,javascript+css简单实现树形结构列表

静态的树状结构

下面是代码

====================================================================================

全国地区树形列表

td{font-size:12px}

div{font-family:宋体}

div.tree_add{background:url(treeline_2.gif) no-repeat

left;padding-left:24px;padding-top:3px;color:blue;cursor:hand}

div.tree_1{background:url(ico_top1.gif) no-repeat left

middle;padding-top:3px;font-size:15px;padding-left:20px;cursor:hand;color:blue}

div.tree_2{padding-left:100px;background:url(treeline_1.gif) 100px

repeat-y;font-size:14px}

div.tree_3{background:url(treeline_2.gif) no-repeat

left;padding-left:24px;padding-top:3px}

style="padding:30px"> onMouseOut="delline(this)" onClick="showtree('directly')">直辖市 style="color:gray">+ style="display:none"> class=tree_3>北京(京) class=tree_3>上海(沪) class=tree_3>天津(津) class=tree_3>重庆(渝) onMouseOver="line(this)" onMouseOut="delline(this)" onClick="showtree('state')">省 市 id=span_state style="color:gray">+ style="display:none"> onMouseOut="delline(this)" onClick="showtree('state_hebei')">河北省(冀) style="color:gray">+ style="display:none"> onMouseOut="delline(this)" onClick="showtree('city_baoding')">保定市 style="color:gray">+ style="display:none"> class=tree_3>徐水县 onMouseOut="delline(this)" onClick="showtree('city_handan')">邯郸市 style="color:gray">+ style="display:none"> class=tree_3>曲周县 onMouseOut="delline(this)" onClick="showtree('city_shijiazhuang')">石家庄市 style="color:gray">+ style="display:none"> class=tree_3>晋州市 onMouseOut="delline(this)" onClick="showtree('city_langfang')">廊坊市 style="color:gray">+ style="display:none"> class=tree_3>香河县 onMouseOut="delline(this)" onClick="showtree('city_tangshan')">唐山市 style="color:gray">+ style="display:none"> class=tree_3>玉田县 class=tree_3>山西省(晋) class=tree_3>辽宁省(辽) class=tree_3>吉林省(吉) class=tree_3>黑龙江省(黑) onMouseOut="delline(this)" onClick="showtree('state_jiangsu')">江苏省(苏) style="color:gray">+ style="display:none"> onMouseOut="delline(this)" onClick="showtree('city_suqian')">宿迁市 style="color:gray">+ style="display:none"> class=tree_3>泗洪县 onMouseOut="delline(this)" onClick="showtree('city_nantong')">南通市 style="color:gray">+ style="display:none"> class=tree_3>启东市 class=tree_3>海安县 class=tree_3>如东县 onMouseOut="delline(this)" onClick="showtree('city_xuzhou')">徐州市 style="color:gray">+ style="display:none"> class=tree_3>邳州市 class=tree_3>丰县 class=tree_3>沛县 onMouseOut="delline(this)" onClick="showtree('city_lianyungang')">连云港市 style="color:gray">+ style="display:none"> class=tree_3>东海县 onMouseOut="delline(this)" onClick="showtree('city_huaian')">淮安市 style="color:gray">+ style="display:none"> class=tree_3>金湖县 onMouseOut="delline(this)" onClick="showtree('city_yancheng')">盐城市 style="color:gray">+ style="display:none"> class=tree_3>大丰市 onMouseOut="delline(this)" onClick="showtree('city_yangzhou')">扬州市 style="color:gray">+ style="display:none"> class=tree_3>江都市 class=tree_3>浙江省(浙) onMouseOut="delline(this)" onClick="showtree('state_anhui')">安徽省(皖) style="color:gray">+ style="display:none"> onMouseOut="delline(this)" onClick="showtree('city_asuzhou')">宿州市 style="color:gray">+ style="display:none"> class=tree_3>砀山县 onMouseOut="delline(this)" onClick="showtree('city_xuancheng')">宣城市 style="color:gray">+ style="display:none"> class=tree_3>宁国市 class=tree_3>福建省(闽) class=tree_3>江西省(赣) onMouseOut="delline(this)" onClick="showtree('state_shandong')">山东省(鲁) style="color:gray">+ style="display:none"> onMouseOut="delline(this)" onClick="showtree('city_rizhao')">日照市 style="color:gray">+ style="display:none"> class=tree_3>莒县 class=tree_3>河南省(豫) class=tree_3>湖北省(鄂) onMouseOut="delline(this)" onClick="showtree('state_hunan')">湖南省(湘) style="color:gray">+ style="display:none"> onMouseOut="delline(this)" onClick="showtree('city_huaihua')">怀化市 style="color:gray">+ style="display:none"> class=tree_3>通道县 onMouseOut="delline(this)" onClick="showtree('city_changsha')">长沙市 style="color:gray">+ style="display:none"> class=tree_3>长沙县 onMouseOut="delline(this)" onClick="showtree('city_shaoyang')">邵阳市 style="color:gray">+ style="display:none"> class=tree_3>邵东县 onMouseOut="delline(this)" onClick="showtree('city_changde')">常德市 style="color:gray">+ style="display:none"> class=tree_3>汉寿县 class=tree_3>广东省(粤) class=tree_3>海南省(琼) class=tree_3>四川省(川、蜀) onMouseOut="delline(this)" onClick="showtree('state_guizhou')">贵州省(黔、贵) style="color:gray">+ style="display:none"> onMouseOut="delline(this)" onClick="showtree('city_bijie')">毕节市 style="color:gray">+ style="display:none"> class=tree_3>纳雍县 class=tree_3>云南省(滇、云) class=tree_3>陕西省(陕、秦) class=tree_3>甘肃省(甘、陇) class=tree_3>青海省(青) class=tree_3>台湾省(台) οnmοuseοver="line(this)" onMouseOut="delline(this)" onClick="showtree('autonomous')">自治区 style="color:gray">+ style="display:none"> class=tree_3>广西壮族自治区(桂) class=tree_3>内蒙古自治区(蒙) class=tree_3>西藏自治区(藏) class=tree_3>宁夏回族自治区(宁) class=tree_3>新疆维吾尔自治区(新) οnmοuseοver="line(this)" onMouseOut="delline(this)" onClick="showtree('specially')">特别行政区 style="color:gray">+ style="display:none"> class=tree_3>香港特别行政区(港) class=tree_3>澳门特别行政区(澳)

===============================================================================