1.普通的定义方式

<input type="button" name="Button" value="确定" 
onclick="Sfont=prompt('请在文本框中输入红色','红色',' 提示框 ');
if(Sfont=='红色'){
　　　　form1.style.fontFamily='黑体';
　　　　form1.style.color='red';
}"
/>

这是最常见的一种定义方式，直接将JS事件定义在需要的对象之上。相关的变形就是调用方法的形式，如下

<script>

    function show()

        {

            alert("show");

        }

</script>

<input type="button" name="show"  onclick="show()"/>

第二种

<script type="text/javascript" for="window" event="onload">

    alert("Welcome!");

</script>

<script type="text/javascript" for="window" event="onunload">

    alert("Thanks!");

</script>

这里定义了加载窗口和卸载窗口时的发生的操作。
如果是针对其他对象的事件，只需要修改for属性的值为对象名，event修改为监视的的事件。如下：

<script type="text/javascript" for="test" event="onclick">

alert("button!");

</script>

第三种：

<input type="button" name="test" value="test"/>

<script>

function te()

{

    alert("test");

}

test.onclick=te;

</script>

这里我们使用注册的形式，将方法注册到指定对象的指定事件。使用对象名来调用。
完整测试代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

</head>

<body>

<script type="text/javascript" for="window" event="onload">

alert("Welcome!");

</script>

<script type="text/javascript" for="window" event="onunload">

alert("Thanks!");

</script>

<form name="form1" method="post" action="">

JS很好学

</form>

<formn ame="form2" method="post" action="">

<input type="button" name="Button" value="确定" onclick="Sfont=prompt('请在文本框中输入红色','红色',' 提示框 ');if(Sfont=='红色'){form1.style.fontFamily='黑体';form1.style.color='red';}"/>

<input type="button" name="test" value="test"/>

<script>

function te()

{

alert("test");

}

test.onclick=te;

</script>

</form>

</body>

</html>

记录下来，巩固知识，同时方便他人。

可以联系我进行交流，renhanlinbsl@163.com.

2016.5.11

13:52

JS创建事件的三种方式（实例）的更多相关文章

  1. Java并发编程：Java创建线程的三种方式

    目录 引言 创建线程的三种方式 一.继承Thread类 二.实现Runnable接口 三.使用Callable和Future创建线程 三种方式的对比 引言 在日常开发工作中,多线程开发可以说是必备技能 ...

  2. js学习-DOM之动态创建元素的三种方式、插入元素、onkeydown与onkeyup两个事件整理

    动态创建元素的三种方式: 第一种: Document.write(); <body> <input type="button" id="btn" ...

  3. js声明变量的三种方式

    JS 声明变量的三种方式 (1)使用变量步骤:a.声明-->b.赋值-->3.调用 正确用法: <script type="text/javascript"> ...

  4. 0036 Java学习笔记-多线程-创建线程的三种方式

    创建线程 创建线程的三种方式: 继承java.lang.Thread 实现java.lang.Runnable接口 实现java.util.concurrent.Callable接口 所有的线程对象都 ...

  5. 前端js,css文件合并三种方式,bat命令

    前端js,css文件合并三种方式,bat命令 前端js文件该如何合并三个方式如下:1. 一个大文件,所有js合并成一个大文件,所有页面都引用它.2. 各个页面大文件,各自页面合并生成自己所需js的大文 ...

  6. spring创建bean的三种方式

    spring创建bean的三种方式: 1通过构造方法创建bean(最常用) 1.1 spring默认会通过无参构造方法来创建bean,如果xml文件是这样配置,则实体类中必须要有无参构造方法,无参构造 ...

  7. java创建线程的三种方式及其对比

    第一种方法:继承Thread类,重写run()方法,run()方法代表线程要执行的任务.第二种方法:实现Runnable接口,重写run()方法,run()方法代表线程要执行的任务.第三种方法:实现c ...

  8. AJPFX总结java创建线程的三种方式及其对比

    Java中创建线程主要有三种方式: 一.继承Thread类创建线程类 (1)定义Thread类的子类,并重写该类的run方法,该run方法的方法体就代表了线程要完成的任务.因此把run()方法称为执行 ...

  9. java创建线程的三种方式及其对照

    Java中创建线程主要有三种方式: 一.继承Thread类创建线程类 (1)定义Thread类的子类.并重写该类的run方法,该run方法的方法体就代表了线程要完毕的任务.因此把run()方法称为运行 ...

随机推荐

  1. [NOIP2018]保卫王国

    嘟嘟嘟 由于一些知道的人所知道的,不知道的人所不知道的原因,我来发NOIP2018day2T3的题解了. (好像我只是个搬运工--) 这题真可以叫做NOIplus了,跟其他几道比较水的题果然不一样,无 ...

  2. WIN10+ VS2013 配置Opencv2413 64位

    VS2013 配置Opencv2413  64位 系统变量 Path:  F:\2biancheng_tool\Opencv2413\opencv\build\x64\vc12\bin 用户变量:添加 ...

  3. mvc:message-converters简单介绍

    说说@ResponseBody注解,很明显这个注解就是将方法的返回值作为reponse的body部分.我们进一步分析下这个过程涉及到的内容,首先就是方法返回的类型,可以是字节数组.字符串.对象引用等, ...

  4. layui前端框架之分页

    框架环境:SSM框架 为了保证效果,此次演示也用到了jQuery ui框架,大家最好也引入进来 一.去layui官网下载包,解压后,然后导入文件中,最好放再main/webapp文件夹下 官网地址如下 ...

  5. linux如何查看端口被哪个进程占用

    1.lsof -i:端口号 2.netstat -tunlp|grep 端口号 都可以查看指定端口被哪个进程占用的情况 工具/原料   linux,windows xshell 方法/步骤     [ ...

  6. 【Topcoder 10107】TeamManagement

    Topcoder 10107 题意:给定一棵树,其中有些点是忠诚的,现在要选k个点,每个选择的联通块都必须包含一个忠诚的点,求包含某个点的概率. 思路:考虑树型\(dp\),\(dp(i,j,0/1, ...

  7. 查看电脑本机的ip地址

    第一步:打开cmd 第二步:输入:ipconfig,回车 第三步:找到无线局域网适配器下的IPv4地址,那就是本机的ip地址

  8. Socket异步通信及心跳包同时响应逻辑分析（最后附Demo）。

    有段时间没有更博了,刚好最近在做Socket通信的项目,原理大致内容:[二维码-(加logo)]-->提供主机地址和端口号信息(直接使用[ThoughtWorks.QRCode.dll]比较简单 ...

  9. 基于HTML5 Canvas 实现地铁站监控

    伴随国内经济的高速发展,人们对安全的要求越来越高.为了防止下列情况的发生,您需要考虑安装安防系统: 提供证据与线索:很多工厂银行发生偷盗或者事故相关机关可以根据录像信息侦破案件,这个是非常重要的一个线 ...

  10. .NETCore_初探

    1. Core默认的服务注册 Statup文件(rogram类型中创建 WebHost时使用的)中有俩个方法: Configure和ConfigureServices(将服务放置到容器里面) publ ...