一:异常处理

  

  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. <title></title>
  4. </head>
  5. <body>
  6. <form>
  7. <input id="txt" type="text" />
  8. <input id="btn" type="button" value="提交" onclick="demo2()" />
  9. </form>
  10. <script type="text/javascript">
  11. //系统错误
  12. function demo() {
  13. try {
  14. alert(str);
  15. }
  16. catch (err) {
  17. alert(err);
  18. }
  19. }
  20. //自定义错误
  21. function demo2() {
  22. //这里如果不写try ..catch.. throw ("text不能为空"); 是不会弹出来的
  23. try {
  24. var e = document.getElementById("txt").value;
  25. if (e == "") {
  26. throw ("text不能为空");
  27. }
  28. }
  29. catch (err) {
  30. alert(err);
  31. }
  32. }
  33. </script>
  34. </body>
  35. </html>

二:事件处理:

  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. <title></title>
  4. <style type="text/css">
  5. .div
  6. {
  7. width: 100px;
  8. height: 100px;
  9. background-color: blue;
  10. }
  11. </style>
  12. </head>
  13. <body>
  14. <div class="div" onmouseover="onOver(this)" onmouseout="onOut(this)">
  15. </div>
  16. <form>
  17. <input id="txt" type="text" onchange="onChange(this)" />
  18. <input id="txt2" type="text" onselect="onSelect(this)" onfocus="onFocus(this)"/>
  19. </form>
  20. <script type="text/javascript">
  21. function onOver(e) {
  22. e.innerHTML = "Hello";
  23. }
  24. function onOut(e) {
  25. e.innerHTML = "World";
  26. }
  27.  
  28. function onChange(e) {
  29. alert("内容改变为:" + e.value)
  30. }
  31. function onSelect(e) {
  32. e.style.color = "red";
  33. }
  34. function onFocus(e) {
  35. e.style.color = "black";
  36. }
  37. </script>
  38. </body>
  39. </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学习(一) 异常处理与简单的事件的更多相关文章

  1. javascript 学习之自定义滚动条加滚轮事件

    要自己写一个自定义滚动条加上滚轮事件,之前的没有滚轮事件不完整,今天整理了一个. 1.滚轮事件是不兼容的,firefox中是必需要用事件绑定的添加,用的DOMMouseScroll,当滚动鼠标的时候, ...

  2. JavaScript学习日志(六):事件

    这篇随笔,深恶痛绝,敲到快结束的时候,凌晨00:19,突然闪退,也不知道是Mac的原因还是chrome的原因,重新打开的时候,以为自动保存有效果,心想没关系,结果他么的只保存了四分之一,WTF?!!! ...

  3. JAVAscript学习笔记 js句柄监听事件 第四节 (原创) 参考js使用表

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. javascript学习笔记(七):事件详解

    HTML事件处理 <!DOCTYPE html> <html> <head lang="en"> <meta chaset="U ...

  5. web前端学习(四)JavaScript学习笔记部分(5)-- 事件流详解

    1.JS事件详解-事件流 1.1.事件流 1.事件流: 描述的是在页面中接受事件的顺序 2.事件冒泡: 由最具体的元素接收,然后逐级上传播至最不具体的节点(文档) 3.事件捕获: 最不具体的节点先接收 ...

  6. JavaScript学习06 JS事件对象

    JavaScript学习06 JS事件对象 事件对象:当事件发生时,浏览器自动建立该对象,并包含该事件的类型.鼠标坐标等. 事件对象的属性:格式:event.属性. 一些说明: event代表事件的状 ...

  7. Javascript学习-简单测试环境

    Javascript学习-简单测试环境 在<JavaScript忍者秘籍>2.4测试条件基础知识中,作者给出了一个精简版的assert和assert组的实现,对于初学者而言,这无疑是一个很 ...

  8. JavaScript学习之事件原理和实践

    1 基本概念 1.1 事件 JavaScript与HTML之间的交互是通过事件实现的. 事件是文档或浏览器窗口中发生的一些特定的交互瞬间,在事件上可以注册处理程序,以便当事件发生时,处理程序中的代码得 ...

  9. JavaScript学习(2):对象、集合以及错误处理

    在这篇文章里,我们讨论一下JavaScript中的对象.数组以及错误处理. 1. 对象 对象是JavaScript中的一种基本类型,它内部包含一些属性,我们可以对这些属性进行增删操作. 1.1 属性 ...

随机推荐

  1. configs for postgresql restart and postgresql reload

    -- configs requiring postgresql restart select name, setting, context from pg_settings where context ...

  2. SQL 数据库 函数

    1.数学函数:操作一个数据,返回一个结果 --取上限ceiling select code,name,ceiling(price) from car ; --取下限 floor select floo ...

  3. Python学习总结14:时间模块datetime & time & calendar (一)

    Python中的常用于处理时间主要有3个模块datetime模块.time模块和calendar模块. 一.time模块 1. 在Python中表示时间的方式 1)时间戳(timestamp):通常来 ...

  4. C++之路进阶——codevs1204(寻找子串位置)

    1204 寻找子串位置  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 青铜 Bronze     题目描述 Description 给出字符串a和字符串b,保证b是a的一个子 ...

  5. Android -- 自定义View小Demo(一)

    1,现在要实现下图的简单效果,很简单  ,就是使用paint在canvas上绘制5中不同颜色的圆圈,效果图如下: 这是绘制基本图形一种最简单的方法,下面是它的代码 ,注释写的很详细,也就不去讲解了 M ...

  6. 在TextView上加上下划线或中划线

    在做商城项目是需要用到原价格以及降价后的价格,不可避免用到下划线或中划线  textView.getPaint().setFlags(Paint. UNDERLINE_TEXT_FLAG ); //下 ...

  7. spark读取hdfs数据本地性异常

    在分布式计算中,为了提高计算速度,数据本地性是其中重要的一环. 不过有时候它同样也会带来一些问题. 一.问题描述 在分布式计算中,大多数情况下要做到移动计算而非移动数据,所以数据本地性尤其重要,因此我 ...

  8. Android SDK Manager更新报错

    错误log: Fetching https://dl-ssl.google.com/android/repository/addons_list-.xml Fetched Add-ons List s ...

  9. Serializable 序列化

    序列化是指将对象实例的状态存储到存储媒体的过程.在此过程中,先将对象的公共字段和私有字段以及类的名称(包括类所在的程序集)转换为字节流,然后再把字节流写入数据流.在随后对对象进行反序列化时,将创建出与 ...

  10. HTML5与移动端Web

    概述 HTML5 提供了很多新的功能,主要有: 新的 HTML 元素,例如 section, nav, header, footer, article 等 用于绘画的 Canvas 元素 用于多媒体播 ...