javascript 学习随笔2
<html>
<head>
<script type="text/javascript">
function writeText(txt)
{
document.getElementById("desc").innerHTML=txt
}
</script>
</head> <body>
<img src="/i/eg_planets.jpg" border="0" usemap="#planetmap" alt="Planets" /> <map name="planetmap" id="planetmap"> <area shape="circle" coords="180,139,14"
onMouseOver="writeText('直到 20 世纪 60 年代,金星一直被认为是地球的孪生姐妹,因为金星是离我们最近的行星,同时还由于两者拥有很多共同的特征。')"
href ="/example/html/venus.html" target ="_blank" alt="Venus" /> <area shape="circle" coords="129,161,10"
onMouseOver="writeText('从地球上是很难研究水星的,这是由于它和太阳的距离总是很近。')"
href ="/example/html/mercur.html" target ="_blank" alt="Mercury" /> <area shape="rect" coords="0,0,110,260"
onMouseOver="writeText('太阳和类似木星这样的气态行星是到目前为止太阳系中最大的物体。')"
href ="/example/html/sun.html" target ="_blank" alt="Sun" /> </map> <p id="desc"></p> </body>
</html>
使用map, area , coords实现对图片上不同区域添加事件
<script type="text/javascript">
function timedMsg()
{
var t=setTimeout("alert('5 秒!')",5000)
}
</script>
5秒后执行弹出框显示5秒
<html>
<head>
<script type="text/javascript">
function timedText()
{
var t1=setTimeout("document.getElementById('txt').value='5 秒'",0)
var t2=setTimeout("document.getElementById('txt').value='4 秒'",1000)
var t3=setTimeout("document.getElementById('txt').value='3 秒'",2000)
var t2=setTimeout("document.getElementById('txt').value='2 秒'",3000)
var t3=setTimeout("document.getElementById('txt').value='1 秒'",4000)
var t3=setTimeout("document.getElementById('txt').value='开始'",5000)
}
</script>
</head> <body> <form>
<input type="button" value="显示倒计时" onClick="timedText()">
<input type="text" id="txt">
</form> <p>点击上面的按钮。括号最后的数字代表逝去的时间。</p>
</body> </html>
使用setTimeout实现倒计时效果
javascript 学习随笔2的更多相关文章
- javascript学习随笔(二)原型prototype
JavaScript三类方法: 1.类方法:2.对象方法:3.原型方法;注意三者异同 例: function People(name){ this.name=name; //对象方法 this.Int ...
- javascript 学习随笔7
<head> <title>标题页-学无忧(www.xue51.com)</title> <script language="JavaScript& ...
- javascript 学习随笔
var carname="Volvo"; var carname; 重新声明变量后变量的值不变,在这里还是volvo var carname="Volvo"; ...
- javascript 学习随笔3
<html> <head> <script type="text/javascript"> function startTime() { var ...
- javascript 学习随笔1
html部分 <body onload="message()"><!--主题部分加载就调用-->document.getElementById(" ...
- javascript 学习随笔6
改变html内容 document.getElementById("p1").innerHTML="New text!"; var element=docume ...
- JavaScript ES6 数组新方法 学习随笔
JavaScript ES6 数组新方法 学习随笔 新建数组 var arr = [1, 2, 2, 3, 4] includes 方法 includes 查找数组有无该参数 有返回true var ...
- typeScript学习随笔(一)
TypeScript学习随笔(一) 这么久了还不没好好学习哈这么火的ts,边学边练边记吧! 啥子是TypeScript TypeScript 是 JavaScript 的一个超集,支持 es6 标准 ...
- jquery学习随笔
转)jquery学习随笔(jquery选择器) jQuery的选择器是CSS 1-3,XPath的结合物.jQuery提取这二种查询语言最好的部分,融合后创造出了最终的jQuery表达式查询语言. ...
随机推荐
- cocos2d-x Android环境搭建
1.Java虚拟机.分32位和64位.64位: jdk-8u11-windows-x64-8.0.11.12.1406275777 环境变量配置,我的电脑右击->属性->高级系统设置-&g ...
- 图标字体IcoMoon 使用
IcoMoon 使用官方地址 http://icomoon.io/实际上,它是一种字体,只不过这种字体的字象图标一样,比如windows中自带的MT Extra Webdings Wingdings字 ...
- 转:CI配置SMARTY
1.到相应站点下载Smarty的源码包:2.将源码包里面的libs文件夹copy到CI的项目目录下面的libraries文件夹下,并重命名为Smarty:3.在目录 application/libra ...
- Sicily-1156
一. 模仿树的的先序遍历.范围是1000个节点.用数组存储节点的信息. 二. 要注意的是,头结点是不确定的,所以在前序遍历之前要找出头结点,除了头结点的下标值出现一次之外,其他结点 ...
- js 解析XML 在Edge浏览器下面 无法准确读到节点属性值
js 解析XML 在Edge浏览器下面 无法准确读到节点属性值 Dom.documentElement.childNodes[j].attributes[2] 这个是大众写法 在win10的edge ...
- HTML+CSS基础总结
1. 首先声明正确的文档类型doctype 通常有四种文档类型可供选择: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" ...
- AIX LVM学习笔记
LVM: LOGIC VOLUMN MANAGEMENT (逻辑卷管理器) 通过将数据在存储空间的 逻辑视图 与 实际的物理磁盘 之间进行映射,来控制磁盘资源.实现方式是在传统的物理设备驱动层之上加载 ...
- spring多数据源的配置
C3P0和DBCP的区别 C3P0是一个开源的JDBC连接池,它实现了数据源和JNDI绑定,支持JDBC3规范和JDBC2的标准扩展.目前使用它的开源项目有Hibernate,Spring等. d ...
- 解决虚拟内存不够导致Eclipse is not responding
安装目录下eclipse.ini中: 修改参数至必要大小. e.g. -vmargs-Djava.net.preferIPv4Stack=true-Dosgi.requiredJavaVersion= ...
- Arrays类学习笔记
Arrays.asList(arr); 该方法可以把数组变成List集合. String[] arr = {"abc","cc"}; List<Strin ...