目录
jQuery操作样式
css操作样式
css(name, value)
修改单个样式
name:样式名 value:样式值
$("li")
.css("backgroundColor", "pink")
.css("color", "red")
.css("fontSize", "32px");
css(obj)
修改多个样式
$("li").css({
"backgroundColor":"pink",
"color": "red",
"font-size":"32px",
"border": "1px solid black"
});
获取样式
css(name)
name:想要获取的样式
class操作样式
addClass(name):添加类
removeClass(name):移除类
hasClass(name):判断类
toggleClass(name):切换类
jQuery操作属性
attr操作属性
//设置单个属性
attr(name, value)
// 设置多个属性
$("img").attr({
alt:"图破了",
title:"图片",
aa:"bb"
})
//移除某个属性
removeAttr(name)
prop操作属性
//对于布尔类型的属性,disabled,selected,checked,不要用attr方法,应该用prop方法 prop用法跟attr方法一样。
$(function () {
$("input").eq(0).click(function () {
$("#ck").prop("checked", true);
});
$("input").eq(1).click(function () {
$("#ck").prop("checked", false);
});
});
jQuery动画
三组基础动画
show/hide slideDown/slideUp/slideToggle fadeIn/fadeOut/fadeToggle
自定义动画
animate(prop, [speed], [swing/linear], [callback])
停止动画
.stop();
jQuery操作节点
创建节点: $("<span></span>")
添加节点 append appendTo prepend prependTo after before
//添加到子元素的最后面
$("div").append($("p"));
$("p").appendTo($("div"));
//添加到子元素的最前面
$("div").prepend($("p"));
$("p").prependTo($("div"));
$('div').after($("p"));
$('div').before($("p"));
节点的清空、移除与克隆
//清空内容
$("div").empty();
//删除节点
$("div").remove();
//克隆节点 clone
//false:不传参数也是深度复制,不会复制事件
//true:也是深复制,会复制事件
$(".des").clone(true).appendTo("div");