牵手白首 2020-06-14
jQuery是目前最流行的JavaScript程序库,它是对JavaScript对象和函数的封装。它能做的JavaScript也都能做,但使用jQuery能大幅提高开发效率。
工厂函数$():将DOM对象转化为jQuery对象
选择器 selector:获取需要操作的DOM 元素
方法action():jQuery中提供的方法,其中包括绑定事件处理的方法
语法:$(selector).action() ;
jQuery选择器:
一、通过CSS选择器选取元素(都是选择背景变色,相应的body就不写了)
1.基本选择器
例:
选择所有的 span 元素和id为two的元素
$(function(){
$("#btn5").click(function(){
$("span,#two").css("background-color","#bbffaa");
});
});
2.层次选择器
例:
选择 id 为 two 的元素后面的所有 div 兄弟元素
$(function(){
$("#btn4").click(function(){
$("#two~div").css("background", "#bbffaa");
});
});
3.属性选择器
例:
选取 含有 title 属性值, 且title 属性值不等于 test 的 div 元素
$(function(){
$("#btn8").click(function() {
$("div[title][title!=test]").css("background", "#bbffaa");
});
});
二、通过过滤选择器选择元素
1.基本过滤选择器
例:
选择当前正在执行动画的所有元素
$(function(){
$("#btn10").click(function(){
$(":animated").css("background", "#bbffaa");
});
});
2.可见性过滤选择器
例:
选择所有不可见的 input 元素
$(function(){
$("#btn3").click(function(){
alert($("input:hidden").val());
});
});