类似框架的js代码

2016-02-19 11:41 8 1 收藏

今天图老师小编要向大家分享个类似框架的js代码教程,过程简单易学,相信聪明的你一定能轻松get!

【 tulaoshi.com - Web开发 】

代码如下:

html
head
title类似框架的JS导航菜单/title
meta http-equiv=content-Type content="text/html;charset=gb2312"
!--把下面代码加到head与/head之间--
SCRIPT language=JavaScript
            function secBoard(n)
            {
                for(i=1;i6;i++)
                {
                    eval("document.getElementById('cel"+i+"').background=''");
                }
                eval("document.getElementById('cel"+n+"').background=''");
                for(i=1;i6;i++)
                    eval("tbx0"+i+".style.display='none'");
                eval("tbx0"+n+".style.display='block'");
            }

/SCRIPT
/head
body
!--把下面代码加到body与/body之间--
div style="text-align:center"
    table border="0" width="600" cellpadding="0" style="border-collapse: collapse" id="table1"
        tr
            td width="93" height="125" style="text-align:center" valign="top"
            table border="0" width="100%" cellpadding="2" id="table28"
                tr
                    td valign="top"
                    div style="text-align:center"
                        table border="1" width="100%" cellspacing="0" cellpadding="0" style="border-collapse: collapse" bordercolor="#FF0000" id="table29"
                            tr
                                td id=cel1 onclick=secBoard(1) style="cursor:hand" height="25" style="text-align:center"链接1/td
                            /tr
                            tr
                                td id=cel2 onclick=secBoard(2) style="cursor:hand" height="25" style="text-align:center"链接2/td
                            /tr
                            tr
                                td id=cel3 onclick=secBoard(3) style="cursor:hand" height="25" style="text-align:center"链接3/td
                            /tr
                            tr
                                td id=cel4 onclick=secBoard(4) style="cursor:hand" height="25" style="text-align:center"链接4/td
                            /tr
                            tr
                                td id=cel5 onclick=secBoard(5) style="cursor:hand" height="25" style="text-align:center"链接5/td
                            /tr
                        /table
                    /div
                    /td
                /tr
            /table
            /td
            td valign="top"
            table border="0" width="100%" cellpadding="2" id="table2"
                tr
                    td
                    div style="text-align:center"
                        table border="1" width="100%" cellspacing="0" cellpadding="0" style="border-collapse: collapse" bordercolor="#0000FF" id="table3"
                            tr
                                td valign="top"TABLE id=Table27 cellSpacing=0 cellPadding=0 width=300 
border=0
TBODY
TR
TD width=1 bgColor=#a9a9a9 height="1"/TD
TD class=p2 width=298 bgcolor="#CCCCCC" height="1"/TD/TR
TR
TD width=1BR/TD
TD class=p2 width=298
TABLE id=tbx01 style="DISPLAY: block" 
cellSpacing=5 cellPadding=0 width="100%" 
style="text-align:center" border=0
TBODY
TR
TD class=p2
                                p style="line-height: 150%"
                                font color="#FF0000"b链接1的内容:/b/font酒水 香烟 鲁菜 东北 官府 湘菜 苏菜 陕西 BR湖北 淮扬 西餐 酒水 香烟 鲁菜 东北 官府 湘菜 苏菜 陕西 BR湖北 淮扬 西餐酒水 香烟 鲁菜 东北 官府 湘菜 苏菜 陕西 BR湖北 淮扬 西餐酒水 香烟 鲁菜 东北 官府 湘菜 苏菜 陕西 BR湖北 淮扬 西餐/TD/TR/TBODY/TABLE
TABLE id=tbx02 style="DISPLAY: none" 
cellSpacing=5 cellPadding=0 width="100%" 
style="text-align:center" border=0
TBODY
TR
TD class=p2
                                p style="line-height: 150%"
                                font color="#FF0000"b链接2的内容:/b/font观前街 人民路 广济路 石路 朱家庄 西单 崇文门 
                                br
                                苏州街 方庄 石路 朱家庄 西单 崇文门 
                                br
                                苏州街 方庄 石路 朱家庄 西单 崇文门 
                                br
                                苏州街 方庄 观前街 人民路 广济路 石路 朱家庄 西单 崇文门 
                                br
                                苏州街 方庄 石路 朱家庄 西单 崇文门 
                                br
                                苏州街 方庄 石路 朱家观前街 人民路 广济路 石路 朱家庄 西单 崇文门 
                                br
                                苏州街 方庄 石路 朱家庄 西单 崇文门 
                                br
                                苏州街 方庄 石路 朱家/TD/TR/TBODY/TABLE
TABLE id=tbx03 style="DISPLAY: none" 
cellSpacing=5 cellPadding=0 width="100%" 
style="text-align:center" border=0
TBODY
TR
TD class=p2
                                p style="line-height: 150%"
                                font color="#FF0000"b链接3的内容:/b/font水煮鱼 烤鸭 香辣蟹 火锅 羊蝎子 农家菜 烧烤 小吃 BR鲍翅 快餐 
                                鱼 烤鸭 香辣蟹 火锅 羊蝎子 农家菜 烧烤鱼 烤鸭 香辣蟹 火锅 羊蝎子 农家菜 烧烤香辣蟹 
                                火锅 羊蝎子 农家菜 烧烤鱼 烤鸭 香辣蟹 火锅 羊蝎子 农家菜 烧烤香辣蟹 火锅 羊蝎子 
                                农家菜 烧烤鱼 烤鸭 香辣蟹 火锅 羊蝎子 农家菜 烧烤/TD/TR/TBODY/TABLE
                                TABLE id=tbx04 style="DISPLAY: none" 
cellSpacing=5 cellPadding=0 width="100%" 
style="text-align:center" border=0
TBODY
TR
TD class=p2
                                p style="line-height: 150%"
                                font color="#FF0000"b链接4的内容:/b/font水煮鱼 烤鸭 香辣蟹 火锅 羊蝎子 农家菜 烧烤 小吃 BR鲍翅 快餐 
                                农家菜 烧烤 小吃 BR鲍翅 快餐 农家菜 烧烤 小吃 BR鲍翅 快餐 煮鱼 烤鸭 
                                香辣蟹 火锅 羊蝎子 农家菜 烧烤 小吃 BR鲍翅 快餐 
                                农家菜 烧烤 小吃 BR鲍翅 快餐 农家菜 烧烤 小吃 BR鲍翅 快餐 /TD/TR/TBODY/TABLE
                                TABLE id=tbx05 style="DISPLAY: none" 
cellSpacing=5 cellPadding=0 width="100%" 
style="text-align:center" border=0
TBODY
TR
TD class=p2
                                p style="line-height: 150%"
                                font color="#FF0000"b链接5的内容:/b/font水煮鱼 烤鸭 香辣蟹 火锅 羊蝎子 农家菜 烧烤 小吃 BR
                                鲍翅 快餐快餐快餐快餐快餐快餐快餐快餐快餐快餐快餐快餐快餐快餐 煮鱼 烤鸭 香辣蟹 
                                火锅 羊蝎子 农家菜 烧烤 小吃 BR
                                鲍翅 快餐快餐快餐快餐快煮鱼 烤鸭 香辣蟹 火锅 羊蝎子 农家菜 烧烤 小吃 BR
                                鲍翅 快餐快餐快餐快餐快/TD/TR/TBODY/TABLE/TD
TD width=1BR/TD/TR/TBODY/TABLE/td
                            /tr
                        /table
                    /div
                    /td
                /tr
            /table
            /td
        /tr
        /table
/div
/body
/html

来源:http://www.tulaoshi.com/n/20160219/1598206.html

延伸阅读
标签: Web开发
/*=========================================         Powered by Fason         Email: fason_pfx@hotmail.com         HomePage:http://fason.nease.net      &nbs...
标签: Web开发
一直以来,JS前端代码因为必须经过IE明文解析,某些加密的JS如:JScript.Encode也因为树大招风,早就被人破解了。还有些加密的手段,通过复杂的变换,改变源码,但最终都逃不脱最后的审判,像unescape,document.write,eval语句来还原。对于JS代码的保护,最好的手段就是混淆,混淆的目的就是让读懂代码的成本比直接写代码的成本高,混淆不是不可...
标签: Web开发
控制横向和纵向滚动条的显隐? body style="overflow-y:hidden" 去掉x轴 body style="overflow-x:hidden" 去掉y轴 body scroll="no"不显 表格变色 TD onmouseover="this.style.backgroundColor='#FFFFFF'" onmouseout="this.style.backgroundColor=''" style="CURSOR: hand" ...
在用HTML5做跨平台应用开发时,尝尝会用到java和js方法互调的问题,对初学者而言,可能会有点难,在这里分享一些自己在实际开发过程中的用法,希望对你有帮助: 首先是js代码调用java代码介绍: 代码如下: public class CzingLBWebMain extends DroidGap { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(saved...
标签: Web开发
有两个变量 a 和 b  如果a=1,3,5,7,9 则b="奇数" 如果a=2,4,6,8  则b="偶数" 如果a="0" 则b="零" [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

经验教程

876

收藏

99
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部