元素的操作:
创建元素:
$(“html字符串”)
父元素对象.html(“html字符串”)
父元素对象.append($(“html字符串”))
添加元素:
append appendTo
prepend prependTo
after insertAfter
before insertBefore
清空/删除元素:
remove()
empty() 清空
元素对象.html("")
克隆元素:
clone()
元素的宽高和位置:
width(400)
height()
offset().left
offset().top
$(document).scrollTop 往上滚出去的距离
$(document).scrollLeft 往左滚出去的距离
事件操作:
绑定事件:
1、元素对象.click()
2、元素对象.bind(“事件名称”, 事件处理函数) 给自己绑定
3、元素对象.delegate(“选择器字符串”,“事件名称”, 事件处理函数) 给后代绑定
4、元素对象.on(“事件名称”, 事件处理函数) 给自己绑定
元素对象.on(“事件名称”, “选择器字符串”, 事件处理函数) 给后代绑定
可以给动态添加的属性绑定事件。可以实现先绑定事件,后添加元素。
解绑事件:
1、bind绑定的,可以使用unbind解绑
2、delegate绑定的,可以使用undelegate解绑
3、上面4种绑定方式绑定的,可以都使用off解绑
off解绑自己和后代的事件 off(“事件名称”)
off解除后代的事件 off(“事件名称”, “选择器字符串”)
off解绑后代的事件 off(“事件名称”, “**”)
off解绑所有的事件 off()
attr和prop函数:
attr主要用于自定义属性的设置和获取。但是也可以用于原生属性的赋值。
prop主要用于原生属性的设置和获取。checked
在jQuery中,如果赋值操作,通常包含隐式遍历,所以可以对jQuery对象的所有的元素都产生作用。
如果是获取值得操作,因为jQuery对象所有的元素的同一个值可能有不同,所以一般返回的是第一个元素的值。
$(":checkbox").prop("checked", true);
$(":checkbox").prop("checked")
反选,原来自己是选中,那么不选中;如果是不选中,就选中
$(":checkbox").prop("checked", !$(":checkbox").prop("checked")));
var ckBox = $(":checkbox"); // 获取jQuery对象,其中包括四个复选框对象
for(var i = 0; i < ckBox.length; i ++){
ckBox[i].checked = !ckBox[i].checked; // ckBox[i] 是什么?
}
jQuery对象[0] 得到一个原生js对象
ckBox[0].checked
ckBox[1]
ckBox[2]
ckBox[3]
js中不区分单双引号,无所谓。
<a href="www.baidu.com">百度</a>
var str = '<a href="www.baidu.com">百度</a>'
var str = "<a href=\"www.baidu.com\">百度</a>"
var str = "<a href='www.baidu.com'>百度</a>"
var index = 2;
var p = "<p>" + index + "</p>";
var p = "<p>" + index + "</p>";
var name = 'zs';
var age = 18;
var tr = "<tr><td>" + name + "</td><td>" + age + "</td></tr>";