JQUERY中事件绑定方式

  • 一、JavaScript中事件绑定方式:
  • 1.嵌入式绑定:
  • 2.基于DOM对象绑定方式:
  • 二、jquery中事件绑定方式:
  • 1. $obj.jquery监听事件函数(处理函数)
  • 2.$obj.bind(“jquery监听事件函数名”,处理函数):以这种方式绑定监听事件，可以解除的
  • 一、show() 和hide():
  • 二、remove() 和empty():
  • 三、append() 和 appendTo()
  • 1、共同点：都是操作标签中innerHTML，为当前标签添加子标签
  • 2、append()：父标签.append(子标签):
  • 四、属性操作函数
  • 1、val函数：
  • 2、prop函数：工作状态属性 checked,disabled,selected
  • 3、attr函数：基本属性 id name title rowspan
  • 4、text函数：操作属性innerText，双目标签的文本显示内容 123


一、JavaScript中事件绑定方式:

1.嵌入式绑定: 

在这里插入代码片

缺点：一次只能为一个标签绑定监听事件

2.基于DOM对象绑定方式:

var array = docuemnt.getElementsByName(“ck”);
for(var i=0;i<array.length;i++){
var domObj = array[i];
domObj.onclick = fun1;
}

缺点：需要开发人员自行遍历数组，来绑定监听事件

二、jquery中事件绑定方式:

1. $obj.jquery监听事件函数(处理函数)

[例子]:

$(“:button”).click(fun1);
为页面中所有的btton绑定onclick以及对应处理函数fun1

[jquery监听事件函数]:
html监听事件名称 jquery监听事件函数

onclick $obj.click(fun1);

onchange $obj.change(fun1);

onmouseover $obj.mouseover(fun1);

*******jquery监听事件函数名字就是【jquery监听事件函数】去掉[on]

2.$obj.bind(“jquery监听事件函数名”,处理函数):以这种方式绑定监听事件，可以解除的

$obj.unbind(“jquery监听事件函数名”):将指定监听事件从DOM对象身上移除。

$obj.unbind(): 将所有监听事件从DOM对象身上移除。


JQuery对象中的功能函数

  • 一、JavaScript中事件绑定方式:
  • 1.嵌入式绑定:
  • 2.基于DOM对象绑定方式:
  • 二、jquery中事件绑定方式:
  • 1. $obj.jquery监听事件函数(处理函数)
  • 2.$obj.bind(“jquery监听事件函数名”,处理函数):以这种方式绑定监听事件，可以解除的
  • 一、show() 和hide():
  • 二、remove() 和empty():
  • 三、append() 和 appendTo()
  • 1、共同点：都是操作标签中innerHTML，为当前标签添加子标签
  • 2、append()：父标签.append(子标签):
  • 四、属性操作函数
  • 1、val函数：
  • 2、prop函数：工作状态属性 checked,disabled,selected
  • 3、attr函数：基本属性 id name title rowspan
  • 4、text函数：操作属性innerText，双目标签的文本显示内容 123


一、show() 和hide():

show()：负责让jquery对象包含所有DOM对象关联的标签在浏览上显示 style=”disply:block”

hide():负责让jquery对象包含所有DOM对象关联的标签在浏览上隐藏 style=”display:none”

二、remove() 和empty():

empty：将当前标签子标签进行清除处理

remove：将当前标签进行清除处理

三、append() 和 appendTo()

1、共同点：都是操作标签中innerHTML，为当前标签添加子标签

2、append()：父标签.append(子标签):

appendTo()：子标签.append(父标签)

四、属性操作函数

1、val函数：

1）、$obj.val() :读取jquery对象中第一个DOM对象的【value属性值】

2）、$obj.val(值)：为jquery对象中所有DOM对象的value的[value属性]进行统一赋值

2、prop函数：工作状态属性 checked,disabled,selected

1）、$obk.prop(“checked”,true)：为jquery对象中所有DOM对象的checked属性赋值为true

2）、$obj.prop(“checked”)：读取jquery对象中第一个DOM对象的【checked属性值】

3、attr函数：基本属性 id name title rowspan

1）、$obj.attr(“name”,”ck”)：为jquery对象中所有DOM对象的【name属性】赋值为【ck】

2）、$obj.attr(“title”)：读取jquery对象中第一个DOM对象的【title属性值】

4、text函数：操作属性innerText，双目标签的文本显示内容 123

1）、$obj.text(“123″)：为jquery对象中所有DOM对象的innerText赋值为”123”

2）、$obj.text() ; 读取jquery对象中所有DOM对象的innerText属性内容，拼接为一个字符串返回。