什么是JavaScript事件流及事件处理程序详解
发布时间:2025-05-25 09:24:28 发布人:远客网络
一、什么是JavaScript事件流及事件处理程序详解
1、先提两个关键词,方便你查找更详细的分析:1)事件冒泡 2)事件捕获
2、如图:有三个圆,好比dom中的三个div,当你点击了绿色圆的同时,会有两个连带事件:
3、那么当你这三个圆(div)都绑定了点击事件时,该怎么触发呢,同时触发?显然不是,这是就涉及到一开始给你的两个关键词了。
4、事件捕获:js会顺着文档流顺序由外往内,依次触发事件。即从DOM树的根到叶子,粉->蓝->绿
5、事件冒泡:js会逆着文档流顺序由内至外,一次触发事件。即从DOM树的叶子到根,绿->蓝->粉
6、补充一点:多数时候推荐事件冒泡,因为大多数主流浏览器都兼容两种事件,但一开始ie是不支持事件捕获的,后来ie是否支持最近没有具体了解,应该是可以设置,有需要可以百度一下,本人小菜,以上回答如有错误还请指出,谢谢。
二、JavaScript定时器详解
1、在javascritp中有两个关于定时器的专用函数它们是
2、倒计定时器 timename=setTimeout("function();" delaytime);
3、循环定时器 timename=setInterval("function();" delaytime);
4、 function()是定时器触发时要执行的是事件的函数可以是一个函数也可以是几个函数或者javascript的语句也可以单要用;隔开 delaytime则是间隔的时间以毫秒为单位
5、倒计时定时器就是在指定时间后触发事件而循环定时器就是在间隔时间到来时反复触发事件其区别在于前者只是作用一次而后者则不停地作用
6、倒计时定时器一般用于页面上只需要触发一次的的情况比如点击某按钮后页面在一定时间后跳转到相应的站点也可以用于判断一个浏览者是不是你的站点上的“老客”如果不是你就可以在秒或者秒后跳转到相应的站点然后告诉他以后再来可以在某个地方按某一个按钮就可以快速进入
7、循环定时器一般用于站点上需要从复执行的效果比如一个javascript的滚动条或者状态栏也可以用于将页面的背景用飞雪的图片来表示这些事件需要隔一段时间运行一次
8、有时候我们也想去掉一些加上的定时器此时可以用clearTimeout(timename)来关闭倒计时定时器而用clearInterval(timename)来关闭循环定时器
9、例<SCRIPT LANGUAGE="JavaScript"> setTimeout("confirm()");</SCRIPT>
10、<script language="JavaScript" type=text/javascript>
11、 function count(){ setTimeout("alert(三秒到了)")}
12、<INPUT TYPE="button" VALUE="计时开始" onClick="count()">
13、例<Script><script language="JavaScript" type=text/javascript>
14、 var sec=; timerID= setInterval("count()");
15、 function count(){ num innerHTML= sec++;}
16、停留时间<FONT ID="num" FACE="impact"></FONT>秒钟<INPUT TYPE="button" VALUE="停止" onClick="clearInterval(timerID)">
17、例<script language="JavaScript" type=text/javascript>
18、 var str="这是一个在线拍卖的网站请尽情血拼吧!"; var seq=;
19、 function scroll(){ msg= str substring( seq+); banner innerHTML= msg; seq++; if(seq>= str length) seq=;}
三、JavaScript动态网页技术详解图书目录
1、《JavaScript动态网页技术详解》图书目录如下:
2、第一部分概述第1章 JavaScript编程起步:开始JavaScript之旅,介绍JavaScript的基本概念和历史背景。第2章 HTML语言:学习JavaScript的基础,讲解HTML的基本结构和标签,为后续的JavaScript学习打下基础。第3章开发环境:介绍如何搭建和开发JavaScript相关的开发环境,包括编辑器、浏览器等工具的选择和使用。
3、第二部分 JavaScript核心内容第4章语言结构:讲解JavaScript的基本语法和程序结构,如变量、运算符、条件语句、循环语句等。第5章数据类型:详细介绍JavaScript中的各种数据类型,包括基本数据类型和引用数据类型。第6章字符串:深入讲解JavaScript中的字符串操作,包括字符串的创建、拼接、搜索、替换等操作。第7章函数:介绍JavaScript中的函数定义、调用、参数传递等,以及与对象的关系。第8章对象:讲解JavaScript的面向对象特性,包括对象的创建、属性、方法等。第9章正则表达式:介绍正则表达式的语法和用法,以及如何在JavaScript中使用正则表达式进行字符串匹配、替换等操作。第10章事件处理:讲解JavaScript中的事件处理机制,包括事件的类型、绑定、触发等。第11章级联样式表:介绍CSS的基本概念和用法,以及如何在JavaScript中操作CSS样式。第12章数据存储:讲解JavaScript中的数据存储方式,包括Cookie、LocalStorage、SessionStorage等。
4、第三部分 JavaScript的高级进阶功能第13章 XML:介绍可扩展标记语言XML的基本概念和用法,以及如何在JavaScript中解析和处理XML数据。第14章 AJAX简介:讲解异步JavaScript和XML技术,以及如何使用AJAX实现网页的异步请求和动态更新。第15章常见框架的介绍:介绍一些流行的JavaScript框架,如jQuery、React、Vue等,以及它们的基本用法和优势。第16章脚本编程的相关技术:讲解与JavaScript相关的其他技术,如JSON、模板引擎等。第17章 JavaScript的常用技巧:分享一些JavaScript编程中的常用技巧和最佳实践。第18章 JavaScript的网络安全性:介绍JavaScript在网络安全方面的注意事项和常见漏洞的防范措施。
5、第四部分 JavaScript应用实例第19章 JavaScript的常用特效:通过实例展示JavaScript在网页特效方面的应用,如表单验证、动画效果等。第20章服务器端编程:介绍JavaScript在服务器端编程中的应用,如Node.js的使用和常见的服务器端操作。第21章综合案例—网上购物系统:通过一个完整的网上购物系统案例,展示JavaScript在实际项目中的应用和开发流程。