jQuery 是一个 JavaScript 库。
它极大地简化了 JavaScript 编程。
这里简单记录一下jQuery基础语法,慢慢整理
选择器
- id
$("#myDiv") - class
$(".myClass") - element
$("div") - 多个选择器
$("selector1,selector2,selectorN") - 匹配所有元素
$("*")
简单伪类选择器
子元素伪类选择器
操作样式
- 取得第一个段落的color样式属性的值。
$("p").css("color") - 将所有段落字体设为红色
$("p").css("color","red") - 将所有段落的字体颜色设为红色并且背景为蓝色。
$("p").css({ "color": "#ff0011", "background": "blue" })
操作html代码/文本/值
- 返回p元素的内容。
$('p').html() - 设置所有 p 元素的内容
$("p").html("Hello <b>world</b>!" - 返回p元素的文本内容。
$('p').text() - 设置所有 p 元素的文本内容
$("p").text("Hello world!") - 获取文本框中的值
$("input").val() - 设定文本框的值
$("input").val("hello world!")
操作属性
- 设置或返回被选元素的属性值。
$("img").attr("src")
$("img").attr("src","test.jpg")
$("img").attr({ src: "test.jpg", alt: "Test Image" }) - 从每一个匹配的元素中删除一个属性
$("img").removeAttr("src") - 设置或返回被选元素的属性和值。
$("input[type='checkbox']").prop("checked")
$("input[type='checkbox']").prop("disabled", true)
$("input[type='checkbox']").prop({disabled: true}) - 删除由.prop()方法设置的属性集
$("input[type='checkbox']").remove("disabled")
事件
- click()
单击事件- 触发已绑定的事件
$("p").click() - 将函数绑定到 click 事件
$("p").click( function () { $(this).hide(); })
- 触发已绑定的事件
- dblclick()
双击事件,同上 - mousemove()
鼠标指针在指定的元素中移动时,就会发生事件 - mouseover()
鼠标指针穿过被选元素或其子元素,都会触发事件 - mouseenter ()
只有在鼠标指针穿过被选元素时,才会触发事件 - mouseleave ()
鼠标指针离开元素时,会发生事件