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>

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

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

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

  1. val()

jQuery(贰)

上一篇:puppeteer去除webdriver标记问题+打包


下一篇:angularjs-6