1.1什么是jQuery
一个javascript库,把常用方法写到一个js文件中,需要的时候直接调用即可
学习jQuery就是学习一些方法
1.2入口函数详细介绍
第一种:
$("document").ready(function () { } ); 第二种:
$(function () { } );
和js的入口函数window.onload的区别:
jQuery--文档树加载完成的时候执行,不会等待突破资源的加载完成
js--文档树加载完成后,必须等待图片等的资源加载完成才会执行
1.3 jQuery中的$符号
本质就是一个函数,且$ === jQuery,可分为3种功能:
1,$(function () { } ); 参数是function,功能是入口函数
2,$("#id"); $(".wrap");等 参数是字符串,一般都是选择器,功能是查找页面的元素
3,$(domObj); 将dom对象转化成jQuery对象
1.4
jQuery对象:
用jQuery方法获取到的元素返回的对象
DOM对象:
使用JavaScript中的方法获取页面中的元素返回的对象
两者的区别:
jQuery对象就是DOM对象的包装集(伪数组)
两者之间的转换:
jQuery对象转DOM对象:通过索引--
jQueryObj[index] 或
jQueryObj.get(index)
DOM对象转jQuery对象:
$(domObj)
1.5jQuery和javascript
js是一种脚本语言,jQuery是靠js写成的,jQuery就是一个js库
jQuery 元素选择器和属性选择器:它们允许您通过标签名、属性名或内容对 HTML 元素进行选择。
对应$(selector).action()的前半部分。
jQuery 元素选择器:
$("p") 选取 <p> 元素。
$("p.intro") 选取所有 class="intro" 的 <p> 元素。
$("p#demo") 选取所有 id="demo" 的 <p> 元素。
jQuery 属性选择器:
$("[href]") 选取所有带有 href 属性的元素。
$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。
$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。
$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。
2.1 基本选择器
$(".className") 类选择器
$("#id") id选择器
$("tagName") 标签选择器
$("selector1,selector2") 并集选择器
$("selector1selector2") 交集选择器
2.2 层级选择器
后代 选择器 $("selector1 selector2")
子代 选择器 $("selector1>selector2")
2.3 过滤选择器
格式:$("selector:filter")
odd $("selector:odd") 奇数过滤选择器
even $("selector:even") 偶数过滤选择器
eq(index) $("selector:eq(index)") 序号过滤选择器
2.4 筛选选择器
筛选选择器全都是方法
children(selector)
find(selector)
next()
siblings(selector)
parent()
eq(index)
3.1 css操作
设置单个样式 css(name, value)
设置多个样式 css(obj) {name:value,name:value....,name:value}
获取样式 css(name)
3.2 class操作
添加class addClass(className) 追加
移除class removeClass(className) 如果不传参数 移除所有的样式
判断class样式 hasClass(className)
切换class样式 toggleClass(className) 若有则移除,若无则添加