jQuery简介
jQuery的用法
1.访问和操作dom元素2.控制页面样式3.对页面事件的处理4.方便的使用jQuery插件5.与Ajax技术的完美结合
jQuery的优势
1.体积小，压缩后体积只有100kb左右2.强大的选择器3.出色的dom封装4.可靠的事件处理机制5.出色的浏览器兼容性6使用隐式迭代简化编程7.丰富的插件支持
jQuery的三个步骤
1.引入jQuery文件2.入口函数3.功能实现
jQuery语法
jQuery的语法结构：
jQuery入口函数的两种方式1.(function(){ });
jQuery与dom对象互转
1.jQuery转dom对象可通过两种方式得到var one1=KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲one"); var one2…(one);
jQuery方法的应用
addClass() 方法向被选元素添加一个或多个类名。例如(selector).css(“属性”，”属性值”);设置多个(selector).show(); $(selector).hide();
next()方法
jQuery程序的代码风格
加粗样式链式操作在jquery里面，方法可以一直调用下去
隐式迭代如 $(function(){
KaTeX parse error: Expected 'EOF', got '}' at position 51: …olor":"red"});
}̲);
**基本选择器**
…(“h1”).css(“color”,“blue”);
类选择器("#three").css(“color”,“pink”);
并集选择器KaTeX parse error: Expected 'EOF', got '#' at position 8: (".two,#̲four").css("col…("").css(“color”,“red”);
层次选择器
$("#one p").css(“color”,“blue”);选区id为one里所有的p元素
$("#one>p").css(“color”,“red”);选取one的子元素p
$("#two+p").css(“font-size”,“30px”);选取紧邻two的同辈元素p
$("#two~p").css(“font-size”,“50px”);选取two之后的所以p元素
属性选择器
$(“a[id]”).css(“color”,“red”);选取含有id属性的元素
$(“a[id=‘one’]”).css(“font-size”,“30px”);选区id值等于one的元素
$(“a[id!=‘one’]”).css(“font-size”,“30px”);选取id值不为one的元素
$(“a[id^=‘o’]”).css(“font-size”,“30px”);选取id值以o开头的元素
=‘o’]").css(“font-size”,“30px”);选取id值以o结尾的元素
$("a[id=‘e’]").css(“font-size”,“30px”);选取id属性值为包含的元素
过滤选择器
$(“li a:first”).css(“color”,“red”);选取第一个元素
$(“li a:last”).css(“color”,“pink”);选取最后一个元素
$(“li a:odd”).css(“color”,“red”);选取索引是奇数的元素idex从0开始
$(“li a:even”).css(“color”,“pink”);选取索引是偶数的元素idex从0开始
$(“li a:eq(2)”).css(“color”,“pink”);选取索引值等于2的元素
$(“li a:gt(2)”).css(“color”,“pink”);选取索引值大于2的元素
$(“li a:lt(2)”).css(“color”,“pink”);选取索引值小于2的元素
$(":header").css(“color”,“pink”);选取所有标题元素如h1~h6
$(“li:not(a)”).css(“color”,“pink”);选取class值不是啊的元素
筛选选择器
(“ul>li”)，
子代选择器(“ul li”),
后代选择器KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲first").sibling…("#first").parent(),查找父亲
(“li.eq(2)”)index从0开始
$(“li”).next()找下一个兄弟
$(“li”).prev()找上一个兄弟
相关文章：