• js82:CSS的Style,image的重定位,getElementById,getElementsByTagName,location.href


    原文发布时间为:2008-11-10 —— 来源于本人的百度文章 [由搬家工具导入]

    <!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>js</title>
    <style>
    .level1 {
    font-style: normal;
    font-weight: bold;
    font-variant: normal;
    color: #00FF99;
    background-color: #FF0000;
    text-decoration: underline;
    }
    </style>
    <script type="text/javascript">
    function csschange(){
    var c1=document.getElementById("p1");
    c1.style.fontStyle="italic";
    c1.style.fontWeight="normal";
    c1.style.fontVariant="normal";
    c1.style.color="blue";
    c1.style.backgroundColor="green";
    c1.style.textDecoration="blink";
    }

    function bytag(){
    var c2=document.getElementsByTagName("p");
    c2[0].style.fontStyle="italic";
    c2[0].style.fontWeight="normal";
    c2[0].style.fontVariant="normal";
    c2[0].style.color="red";
    c2[0].style.backgroundColor="yellow";
    c2[0].style.textDecoration="blink";
    c2[1].style.backgroundColor="yellow";
    }

       var position=new Array();
       position[0]=200;position[1]=150;
       position[2]=300;position[3]=150;
       position[4]=300;position[5]=300;
       position[6]=200;position[7]=300;
       var i=0;
    function run(){
    var m=document.getElementById("move");
    m.style.left=position[i];
    m.style.top=position[i+1];
    i+=2;
    if(i==8)
         i=0;
    }
    function checkbrowser(){
       if(!document.getElementById)
           alert('浏览器不支持此程序');
       else if(!document.all){
           alert('浏览器不支持此程序');
        document.location.href="http://www.baidu.com";
        }
        }
    </script>
    </head>

    <body onload="checkbrowser();runing=setInterval('run();',100);">

    <p class="level1" id="p1">改变你</p>
    <p>&nbsp; </p>
    <form id="form1" name="form1" method="post" action="">
    <label>
    <input name="change" type="button" id="change" value="按钮ByID" onclick="csschange();" />
    </label>
    <label>
    <input name="tag1" type="button" id="tag1" value="按钮ByTag" onclick="bytag();" />
    </label>
    </form>
    <span style="position:absolute;left:200px;top:300px;" id="move">
    <img src="../../图片/视觉/image016.jpg" width="100" height="100"/>
    </span>
    <input name="Stop" type="button" id="stop" onclick="clearInterval(runing);" value="Stop" />
    </body>
    </html>

    1、JavaScript引用Css属性时,若有连接符,须去掉连接符,并把连接符后面的单词的第一个字符大写,如css属性background-color,引用时需写成backgroundColor。

    2、getElementsByTagName是数组,getElementById是唯一一个

    3、JavaScript引用属性时一般是document.getElementById("objectId").style.属性

    4、用if(!document.getElementById)可以判断该浏览器是不是W3C标准,用 else if(!document.all)可以判断是不是旧版本的IE浏览器

  • 相关阅读:
    运行了unittest没有结果返回
    python学习笔记11.2-unittest的使用与报告生成
    python学习笔记11.1-类的继承与动态属性的设置
    docker概念
    python学习笔记10-方法
    python学习笔记9-类和对象
    python学习笔记8-异常处理
    python学习笔记2-字典和列表
    3.JavaScript-语法、关键保留字及变量
    如何实现导航菜单栏中的二级下拉菜单?
  • 原文地址:https://www.cnblogs.com/handboy/p/7148452.html
Copyright © 2020-2023  润新知