一.概述:

事件是可以被JavaScript侦测到的行为。网页中的每个元素都可以产生某些可以触发JavaScript函数的事件。相当于让标签在满足某种条件的时候,调用指定的方法.

二.常用事件

1:onload事件:表示页面上的其他元素全部加载完成之后,再执行指定的方法;

格式: 
     1)直接定义一个带名称的方法,在body标签中,使用onload=”方法名()”;
     2)写在js文件中:
     window.onload=function(){
         Js代码
     }
     注意事项:
     一个页面中只能使用一次onload事件;
     Js中没有方法重载的概念,只要方法名相同,就会覆盖;

2.onclick事件:表示鼠标点击的时候,会触发指定的函数;(调用指定的方法);
     1)在标签的开始标签中,直接写onclick=”方法名()”
     2)定在js文件中:
         标签对象.onclick = function(){
             Js代码
         }

3:onfocus事件:表示输入框获取焦点的时候;执行的事件;

4:onblur事件:表示输入框失去焦点的时候;执行的事件;

5.鼠标移入与移出事件:
     onmouseover:鼠标移入;
     onmouseOut:鼠标移出;

6.onchange 事件常用于输入字段的验证,内容改变时触发;

7.getElementsByTagName()方法,得到数组对象.参数为"标签名",如tr/input

getElementByTagName("tr"):获取所有tr标签对象;

8.getElementsByClassName根据class属性值,获取对应的标签对象组成的数组;

9.document.createElement/document.createTextNode/appendChild

例子:

<script>

//创建新的 <p> 元素:

var para=document.createElement("p");

//向 <p> 元素添加文本,您必须首先创建文本节点。这段代码创建了一个文本节点:

var node=document.createTextNode("这是新段落。");

//向 <p> 元素追加这个文本节点

para.appendChild(node);

</script>

JavaScript笔记5-事件的更多相关文章

  1. JavaScript笔记04——事件与回调

    1.在浏览器中,大多数代码都是由事件驱动的(event-driven). 这和生物中的神经反射有点类似. 比如说,谷歌页面上的一个按钮, 当我们“按下”这个按钮的时候,将跳出如下界面. 那么你有没想过 ...

  2. javascript - 工作笔记 (事件四)

    在javascript - 工作笔记 (事件绑定二)篇中,我将事件的方法做了简单的包装,  JavaScript Code  12345   yx.bind(item, "click&quo ...

  3. [Effective JavaScript 笔记]第3章:使用函数--个人总结

    前言 这一章把平时会用到,但不会深究的知识点,分开细化地讲解了.里面很多内容在高3等基础内容里,也有很多讲到.但由于本身书籍的篇幅较大,很容易忽视对应的小知识点.这章里的许多小提示都很有帮助,特别是在 ...

  4. jQuery:自学笔记(4)——事件与事件对象

    jQuery:自学笔记(4)——事件与事件对象 jQuery中的事件 什么是事件 所谓事件,就是被对象识别的操作,即操作对象队环境变化的感知和反应,例如单击按钮或者敲击键盘上的按键. 所谓事件流,是指 ...

  5. vue学习笔记(四)事件处理器

    前言 在上一章vue学习笔记(三)class和style绑定的内容中,我们学习了如何在vue中绑定class和style,介绍了常用的绑定方法,class的数组绑定和对象绑定以及style的数组绑定和 ...

  6. javascript event(事件对象)详解

    javascript event(事件对象)详解   1. 事件对象     1. 事件对象 Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 什 ...

  7. javascript 中的事件机制

    1.javascript中的事件. 事件流 javascript中的事件是以一种流的形式存在的. 一个事件会也有多个元素同时响应. 有时候这不是我们想要的效果, 我们只是需要某个特定的元素相应我们的绑 ...

  8. JavaScript中的事件对象

    JavaScript中的事件对象 JavaScript中的事件对象是非常重要的,恐怕是我们在项目中使用的最多的了.在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含这所有与事件有 ...

  9. JavaScript 进阶教程一 JavaScript 中的事件流 - 事件冒泡和事件捕获

    先看下面的示例代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Jav ...

  10. [Effective JavaScript 笔记] 第4条:原始类型优于封闭对象

    js有5种原始值类型:布尔值.数字.字符串.null和undefined. 用typeof检测一下: typeof true; //"boolean" typeof 2; //&q ...

随机推荐

  1. jdbc代码

    1.jdbcutiul的代码, package gz.itcast.util; import java.io.InputStream; import java.sql.Connection; impo ...

  2. DTP模型之一:(XA协议之三)MySQL数据库分布式事务XA优缺点与改进方案

    1 MySQL 外部XA分析 1.1 作用分析 MySQL数据库外部XA可以用在分布式数据库代理层,实现对MySQL数据库的分布式事务支持,例如开源的代理工具:ameoba[4],网易的DDB,淘宝的 ...

  3. jvm学习五: 方法执行过程

    方法执行过程:Java各个大版本更新提供的新特性(需要简单了解)

  4. 整理出来的一个windows关机、锁定、重启、注销 API调用

    using System.Runtime.InteropServices; namespace HookDemo { class WindowsExit { [StructLayout(LayoutK ...

  5. php中替换中文引号不成功的原因

    中文引号替换成英文引号,突然发现总是不成功. 后来查找资料得知,需要写成这种风格的. 正确代码如下:   中文单引号: str_replace('‘',''',$str);str_replace('’ ...

  6. Uncommon Words from Two Sentences

    https://leetcode.com/problems/uncommon-words-from-two-sentences We are given two sentences A and B.  ...

  7. WCF大文件传输【转】

    http://www.cnblogs.com/happygx/archive/2013/10/29/3393973.html WCF大文件传输 WCF传输文件的时候可以设置每次文件的传输大小,如果是小 ...

  8. FZU - 2109 Mountain Number 数位dp

    Mountain Number One integer number x is called "Mountain Number" if: (1) x>0 and x is a ...

  9. yzm10与战地信使 yzm10原创系列

    yzm10与战地信使 M国与R国正进行着激烈的鏖战,此时的yzm10从R国窃取了最高军事机密,这份情报将是此次战役的转折点,如果M国得到了这份情报,就能够取得这次战争的胜利.yzm10当然是站在M国这 ...

  10. jquery获取元素对应高度

    https://www.cnblogs.com/sntetwt/p/3823592.html 获取点击元素距离页面的高度 $(select).offset().top - $(document).sc ...