jQuery(贰)

1. 事件机制

1.1 事件注册

bind()方法用于向被选元素添加一个或多个事件处理程序

on()方法只能添加一个事件（不好用）

$(".box1").bind({
    mouseover() {
        $(this).css("background-color", "blue");
    },
    mouseout() {
        $(this).css("background-color", "black");
    }
})
$(".box1").on("click",function(){ console.log(‘111‘); });

1.2 事件对象event

event对象有以下常用属性

• type：事件类型；which：触发该事件的鼠标按钮或键盘的键；
• target：触发事件的DOM元素；
• pageX/Y：事件触发时鼠标相对页面左上角的水平/垂直坐标
• clientX/Y：事件触发时鼠标相对于窗口的水平，垂直坐标

$(‘.box2‘).click(function (event) {
    console.log(event);
    console.log(event.target);
})

jQuery.each()方法；用于遍历指定的对象和数组

var arr = [10, 20, 30, 40];
$.each(arr, function (index, value) {
    console.log(`我是第${index + 1}元素,值是${value}`);
})

2. HTML的设置与捕获

1. html() 返回或设置所选元素的html内容；会解析富文本

$(‘.box‘).html(‘<b>Hello world!</b>‘);

$(‘.box‘).html(); // <b>Hello world!</b>

2. text()返回或设置所选元素的文本内容；

$(‘.box‘).text(); // Hello world!

$(‘.box‘).text(‘hello vivy‘);

3. val()

jQuery(贰)