java-script简单语法练习-第二天

原创 2016年06月01日 08:39:01

今天主要是dom的操作,用的是web-storm编写

1.对图片放大与缩小

<span style="color:#333333;"><!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>图片放大缩小</title>
</head>
<body>
    <p align="center">
        <input type="button" value="放大" onclick="big()">
        <input type="button" value="缩小" onclick="smr()">
    </p>
    <div align="center">
        <input name="img1" type="image" id="img1" src="images/tu1.png"/>
    </div>
    <script language="JavaScript">
        function big(){//图片放大的方法
            var height=img1.height;
            var width=img1.width;
            if((height<=height*2)||(width<=width*2)){
                img1.height=img1.height+20;
                img1.width=img1.width+20;
            }
        }
        function smr(){//图片缩小的方法
            var height=img1.height;
            var width=img1.width;
            if((img1.width>100)||(img1.height>100)){
                img1.height=img1.height-20;
                img1.width=img1.width-20;
            }
        }
    </script>
</body>
</html></span>
2.计时器,包括停止开始

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>计时器</title>
    <script>
        var s;
        window.onload=function(){//时间自动1秒更新一次
            s=window.setInterval("showtime()",1000);
        }
        function showtime(){//获取当前时间方法
            var sdom=document.getElementById("spantime");
            var now=new Date();//得到当前时间
            var stime=now.getFullYear()+"年"+now.getMonth()+"月"
                    +now.getDate()+"日"+now.getHours()+"时"
                    +now.getMinutes()+"分"+now.getSeconds()+"秒";
            sdom.innerHTML=stime;


        }
        function stopit(){
            window.clearInterval(s);//停止计时器
        }
        function start(){//开始计时器
            s=window.setInterval("showtime()",1000);
        }
    </script>
</head>
<body>
    <span id="spantime"></span>
    <input type="button" value="停止" onclick="stopit()">
   <input type="button" value="开始" onclick="start()">
</body>
</html>

3.图片定时消失,出现

<pre name="code" class="html"><!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>计时器</title>
    <script>
        window.onload=function(){
            window.setInterval("start()",1000);
        }
        function display(){
            var sdom=document.getElementById("img1");
            sdom.style.display="none";
            window.setTimeout("start()",3000);
        }
        function start(){
            var dom=document.getElementById("img1");
            dom.style.display="block";
            window.setTimeout("display()",3000);
        }
        function spantime(){
            var dates=new Date();
            var imgdate=document.getElementById("spantime");
            var date =dates.getFullYear()+"年"+dates.getMonth()+"月"+dates.getDate()+
                    "日"+dates.getHours()+"时"+dates.getMinutes()+"分"+dates.getSeconds()+"秒";
            imgdate.innerHTML=date;
        }
    </script>
</head>
<body>
<img src="images/tu1.png" id="img1">
    <span id="spantime"></span>
</body>
</html>



版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

黑马程序员——java第二天:基础语法(总结:运算符)

-------android培训、java培训、期待与您交流! ---------- 运算符的优先级和结合性 优先级 描述 运算符示例 结合性 1 分隔符 []  ()  .  , ...

java基础第二天——基础语法

常量: 在程序执行过程中,其值不能改变 常量的分类: 字面值常量: 整数常量: 1, 12, -2 小数常量: 5.5, 3.414, -2.5 字符常量: 'a' 'A' '0'...

黑马程序员——第二天(Java基础语法1)

---------------------- android培训、java培训、期待与您交流! ---------------------- 关键字: 被java赋予了特殊的含义 一.标识符...

【黑马程序员】-Java基础语法 第二天

-------  android培训、java培训、java学习型技术博客、期待与您交流! ---------- 知识点 1)标识符 标识符是程序中的事物的名称。 标识符是...

java Script 组合模式 简单实例

(fu

黑马程序员_Java Script简单知识总结(JS特有的)

---------------------- Windows Phone 7手机开发、.Net培训、期待与您交流! ---------------------- JavaScript和J...

简单的JAVA SCRIPT 例子

Android OTA升级原理和流程分析(九)---updater-script脚本语法简介以及执行流程

Android系统Recovery工作原理之使用update.zip升级过程分析(九)---updater-script脚本语法简介以及执行流程 转载自:http://blog.csdn.ne...

Struts 2练习源码 第二天002

  • 2011-05-18 08:37
  • 18.57MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)