javascript学习（一） 异常处理与简单的事件
一：异常处理
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<form>
<input id="txt" type="text" />
<input id="btn" type="button" value="提交" onclick="demo2()" />
</form>
<script type="text/javascript">
//系统错误
function demo() {
try {
alert(str);
}
catch (err) {
alert(err);
}
}
//自定义错误
function demo2() {
//这里如果不写try ..catch.. throw ("text不能为空"); 是不会弹出来的
try {
var e = document.getElementById("txt").value;
if (e == "") {
throw ("text不能为空");
}
}
catch (err) {
alert(err);
}
}
</script>
</body>
</html>
二：事件处理：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
.div
{
width: 100px;
height: 100px;
background-color: blue;
}
</style>
</head>
<body>
<div class="div" onmouseover="onOver(this)" onmouseout="onOut(this)">
</div>
<form>
<input id="txt" type="text" onchange="onChange(this)" />
<input id="txt2" type="text" onselect="onSelect(this)" onfocus="onFocus(this)"/>
</form>
<script type="text/javascript">
function onOver(e) {
e.innerHTML = "Hello";
}
function onOut(e) {
e.innerHTML = "World";
} function onChange(e) {
alert("内容改变为:" + e.value)
}
function onSelect(e) {
e.style.color = "red";
}
function onFocus(e) {
e.style.color = "black";
}
</script>
</body>
</html>
效果：
1：当鼠标不再div上时aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHoAAABrCAIAAAA3sQGNAAABwklEQVR4nO3XUW6DMBBF0dmRV+QFeS1RJaRsxfshH3SsoRSHJikkjzu6H1WFEDlY09RGZsexox/gXAP3rgP3rrPKbUZbgxtu3eD+MO5q3zOYmVnyH8oTj1XMaveC4XC4o7gnnenzZ2d62Dr7y1vjzv5qj7c7kLu48vAc91Tqnu58cu7BLDtEc4f7v7irWXKmaZ9EjjbtHSTf8qMvh7SBu83ZuUf3Km7RsOKeTXOmFC62e9zxPmff3Y2yzk3LfKvU+SnuqP3gbstqitNt2UUid15wx1Oc1h8L7jvcJeziRtw/3XA/zt1EyuLvZINb7u6N3PE+ld09hm8jw29SNjdK4ZfL7yRx2q1quD53/w96617FTXC/X3DDrRvccOsGN9y6wQ23bnDDrRvccOsGN9y6wQ23bnDDrRvccOsGN9y6wQ23bnDDrRvccOsGN9y6wQ23bnDDrRvccOsGN9y6wQ23bnDDrRvccOsGN9y6wQ23bnDDrRvccOsGN9y6wQ23bnDDrRvccOsGN9y6wQ23bnDDrRvccOsGN9y6wQ23bnDDrRvccOsGN9y6wQ23bnDDrRvcn8Z9+brSy+tx/+GtMdsG7l3nBvPPwCF0hROrAAAAAElFTkSuQmCC" alt="" />
2：当鼠标放在div上时aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIkAAAByCAIAAADoE2VEAAAB30lEQVR4nO3YzW3CQBgG4a+jrcgF0QX3KJKltLKFpAPnYBl5/QMLSexZNK/mgg9A/GCMEt+Ourg66mJw1GnDnTbcacOdNtxpw5023GnD3a5NhNWmDTdtuGnD7XibcV3EENFPD/uK93qJyM8cb77jbXJEKs/s5dG77CbCXHf8TWrCZiztGOwdbz5tuNFs0v4d6Cmb2yrhiZ1is9jt9KUZSbfiqbeZ06a6HxrETrHZvG7y9ONtrC8f1tssLsTFy7UUx6ZfXU+v2XQrmzj9LLduk1cY9w32jnvd/L3NUN4b+t/db/LWczbWwTa5/L5a/19g8wstRbH86Pj8eVqFOd7m/D+4obThpg03bbhpw00bbtpw04abNty04aYNN224acNNG27acNOGmzbctOGmDTdtuGnDTRtu2nDThps23LThpg03bbhpw00bbtpw04abNty04aYNN224acNNG27acNOGmzbctOGmDTdtuGnDTRtu2nDThps23LThpg03bbhpw00bbtpw04abNty04aYNN224acNNG27acNOGmzbctOGmDTdtuGnDTRtu2nDThps23LThpg03bbhpw00bbtpw04abNty04aYNN224acPtaJuPzy87t3s2//NpcLXThjttuPsB6uvxQXF/RokAAAAASUVORK5CYII=" alt="" />
3：修改txt的值为李鹏时：aaarticlea/png;base64,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" alt="" />
4：选中一下tex2的值时：aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMoAAAA2CAIAAAAJV5GdAAABQElEQVR4nO3bTWrDMBRGUe+p++s+uobSUbOqbsKdmeB/SD7ryZyDCMIixoOLYg0yjBAztH4A7kxeBMmLIHkRJC+C5EWQvAiSF0HyIkheBMmLIHkRJC+C5EWQvAiSF0HD98/v1tj6zufjz7jTCOa1tbCfV+ZhaEBeBMmLoLp5fXy9c9BET3mtXjysSl4Nlc7r0CydM3OuVDqv2Sb0/Lm/uvrJ9TrIaxw3J4d5TbeiidJ5TZNlVc9Lk+Xc7tVW6by23srP/ziOiwS5Ugd5HR4ex923Lnk11FNeqxedHCsrndeh/d1rtsr1Sud1fvdycqzpznnZvZrrI6/Jal6rG5WTYwV95PX6oIm6eXED8iJIXgRl8/JXDiOYV+7WIC+C5EWQvAiSF0HyIkheBMmLIHkRJC+C5EWQvAiSF0HyIkheBP0DkJfiowvVJgkAAAAASUVORK5CYII=" alt="" />结果变为：aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAANgAAAA1CAIAAACsmLLmAAABWklEQVR4nO3bUYqDMBiF0ex/K8M8dYGZl6F11Fgpg7n8nkMQodoK+Yi10NYhQJt9AdC7EAkhRCIIkQhCJIIQiSBEIgiRCEIkghCJIEQiCJEIQiSCEIkgRCIIkQhCJIIQiSBEIgiRCEIkghCJIEQitK/vx3OMDloeYxQYVxZ20mtFPLi+zEvnM5mzKcTbyZxNId5O5mxODbF5VJqgaIgfxPQ8RYgzVAmxtTdjddjxPperEuLr1LbeHr862nKtWiFub6+rqg7isyJOVSXE5f239/X+mVtztyLOVCXE3/MGXw2XB4y2HlamqhXin/fY6+nM90IhzlA0xFFMnppTVQnx/M83u9vtq1yrSojrNxiviKOtFXEqIVoRI5QLcfS8vHvAdqcLcY5yIf7DhwtxAiESIXM2hXg7mbMpxNvJnE1/nrrjuLKwkzwuEEGIRBAiEYRIBCESQYhEECIRfgDKwTVC+UmAHAAAAABJRU5ErkJggg==" alt="" />
5：焦点放在tex2上时：结果为：aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAL0AAAAkCAIAAABT3KzsAAAA9klEQVR4nO3YUQ6CMBBF0a7cVbkqN1F/DGmgremLzpuSe9IQCBD9uBnBUoF1xf0FsCW6gYJuoPh083i+WHdacd38+5MQhm6goBso6AaKFN2UsvzOJdyCH/J0U745XTbZh4V53hwd1N4IuZ6dX48wzm7auXLaaQ+7W+aNl/N3qj3snpr8TlXmjZV53nQfa9oLRlui8UrxPlUHw4Mnm7RSdDPqgPeptLK/h3e37VlYZJ83oy3zxmvLbuZ3IYD/f7/55Lg+1rQ7cEkxb7AduoGCbqCgGyhCu2HdaQV1AyyhGyjoBgq6gYJuoKAbKOgGCrqBgm6goBso3iRn0InlYqC7AAAAAElFTkSuQmCC" alt="" />
javascript学习（一） 异常处理与简单的事件的更多相关文章
- javascript 学习之自定义滚动条加滚轮事件
要自己写一个自定义滚动条加上滚轮事件,之前的没有滚轮事件不完整,今天整理了一个. 1.滚轮事件是不兼容的,firefox中是必需要用事件绑定的添加,用的DOMMouseScroll,当滚动鼠标的时候, ...
- JavaScript学习日志（六）：事件
这篇随笔,深恶痛绝,敲到快结束的时候,凌晨00:19,突然闪退,也不知道是Mac的原因还是chrome的原因,重新打开的时候,以为自动保存有效果,心想没关系,结果他么的只保存了四分之一,WTF?!!! ...
- JAVAscript学习笔记 js句柄监听事件 第四节 （原创） 参考js使用表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- javascript学习笔记（七）：事件详解
HTML事件处理 <!DOCTYPE html> <html> <head lang="en"> <meta chaset="U ...
- web前端学习（四）JavaScript学习笔记部分（5）-- 事件流详解
1.JS事件详解-事件流 1.1.事件流 1.事件流: 描述的是在页面中接受事件的顺序 2.事件冒泡: 由最具体的元素接收,然后逐级上传播至最不具体的节点(文档) 3.事件捕获: 最不具体的节点先接收 ...
- JavaScript学习06 JS事件对象
JavaScript学习06 JS事件对象 事件对象:当事件发生时,浏览器自动建立该对象,并包含该事件的类型.鼠标坐标等. 事件对象的属性:格式:event.属性. 一些说明: event代表事件的状 ...
- Javascript学习-简单测试环境
Javascript学习-简单测试环境 在<JavaScript忍者秘籍>2.4测试条件基础知识中,作者给出了一个精简版的assert和assert组的实现,对于初学者而言,这无疑是一个很 ...
- JavaScript学习之事件原理和实践
1 基本概念 1.1 事件 JavaScript与HTML之间的交互是通过事件实现的. 事件是文档或浏览器窗口中发生的一些特定的交互瞬间,在事件上可以注册处理程序,以便当事件发生时,处理程序中的代码得 ...
- JavaScript学习（2）：对象、集合以及错误处理
在这篇文章里,我们讨论一下JavaScript中的对象.数组以及错误处理. 1. 对象 对象是JavaScript中的一种基本类型,它内部包含一些属性,我们可以对这些属性进行增删操作. 1.1 属性 ...
随机推荐
- LaTeX 有哪些「新手须知」的内容?
孟晨 ,在 LaTeX 话题下写错 LaTeX 名字的,一律… 陈硕等 137 人赞同 这是个好问题,虽然提问提得很大.不是很好答,权当抛砖引玉了. 天字第一号原则:不要到网上抄代码,尤其是似懂非懂的 ...
- 字典：NSDictionary的应用举例
字典就是关键字及其定义(描述)的集合.Cocoa中的实现字典的集合NSDictionary在给定的关键字(通常是一个NSString)下存储一个数值(可以是任何类型的对象).然后你就可以用这个关键字来 ...
- nyist 47 过河问题
http://acm.nyist.net/JudgeOnline/problem.php?pid=47 过河问题 时间限制:1000 ms | 内存限制:65535 KB 难度:5 描述 在漆 ...
- [转]Java多线程干货系列—（一）Java多线程基础
Java多线程干货系列—(一)Java多线程基础 字数7618 阅读1875 评论21 喜欢86 前言 多线程并发编程是Java编程中重要的一块内容,也是面试重点覆盖区域,所以学好多线程并发编程对我们 ...
- [转]怎样解决Myeclipse内存溢出？
在用myeclipes10 开发 遇到了 内存溢出问题,百度了很久,这篇比较完善. 总结起来三个方面去检查 1)myeclipes的配置:myeclipes 10 的安装路径下 的myeclipse. ...
- NVL 和NVL2函数
NVL 和NVL2函数 NVL函数: nvl(exp1,exp2) -->判断exp1是否是null,如果exp1不是则返回exp1的值,如果exp1为null则返回exp2 nvl2函数: n ...
- haskell笔记1
haskell platform下载:https://www.haskell.org/platform/ 进入haskell控制台,终端输入 $ ghci 编译文件 :l file.hs 数组操作 & ...
- 夺命雷公狗---node.js---15之加密
node其实也给我们留下了密码的加密发送,不过一般都是用cmd5加密其实也是够了,但是sha1加密也要提下: /** * Created by leigood on 2016/8/31. */ var ...
- 夺命雷公狗---DEDECMS----7dedecms目录结构
我们dedecms的目录结构其实只需要一张图即可明了了,如下图所示:
- 【兄弟连ThinkPHP】1、介绍和安装
琢磨了好几天的ThinkPHP了,兄弟连的视频真心不错,下面是记得一些要点,只做备忘,有兴趣的朋友请去百度兄弟连. ## ThinkPHP 3 介绍及安装#讲师:赵桐正微博:http://weibo. ...