JavaScript简单的实例应用
1、显示当前时间:
<!doctype>
<html>
<head>
<meta charset='utf-8'>
<script type='text/javascript'>
function showtime(){
var now_time = new date(); //创建时间对象的实例
var hours = now_time.gethours(); //获得当前小时数
var minutes = now_time.getminutes(); //获得当前分钟数
var seconds = now_time.getseconds(); //获得当前秒数
var timer = "" + ((hours > 12) ? hours - 12 : hours);
timer += ((minutes < 10) ? ":0" : ":") + minutes;
timer += ((seconds < 10) ? ":0" : ":") + seconds;
timer += " " + ((hours > 12) ? "pm" : "am");
document.getElementById("aa").text = timer;
settimeout('showtime()', 1000);
}
</script>
</head>
<body onload="showtime()">
<div id="aa"></div>
</body>
</html>
2、当鼠标经过图像时图像的震动效果:
<!doctype>
<html>
<head>
<meta charset='utf-8'>
<script type='text/javascript'>
var rector = 3, stopit = 0, a = 1;
function init(which){
stopit = 0;
zhend = which;
zhend.style.left = 0;
zhend.style.top = 0;
}
function rattleimage(which){
if((!document.all && !document.getElementById) || stopit = 1)
return;
if(a == 1){
zhend.style.top = parseInt(zhend.style.top) + rector;
} else if(a == 2){
zhend.style.left = parseInt(zhend.style.left) + rector;
} else if(a == 3){
zhend.style.top = parseInt(zhend.style.top) - rector;
} else if(a == 4){
zhend.style.left = parseInt(zhend.style.left) - rector;
}
else {
zhend.style.left = parseInt(zhend.style.left) - rector;
}
if(a < 4)
a++;
else
a = 1;
settimeout('rattleimage()', 50);
}
function stoprattle(which){
stopit = 1;
which.style.left = 0;
which.style.left = 0;
}
</script>
</head>
<body>
<img src="test.png" class="zhendimage" onMouseover="init(this);rattleimage()" onmoouseout="stoprattle(this)" />
</body>
</html>
3、自由切换图像:
<!doctype>
<html>
<head>
<meta charset='utf-8'>
<script type='text/javascript'>
var img = new array(3);
var nums = 0;
if(document.images){
for(i = 1; i <= 3; i ++){
img[i] = new image();
img[i].src = 'images/00' + i + '.png';
}
}
function fort(){
nums ++;
document.images[0].src = img[nums].src;
if(nums == 3)
nums = 0;
}
function slide(){
setInterval('fort()', 1000);
}
</script>
</head>
<body onload="slide()"> </body>
</html>
JavaScript简单的实例应用的更多相关文章
- Javascript DOM操作实例
最近在学DOM,但是还是没有办法很好的记住API,想找些例子来练习,网上的例子将一个个DOM对象方法挨个举例,并没有集合在一起用,效果不尽人意.所以自己写一份实例,顺便巩固下学到的知识. ...
- Google Map JavaScript API V3 实例大全
Google Map JavaScript API V3 实例大全 基础知识 简单的例子 地理位置 语言 位置 坐标 简单的投影 事件 简单事件 关闭事件 多次添加事件 事件属性 控制 php禁用ui ...
- 原生Ajax用法——一个简单的实例
Ajax全名(Asynchronous(异步) JavaScript and XML )是可以实现局部刷新的 在讲AJax之前我们先用简单的实例说一下同步和异步这个概念 /*异步的概念(就是当领导有一 ...
- 纯JSP简单登录实例
记一下,免得以后忘记了,又要去查. 文件共有四个web.xml.login.jsp.logout.jsp.welcome.jsp四个文件 测试环境:Tomcat 6.0.x 假设项目名称是LoginS ...
- ASP.NET MVC 4 插件化架构简单实现-实例篇
先回顾一下上篇决定的做法: 1.定义程序集搜索目录(临时目录). 2.将要使用的各种程序集(插件)复制到该目录. 3.加载临时目录中的程序集. 4.定义模板引擎的搜索路径. 5.在模板引擎的查找页面方 ...
- Linux简单程序实例(GNU工具链,进程,线程,无名管道pipe,基于fd的文件操作,信号,scoket)
一, GNU工具链简介: (1)编译代码步骤: 预处理 -> 编译 -> 汇编 -> 链接: 预处理:去掉注释,进行宏替换,头文件包含等工作: gcc -E test.c -o te ...
- Redis:安装、配置、操作和简单代码实例(C语言Client端)
Redis:安装.配置.操作和简单代码实例(C语言Client端) - hj19870806的专栏 - 博客频道 - CSDN.NET Redis:安装.配置.操作和简单代码实例(C语言Client端 ...
- MVC 4 插件化架构简单实现实例篇
ASP.NET MVC 4 插件化架构简单实现-实例篇 先回顾一下上篇决定的做法: 1.定义程序集搜索目录(临时目录). 2.将要使用的各种程序集(插件)复制到该目录. 3.加载临时目录中的程序集 ...
- 分布式搜索ElasticSearch构建集群与简单搜索实例应用
分布式搜索ElasticSearch构建集群与简单搜索实例应用 关于ElasticSearch不介绍了,直接说应用. 分布式ElasticSearch集群构建的方法. 1.通过在程序中创建一个嵌入es ...
随机推荐
- java 中 heap(堆)和stack(栈)的区别
总结在Java里面Heap和Stack分别存储数据的不同. 区别项 Heap(堆) Stack(栈) JVM中的功能 内存数据区 内存指令区 存储数据 对象实例(注1) 基本数据类型, 指令代码,常量 ...
- dojo Datagrid 实现数据删除功能
DataGrid实现数据动态刷新功能见前一个帖子:http://www.cnblogs.com/qq552048250/p/4447103.html 实现数据删除只需要向表格中动态添加按钮,并为按钮的 ...
- win10:如何开启自带虚拟机
1.首先要找到控制面板,我们点开windows键,然后选择在所有应用中找到“Windows 系统”,打开之后,我们找到“控制面板”,打开. 2.打开控制面板之后,我们选择程序,如图示. 3 ...
- 蒲公英 Bug 管理云
官网访问地址:https://www.tracup.com/ 优势地方: ①免费使用 现在免费,今后也一直免费. ②无需部署 网站采用云端部署,这也就意味着无需开发者自己搭建.部署,注册一个蒲公英账号 ...
- 阅读<All Digital VCXO Replacement for Gigabit Transceiver Applications>笔记(2)---XAPP589
阅读<All Digital VCXO Replacement for Gigabit Transceiver Applications>笔记(2)---XAPP589 1. 2. 3. ...
- VI常用命令及linux下软件
一.一般模式:删除.复制与粘贴类命令 x,X x为向后删除一个字符,X为先前删除一个字符 nx(n代表数字) 向后删除n个字符 dd 删除当前行 D 删除当前行所有字符,试成为空行 ndd(n代表数字 ...
- JS 动态加载脚本的4种方法
有时候我们需要动态的加入适合的js,因为有时候不需要将所有的js都加载进来,以来提高效率,但这种方法比较适合单个js文件比较大的情况 如果js文件都比较小,还是一个js好,这样可以减少连接数.下面是4 ...
- js跨域调用mvc ActionResult扩展
背景 最近2个项目中都用到了js跨域访问的知识,2个项目都需要主站与各个分站之间进行数据交互.状态同步等相关操作.浏览器本身是不允许进行跨域访问,在MVC中我们可以扩展一个方法来实现这个功能.在此大家 ...
- Android开发之环境配置篇
Android环境配置: 一.JDK(不用安装) 1.拷贝 D:\Java\jdk1.8.0_91 文件内容 2. 安卓ADT ADT(Android Development Tools):安装ADT ...
- C语言中sizeof与strlen的区别
1.sizeof sizeof为编译时期被替换,不会等到程序运行再来判断,所以sizeof返回的是数组的总字节数 #include<stdio.h> int main() { ]={'a' ...