jQuery知识点梳理
一、 jquery选择器
- 基本选择器
- ID选择器
- 类选择器
- 标记选择器
- 分组选择器
- 通配符选择器
- 层次选择器
- $(“ancestor descendent”):祖先后代选择器 空格
- $(“parent > child”):父子选择器 大于
- $(“prev + next”):相邻后兄弟元素选择器 加号
- $(“prev ~ siblings”):所有后兄弟元素选择器 波浪线
- 过滤选择器:基本过滤选择器
:first、:last、:odd、:even、:eq(index)、:gt(index)、:lt(index)、not(selector)
- 过滤选择器:内容过滤选择器
:contains(text)、:empty、:parent、has(selector)
- 过滤选择器:可见性过滤选择器
:visible、:hidden
- 过滤选择器:属性过滤选择器
[attribute]、[attribute=value]、[attribute!=value]、[attribute^=value]、[attribute$=value]、[attribute*=value]
- 过滤选择器:表单过滤选择器
- :checked、:selected
- :text、:password、:radio、:checkbox、:submnit、:button、:image、:reset、:file、
二、 选择器相关方法
parent()、children()、prev()、next()、prevAll()、nextAll()、siblings()、find()、filter()
三、 核心函数
- 文档加载完毕函数 $(document).ready(function(){}); == $(function(){});
- JS -> jQuery对象
Jquery对象 –> js对象 1.$(selector)[index] 2.$(selector).get(index)
Js -> jquery对象 $(js对象)
四、 DOM操作
- 添加、移除、修改、克隆
append()、after()、before()、prepend()、remove()、empty()、clone()、html()
- 属性操作
添加|修改属性:attr(“属性名”, “属性值”)
移除属性:removeAttr(“属性名”);
获取属性值:attr(“属性名”);
- 常用方法
text()、text(String text)
html()、html(String html)
val()、val(String value)
height()、height(int)
width()、width(int)
五、 CSS操作
添加类样式:addClass(“类名”)
移除类样式:removeClass(“类名”)
切换类样式:toggleClass(“类名”)
判断是否拥有类样式:hasClass(“类名”)
设置CSS属性值:css(“CSS属性名”, “css属性值”)、 css({“属性名1”:”值1”, “属性名2”:“值2”})
六、 事件
- 事件类型
click、dblclick、mouseover、mouseout、mouseleave、mouseenter、mousemove、keydown、keyup、keypress、change、blur、focus、
- 绑定、移除绑定
bind(“事件类型”, function(){})
unbind(“事件类型”)
$(selector).事件类型(function(){}) $(“#btn1”).click(function(){});
- 合成事件
hover == mouseover + mouseout
hover(function(){}, function(){})
hover(function(){})
- 事件参数
which:
pageX:
pageY:
七、 动画
- show()、hide()、toggle()
- slideUp()、slideDown()、slideToggle()
- fadeIn()、fadeOut()、fadeToggle()
- animate:自定义动画函数
来源:https://www.cnblogs.com/12345YOUNG/p/5041910.html