JQuery相关知识点总结回顾
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：自定义动画函数
