技术标签： 南大软院大神养成计划
今天是南大软院大神养成计划实施的第十天。今天主要学习了“DOM事件探秘”。
首先说说第一章“事件流”，那什么是事件流呢？事件流就是描述描述从页面中接受事件的顺序，在浏览器中，IE和Netscape提出了相反的慨念，IE提出的是事件冒泡流，就是我们现在常用的事件流，Netscape提出的事件捕获流。首先说说事件冒泡流，事件冒泡流就是即事件最开始由最具体的无素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播到最不具体的那个节点（文档） input----->document，比如我在input里设置一个按钮关联一个事件，那么它就会从input开始逐级向上传播，比如像div传播。而事件捕获流呢？就是相反地了，它的思想是不太具体的节点应该更早接收到元素，而最具体的节点最后接收到事件。比如从html往下面开始传播，然后最后传播到input中，很多人并不知道有时间捕获流。
接下来是第二章“事件处理程序”，事件处理程序大致分为“HTML事件处理程序”，“DOM0级事件处理程序”，“DOM2级事件处理程序”。先说说“HTML事件处理程序”。HMTL事件处理程序就是直接把JavaScript代码嵌入到HTML代码中，这个方法的最大缺点就是HTML和js代码高耦合，如果修改，就要修改两个地方：HTML元素内和script函数，增加程序员工作量。“DOM0级事件处理程“就是先 把元素取出来，然后为其属性添加一个事件，它是一种较传统的方式：把一个函数赋值给一个事件处理程序的属性，优点：简单，跨浏览器的优势。比如：var btn2=document.getElementById("btn2");---先获取出元素，定义对象 //取得btn2按钮对象
btn2.οnclick=function(){alert('这是通过DOM0级添加的事件！')}----让 事件以对象的属性 的形式出现。 //给btn2添加onclick属性
这样程序员假如想改动JavaScript部分只需要改动一个地方就行，不需要改动html部分，减少了耦合性。
下面说说DOM2级事件处理程序。DOM2和DOM0级共同优点：可以给一个元素上添加多个事件处理程序，会按照顺序执行。<br><br>
DOM2级事件处理程序，ie不支持，ie有专用的事件处理程序。<br><br>
DOM2级事件处理程序：定义了两个方法---用于处理指定和删除事件处理程序的操作。【addEventListener()---给某元素添加一个事件监听程序】和【removeEventListener()---删除一个事件。必须传入添加事件时相同的参数】（通过前者添加的事件，只能通过后者删除。如obj.click= null无效）<br><br>
接收三个参数：要处理的事件名，作为事件处理程序的函数和布尔值。<br>
布尔值 false 事件冒泡 true 事件捕获，一般用false最大兼容浏览器。
在事件被触发的函数里面this可以引用被触发的元素。例如：btn.addEventListener('click',function(){alert(this.value),false});this即指btn
接下来讲讲IE事件程序及跨浏览器解决。如何解决这个问题呢？代码如下：
var eventUtil={
// 添加句柄
type==触发的元素事件,此处的时间名最好没有on前缀; handler==触发事件时调用函数
addHandler:function(element,type,handler){
if(element.addEventListener){ //能力检测
element.addEventListener(type,handler,false);
}else if(element.attachEvent){
element.attachEvent('on'+type,handler); //IE中attachEvent()事件名都要有on前缀
}else{
element['on'+type]=handler; //element.οnclick==element[‘onclick’]
}
},
}
非IE addEventListener removeEventListener (追加事件不需要on)
IE(opera) attachEvent detachEvent(追加事件需要on)，attachEvent只有两个参数
今天学习就这么多，期待明天的是学习
文章浏览阅读3.5w次，点赞64次，收藏604次。测试开发笔记第一章 测试基础 7什么是软件测试： 7★软件测试的目的、意义：（怎么做好软件测试） 73.软件生命周期： 7第二章 测试过程 81.测试模型 8H模型： 8V模型 92.内部测试 103外部测试： 10验收测试：（在系统测试之后） 11回归测试： 114.测试过程（干什么，怎么干） 125.各阶段输入、输出标准以及入口、出口准则:（测试阶段过程要素） 1..._输入条件money是大于0的小数,则上点是0
文章浏览阅读1.9k次。废话不说，直接上代码# TensorFlow and tf.kerasimport tensorflow as tffrom tensorflow import keras# Helper librariesimport numpy as npimport matplotlib.pyplot as pltimport os#download the datamnist =..._cnn model.save
文章浏览阅读4.7k次。本题要求编写程序，根据公式Cnm=m!(n−m)!n!算出从n个不同元素中取出m个元素（m≤n）的组合数。建议定义和调用函数fact(n)计算n!，其中n的类型是int，函数类型是double。输入格式:输入在一行中给出两个正整数m和n（m≤n），以空格分隔。输出格式:按照格式“result = 组合数计算结果”输出。题目保证结果在double类型范围内。输入样例:2 7输出样..._练习2-18 求组合数 (15 分)
文章浏览阅读681次。给你一个字符串 s ，请你去除字符串中重复的字母，使得每个字母只出现一次。需保证 返回结果的字典序最小(即要求保持原有顺序基础上，每个位置字符排序最小)（要求不能打乱其他字符的相对位置）。注意：该题与 1081 https://leetcode-cn.com/problems/smallest-subsequence-of-distinct-characters 相同示例 1：输入：s = "bcabc"输出："abc"示例 2：输入：s = "cbacdcbc"输出："acdb"提示：_给定一个字符串s,现在想让你删除掉一些字符
文章浏览阅读806次。首先是头文件handler.h#include <stdio.h>#include <pthread.h>struct list_head { struct list_head *prev, *next;};#define list_entry(ptr, type, member) \ ((type *)((uintptr_t)(ptr) - (uin..._c语言有没类似handler方法
文章浏览阅读45次。L1-033 出生年 (15分)题目以上是新浪微博中一奇葩贴：“我出生于1988年，直到25岁才遇到4个数字都不相同的年份。”也就是说，直到2013年才达到“4个数字都不相同”的要求。本题请你根据要求，自动填充“我出生于y年，直到x岁才遇到n个数字都不相同的年份”这句话。输入格式：输入在一行中给出出生年份y和目标年份中不同数字的个数n，其中y在[1, 3000]之间，n可以是2、或3、或4。注意不足4位的年份要在前面补零，例如公元1年被认为是0001年，有2个不同的数字0和1。输出格式：根据输
文章浏览阅读1k次。Ubuntu Texlive TeXstudio Tikz 安装与环境配置https://blog.csdn.net/williamyi96/article/details/90732304_texstudio tikzp
文章浏览阅读6.5k次，点赞6次，收藏28次。举例求下面矩阵的四连通域(3)[1100010100011000001000001] \left[ \begin{matrix} 1 & 1 & 0 & 0 & 0 \\ 1 & 0 & 1 & 0 & 0 \\ 0 & 1 &a..._01矩阵求连通域
文章浏览阅读2k次。service 的 clusterIP，这个所谓的 虚地址， 其实是若干条iptables规则：&lt;pre&gt;-A KUBE-SERVICES -d 10.11.97.177/32 -p tcp -m comment --comment &amp;amp;amp;amp;quot;default/my-nginx: cluster IP&am..._kubernets curl svc cluster-ip
文章浏览阅读851次，点赞18次，收藏16次。1 简介今天学长向大家介绍一个机器视觉的毕设项目，基于深度学习的人体目标检测算法研究与实现毕业设计 深度学习行人目标检测系统。
文章浏览阅读260次。简单语法注释#命令格式COMMAND(参数1 参数2 ...)分隔符A;B;C D #用分号或者空格分割变量set(VAR a b c) 设置变量VAR command(${VAR}) 引用变量VAR的值，等价于command(a b c) command("${VAR}") 等价于 command("a b c") command("/..._cmake if not
文章浏览阅读3.2k次，点赞6次，收藏41次。QGC下载下载地址：https://github.com/mavlink/qgroundcontrol/releases进入网站后找到自己需要的版本，我自己使用的为3.5.2和4.1.2后缀.exe为window的安装包，这里我们下载后缀.Applmage和.tar.bz2。安装QGC下载完成后解压tar.bz2 tar -xjf QGroundControl.tar.bz2安装相关依赖sudo apt-get install espeak libespeak-dev libudev-d_ubuntu18.04 安装qgc