,,javascript中为某个元素指定事件的三种方式

,,javascript中为某个元素指定事件的三种方式

在javascript中,可以通过以下三种方式为元素指定事件:使用onclick属性和addEvenListener()方法。

在javascript中,可以通过以下三种方式为元素指定事件:

1.在html中,使用onclick属性。

2.在javascript中,使用onclick属性。

3.在javascipt中,使用addEvenListener()方法。

三种方法的比较

(1)在第二个和第三个方法中,可以将一个事件对象传入函数,并读取其对应的属性,但第一个方法不是。

(2)首选第二、三种方法。第一种不利于将内容从事件中分离出来,也不能使用事件对象的相关内容。

一些语法细节

(1)在第一种方法中,onclick是不区分大小写的,但是在第二种方法中,必须使用小写。因为HMTL不区分大小写,所以JS区分大小写。

(2)第二种和第三种方法中,函数名的指定没有双引号,而第一种方法作为HTML属性,需要双引号。

(3)第一种方法需要括号,第二种和第三种方法不需要。

onclick='clickHandler()'

document . getelementbyid(' jsOnClick ')。onclick=clickHandler2

document . getelementbyid(' addevent listener ')。addEventListener('click ',click handler 2);

完整的代码如下:

!文档类型html

超文本标记语言

meta charset='UTF-8 '

title偶数Deom/title

/头

身体

button id=' html onclick ' onclick=' click handler()' html onclick/button

button id=' jsOnClick ' jsOnClick/button

button id=' addevent listener ' addevent listener/button

脚本延期

函数clickHandler() {

alert(html中的“onclick属性”);

}

功能点击手柄2(e) {

alert(e . target . innerhtml);

}

document . getelementbyid(' jsOnClick ')。onclick=clickHandler2

document . getelementbyid(' addevent listener ')。addEventListener('click ',

click handler 2);

/脚本

/body

/html

在javascript中,可以通过以下三种方式为元素指定事件:

1.在html中,使用onclick属性。

2.在javascript中,使用onclick属性。

(1)注意函数名没有双引号。

3.在javascipt中,使用addEvenListener()方法。

三种方法的比较

(1)在第二个和第三个方法中,可以将一个事件对象传入函数,并读取其对应的属性,但第一个方法不是。

一些语法细节

(1)在第一种方法中,onclick是不区分大小写的,但是在第二种方法中,必须使用小写。因为HMTL不区分大小写,所以JS区分大小写。

(2)第二种和第三种方法中,函数名的指定没有双引号,而第一种方法作为HTML属性,需要双引号。

(3)第一种方法需要括号,第二种和第三种方法不需要。

onclick='clickHandler()'

document . getelementbyid(' jsOnClick ')。onclick=clickHandler2

document . getelementbyid(' addevent listener ')。addEventListener('click ',click handler 2);

完整的代码如下:

!文档类型html

超文本标记语言

meta charset='UTF-8 '

title偶数Deom/title

/头

身体

button id=' html onclick ' onclick=' click handler()' html onclick/button

button id=' jsOnClick ' jsOnClick/button

button id=' addevent listener ' addevent listener/button

脚本延期

函数clickHandler() {

alert(html中的“onclick属性”);

}

功能点击手柄2(e) {

alert(e . target . innerhtml);

}

document . getelementbyid(' jsOnClick ')。onclick=clickHandler2

document . getelementbyid(' addevent listener ')。addEventListener('click ',

click handler 2);

/脚本

/body

/html

郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。

留言与评论(共有 条评论)
   
验证码: