zoukankan      html  css  js  c++  java
  • windows.document对象

    1.1找元素

    document.getElementById("id");根据id找最多找一个;

    var a=document.getElementById("id");将找到的元素放在变量中;

    document.getElementByNames("name");根据name找,找出来的是数组;

    document.getElementByTagNames("name");根据表签名找,找出来的是数组;

    document.getElementByClassNames("name");根据表classname找,找出来的是数组;

    alert(a.innerHTML);标签里的html代码和文字都获取了

    alert(a.innerText);只获取里面的文字;

    alert(a.outHTML);包括标签本身的内容;

    1.2操作元素

    var a=var a=document.getElementById("id");

    a.setAttribute("属性名","属性值");设置一个属性,添加或更改都可以;

    a.getAttribute("属性名");获取属性值;

    a.removeAttribute("属性名");移除一个属性

    示例:展示图片的自动和手动切换,并插入超链接。

    代码:

    <style>

    #zlunbo
    { background-image:url(zk2.png) ; 830px; height:540px; position:relative; margin-left:250px;}
    #zzuo
    {
    33px;
    height: 124px;
    position: absolute;
    left: -30px;
    top: 214px;
    line-height: 124px;
    font-size: 50px;
    }
    #zzuo:hover
    { background-color:#C7C7C7; opacity:60%;
    }
    #zyou
    {
    33px;
    height: 124px;
    position: absolute;
    left: 831px;
    top: 214px;
    line-height: 124px;
    font-size: 50px;
    }
    #zyou:hover
    { background-color:#C7C7C7; opacity:60%;
    }

    </style>

    <body>

    <div id="zlunbo"><a target="new" id="zll"><div style=" height:540px;"></div></a>
    <div id="zzuo" onclick="dodo(-1)"> < </div>
    <div id="zyou" onclick="dodo(1)"> > </div>
    </div>

    </body>

    <script>

    var jpg=new Array();
    jpg[0]="url(zk2.png)";
    jpg[1]="url(zt1.png)";
    jpg[2]="url(zx1.png)";
    var xb =0;var n=0;var lbimg=document.getElementById("zlunbo")
    function huan()
    {xb++;
    if(xb==3)
    {xb=0}
    lbimg.style.backgroundImage=jpg[xb];
    if(n==0)
    {window.setTimeout("huan()",4000);}
    var zll1=document.getElementById("zll").href
    var zllianjie=new Array();
    zllianjie[0]="http://www.baidu.com"
    zllianjie[1]="http://www.360.com"
    zllianjie[2]="http://www.qq.com"
    document.getElementById("zll").href=zllianjie[xb]

    }
    function dodo(m)
    {n=1;
    xb=xb+m;
    if(xb<0)
    {xb=2;}
    else if(xb>=3)
    {xb=0;}
    lbimg.style.backgroundImage=jpg[xb];
    var zll1=document.getElementById("zll").href
    var zllianjie=new Array();
    zllianjie[0]="http://www.baidu.com"
    zllianjie[1]="http://www.360.com"
    zllianjie[2]="http://www.qq.com"
    document.getElementById("zll").href=zllianjie[xb]

    }
    window.setTimeout("huan()",4000);

    </script>

  • 相关阅读:
    [总结] 二维ST表及其优化
    [51Nod 1515] 明辨是非
    [总结] fhq_Treap 学习笔记
    [ZJOI2008] 骑士
    [SDOI2010] 古代猪文
    [POJ 1006] 生理周期
    [POJ 2891] Strange Way to Express Integers
    [Luogu 1516] 青蛙的约会
    python第十三天
    python第十二天-----RabbitMQ
  • 原文地址:https://www.cnblogs.com/nicebaby/p/5840270.html
Copyright © 2011-2022 走看看