3.jQuery常用方法
3.1 dom属性相关方法
addClass() 为每个匹配的元素添加指定的样式名
$('div').addClass('box'); //为页面中所有的div添加一个box样式
removeClass() 移除集合中每个匹配元素上一个、多个或全部样式
$('p').removeClass('myClass yourClass')
toggleClass() 样式切换，如果有就删除，如果没有就添加
$("p").click(function () {
$(this).toggleClass("highlight");
});
css() 设置或者获取css样式
$('div').css('color','red'); //设置所有div字体颜色为红色
$('div').css('color') //获取颜色
$('div').css('color',function(index,item){
if(index<=4){
return 'blue';
}
}) //下标小于4的都设置成蓝色
html() 设置或者获取元素的 html内容
$('p').html() //获取p标签里面的内容
$('p').html('床前明月光')；//设置html里面的内容
text() 设置或者获取元素的文本内容
$('p').text();
$('p').text('床前明月光')；
总结：html方法功能和原生方法innerHTML一样 ，text方法功能和原生方法innerText一样，因此，区别就在于前者既可以获取标签，后者只可以获取文本 val() 获取或者设置表单元素的值，这里要注意的是 获取的是表单元素的值 不要和html 以及 text方法搞混
$("button").click(function () {
var text = $(this).text();
$("input").val(text);
});
each 循环方法
$("li").each(function(index, item){
//index 为li的下标 item表示每个li
console.log(index, item)
]})
attr() 设置或者获取元素的属性
var title = $("em").attr("title");
$("div").text(title);
prop()设置或者获取元素的属性
$("input").prop("checked", true);
removeAttr() 删除属性
$("input").removeAttr("data");
removeProp()
$("input").removeProp("checked");
总结：具有 true 和 false 两个属性的属性，如 checked, selected 或者 disabled 使用prop()，其他的使用 attr()，具体见下表：
3.2 dom操作相关方法
append
$("#ul").append(li); //在ul中添加一个li元素 ，这个元素被添加到ul中原有元素的后面
appendTo
$(li).appendTo($("#ul")); //把li元素添加到ul中 ，这个元素被添加到ul中原有元素的后面
prepend
$("#ul").prepend(li); //在ul中添加一个li元素 ，这个元素被添加到ul中原有元素的前面
prependTo
$(li).appendTo($("#ul")); //把li添加到ul中 ，这个元素被添加到ul中原有元素的前面
总结：以上几个方法 元素属于父子关系
after
$("#li1").after($("#li2")); // 在li1 后面添加一个 li2 元素
insertAfter
$("#li2").insertAfter($("#li1")); // 把li2 添加到li1 后面
before
$("#li1").before($("#li2")); // 在li1 前面添加一个 li2 元素
insertBefore
$("#li2").insertBefore($("#li1")); // 把li2 添加到li1 前面
3.3 其他方法
index()
$("box").on("clicki",function(){
$(this).index();//得到当前被点击的对象的 下标
})
prev()
$(".box").prev() //获取前面一个兄弟节点
prevAll()
$(".box").prev() //获取前面所有的兄弟节点
next()
$(".box").next() //获取后面一个兄弟节点
nextAll()
$(".box").nextAll() //获取后面所有的兄弟节点
siblings()
$(".box").siblings() //获取所有的兄弟节点
find()
$(".box").find("p"); //找到box类下面所有的p标签
closest()
$("input").closest('li');//找到input上面最近的li父级
get()
$(".box").get(0); //获取所有box类中第一个原生对象
螺钉课堂视频课程地址：http://edu.nodeing.com