• 超链接,翻页


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
    <title>范例11-19</title> 
    </head> 
    <body> 
    <p><a href="http://www.163.com">http://www.163.com</a></p>
    <p><a href="http://www.sohu.com">http://www.sohu.com</a></p>
    <p><a href="http://www.21cn.com">http://www.21cn.com</a></p>
    <p><a href="http://www.sina.com">http://www.sina.com</a> 
    <script type="text/javascript"> 
    function showLinks()
    {
        links=document.all.tags("a");  //取得页面所的超链接,存放在links数组中
        var str="";    
        k=0;
        for(i in links)
        {    
            // 其地址下标是从1开始的,当下标为0时,表示链接个数,将值取出来放在str中
            if(k!=0)str+=links[i]+"
    ";
            k++;
        }
        alert("一共有"+links.length+"个链接,分别是:
    "+str);
    } 
    </script> 
    </p>
    <p>
      <label>
      <input type="submit" name="Submit" value="查看超链接" onclick="showLinks()" />
      </label>
    </p>
    </body> 
    </html>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>范例11-23</title>
    <style type="text/css">
    <!--<!-- 设置显示的样式-->
    body
    {
        background-color: #FFCC00;
    }
    .STYLE4 {
        font-size: 40px;
        font-family: "楷体_GB2312";
        text-indent: 2px;
        }
    .STYLE5 {font-size: 36px}
    -->
    </style>
    </head><body>
    <div > 
     <table width="957" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td colspan="4" align="center"><span class="STYLE5">长恨歌</span></td>
        </tr>
        <tr>
          <td height="369" colspan="4" valign="top">
          <div align="center" ><div align="left"  id="wz" class="STYLE4">  汉皇重色思倾国,御宇多年求不得。杨家有女初长成,养在深闺人未识。天生丽质难自弃,一朝选在君王侧。回眸一笑百媚生,六宫粉黛无颜色。春寒赐浴华清池,温泉水滑洗凝脂。侍儿扶起娇无力,始是新承恩泽时。云鬓花颜金步摇,芙蓉帐暖度春宵。春宵苦短日高起,从此君王不早朝。承欢侍宴无闲暇,春从春游夜专夜。 后宫佳丽三千人,三千宠爱在一身。金屋妆成娇侍夜,玉楼宴罢醉和春。姊妹弟兄皆列士,可怜光彩生门户。 遂令天下父母心,不重生男重生女。骊宫高处入青云,仙乐风飘处处闻。缓歌慢舞凝丝竹,尽日君王看不足。
            </div>
          </div>
        </td>
        </tr>
        <tr>
          <td width="175"><div align="center" ><a href="范例11-24.html?id=1">第一页</a></div></td>
          <td width="175"><div align="center" onclick="Link(2)">上一页</div></td>
          <td width="175"><div align="center" onclick="Link(3)">下一页</div></td>
          <td width="432"><div align="center"><a href="范例11-24.html?id=4">最后一页</a></div></td>
        </tr>
      </table>  
    </div>
    <script language="javascript">
    var chapter=new Array(4);
    // 初始化数组chapter
    chapter[0]="汉皇重色思倾国,御宇多年求不得。杨家有女初长成,养在深闺人未识。天生丽质难自弃,一朝选在君王侧。回眸一笑百媚生,六宫粉黛无颜色。春寒赐浴华清池,温泉水滑洗凝脂。侍儿扶起娇无力,始是新承恩泽时。云鬓花颜金步摇,芙蓉帐暖度春宵。春宵苦短日高起,从此君王不早朝。承欢侍宴无闲暇,春从春游夜专夜。 后宫佳丽三千人,三千宠爱在一身。金屋妆成娇侍夜,玉楼宴罢醉和春。姊妹弟兄皆列士,可怜光彩生门户。 遂令天下父母心,不重生男重生女。骊宫高处入青云,仙乐风飘处处闻。缓歌慢舞凝丝竹,尽日君王看不足。";
    chapter[1]="渔阳鼙鼓动地来,惊破霓裳羽衣曲。九重城阙烟尘生,千乘万骑西南行。翠华摇摇行复止,西出都门百馀里。六军不发无奈何,宛转蛾眉马前死。花钿委地无人收,翠翘金雀玉搔头。君王掩面救不得,回看血泪相和流。 黄埃散漫风萧索,云栈萦纡登剑阁。峨嵋山下少人行,旌旗无光日色薄。 蜀江水碧蜀山青,圣主朝朝暮暮情。行宫见月伤心色,夜雨闻铃肠断声。天旋地转回龙驭,到此踌躇不能去。马嵬坡下泥土中,不见玉颜空死处。君臣相顾尽沾衣,东望都门信马归。归来池苑皆依旧,太液芙蓉未央柳。芙蓉如面柳如眉,对此如何不泪垂!";
    chapter[2]="春风桃李花开日,秋雨梧桐叶落时。西宫南内多秋草,落叶满阶红不扫。梨园子弟白发新,椒房阿监青娥老。夕殿萤飞思悄然,孤灯挑尽未成眠。迟迟钟鼓初长夜,耿耿星河欲曙天。鸳鸯瓦冷霜华重,翡翠衾寒谁与共?悠悠生死别经年,魂魄不曾来入梦。临邛道士鸿都客,能以精诚致魂魄。为感君王辗转思,遂教方士殷勤觅。排空驭气奔如电,升天入地求之遍。上穷碧落下黄泉,两处茫茫皆不见。忽闻海上有仙山,山在虚无缥缈间。 楼阁玲珑五云起,其中绰约多仙子。中有一人字太真,雪肤花貌参差是。金阙西厢叩玉扃,转教小玉报双成。";
    chapter[3]="闻道汉家天子使,九华帐里梦魂惊。揽衣推枕起徘徊,珠箔银屏迤逦开。云鬓半偏新睡觉,花冠不整下堂来。风吹仙袂飘飘举,犹似霓裳羽衣舞。玉容寂寞泪阑干,梨花一枝春带雨。含情凝睇谢君王,一别音容两渺茫。昭阳殿里恩爱绝,蓬莱宫中日月长。回头下望人寰处,不见长安见尘雾。唯将旧物表深情,钿合金钗寄将去。钗留一股合一扇,钗擘黄金合分钿。但教心似金钿坚,天上人间会相见。临别殷勤重寄词,词中有誓两心知。七月七日长生殿,夜半无人私语时。在天愿作比翼鸟,在地愿为连理枝。天长地久有时尽,此恨绵绵无绝期!";
    var  url=self.document.location.href;                        //取得当前网页的路径
    var id=url.indexOf("=");
    if(id!=-1)
    {     
        id++;
        d=url.substring(id,url.length);                            //取得当前的id值 
        wz.removeChild(wz.firstChild);                            //删除文本结点
        nodeText = document.createTextNode(chapter[id-1]);      //新文本节点的内容
        wz.appendChild(nodeText );                                //创建文本结点
    }
    function Link(str)
    { 
        var  url=self.document.location.href;// 取得本地链接的地址
        var n=url.indexOf("=");                  //找到“=”的位置
        if(n==-1)
        {
            n=1;                            //当“=”不存在时n=1
        }
        else                                //当“=”存在时,取得页面id的值并存入变量n中
        {
            n++;
            n=url.substring(n,url.length);
        }
        if(str==2)
        {
            if(n==1)                        //判断当前是否为首页
            {
                alert("当前已经是首页了");
            }
            else                            
            {
                n--;
                self.document.location.href="范例11-24.html?id="+n;//上一页的地址
            }
        }
        else
        {
            if(n==4)                                              //判断当前是否为尾页
            {
                alert("当前已经是最后一页了");
            }
            else
            {
                n++;
                self.document.location.href="范例11-24.html?id="+n;//下一页的地址
            }
        }    
    }
    </script> 
    </body>
    </html>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>查看网站目录</title>
    <script language="javascript">
    function showRoot()
    {
        links=document.all.tags('a');//找到所有的链接,并存放在links中
        var n=links.length;             //取得超链接的个数
        var path=new Array(n);         //定义一个数组,用于存放路径
        var k=0;
        for(var i=0;i<n;i++)
        {
            //查看的是本地网站的目录,因些下面的localhost和127.0.0.1可以换成你想要网站的hostname
            if(document.links[i].href.indexOf("localhost")!=-1||document.links[i].href.indexOf("127.0.0.1")!=-1)
            {
                 path[k]=document.links[i].pathname;//将路径存放在path数组中
                 k++;
             }
        }
        var str="";
        var s="";
        for(var j in path)
        {
            s=path[j].split("/");        //以”/“为标志分开各级路径并存入s 数组中
            for(l=0;l<s.length-1;l++)  //将路径存放在字符串str中
            {
                str+=s[l]+"/";            //取得除最后一个元素以外的各级路径
            }
            str+="
    ";
        }
        alert("网站的目录为:
    "+str);//显示路径
    }
    </script>
    </head>
    <body onload="showRoot()">
    <a href="file:///D|/usr/www/html/database/index.html">链接数据库主页</a>
    <a href="file:///D|/usr/www/html/database/SQL/EmplDir_MySQL.sql">链接SOL数据库</a>
    <a href="file:///D|/usr/www/html/Editor/editor.htm">链文本接编辑器</a>
    <a href="file:///D|/usr/www/html/Editor/HtmlEditor/smile/smile16.gif">查看图片</a>
    </body>
    </html>
  • 相关阅读:
    python自动化测试(2)--读取excel中的测试用例并使用列表进行存放
    Numpy学习记录
    Tensorflow环境安装记录--无法识别GPU的问题
    Tensorflow框架学习(1)--CNN的实现
    IDEA创建springboot项目总是创建失败问题的解决
    java_集合知识点小结
    java易错知识点汇总_1
    struts2 中文件的位置问题
    struts2 action中的私有变量
    span 标记 width 设置
  • 原文地址:https://www.cnblogs.com/huodaihao/p/7436126.html
Copyright © 2020-2023  润新知