09.07 jQuery 随意整理

IE 兼容版本的写法

<!--[if gt IE 8]> <!-->
    <script src="../jquery-3.2.1.min.js"></script>
    <!--<![endif]-->

    <!--[if lte IE 8]>
    <script src="../jquery-1.12.4.min.js"></script>
    <![endif]-->

 

# jQuery 基础
### ready 事件
* 用法
        
        $(document).ready(function(){
        })
        //简写
        $(function(){
        })

* 与onload的区别
    *  onload 事件 等到页面的一切加载完毕,才能触发
    *  ready事件等页面中所有的dom加载完毕,就能触发


### jquery dom 和 原生 dom
* 通过$() 获取的对象,是jquery dom
* jquery dom 本质上是由 原生dom 组成的集合,通过取下标就可以获取原生dom
* $()方法可以把 原生dom 变为 jquery dom  `$(document)`


### jquery 中绑定事件



# jquery 选择器
### 基本选择器
* #ID
* .className
* tagName
* *
* selecter,selecter

### 层级选择器
* selecter seclter
* selecter>selecter
* selecter+selecter
* selecter~selecter

### 过滤选择器
* :first
* :last
* :eq(index)
* :lt(index)
* :gt(index)
* :odd     奇数
* :even    偶数
* :not(selecter)  排除
* :lang()
* :header   所有的标题标签(hn)
* :root 
* :target  


### 内容选择器
* :contains(text)
* empty
* parent
* has(seelcter)


### 可见性选择器
* :hidden
* :visible


### 属性选择器
* [attrName]
* [attrName=value]
* [attrName!=value]
* [attrName^=value]
* [attrName$=value]
* [attrName*=value]


### 子元素选择器
* :first-child
* :last-child
* :nth-child()
* :nth-last-child()
* :only-child
* :first-of-type
* :last-of-type
* :nth-of-type()
* :nth-last-of-type()
* :only-of-type

### 表单选择器
* :input   所有的表单控件(input\select\textarea)
* :text
* :radio
* :checkbox
* :password
* :image
* :submit 
* :reset
* :button  
* :file


### 表单对象选择器
* :diabled
* :enable
* :checked
* :selected



# 筛选
### 过滤
* .eq(index)
* .first()
* .last()
* not(selcter)
* filter(selecter)
* has(selecter)
* slice(start, end)
* is(selecter)           true/false
* hasClass(className)  /true/false
* map(fn)   

### 查找
* find(selcter)       后代元素
* children(selcter)   子元素
* parent()   父元素
* parents(selcter)  所有的祖先元素
* parentsUntil(selecter)   所有祖先素直到
* closest(selecter)  从自身和祖先元素中 找到第一个满足条件
* next()  
* nextAll()
* nextUntil()
* prev()
* prevAll()
* prevUntil()
* siblings()     所有的兄弟元素   

### 串联

 

 

09/08

 

### 串联
* add(selcter)    把选中的元素加入到当前集合
* addBack()      把最近的堆栈中元素加入当前集合
* end()             返回最近一次破坏性操作之前的元素
* contents()     所有子节点的集合(不是jquery dom)

 

 

# 属性操作
### 属性操作的方法
* prop(attr [,val])   只能操作内置属性
* attr(attr [,va])     操作自定义属性
* remvoeAttr(attr)  移除属性


### class操作
* addClass()   添加一个类
* removeClass()   移除一个类
* toggleClass() 切换
* hasClass()    判断一个类


### HTML代码/文本/值
* html([val])   
* text([val])
* val([val])



# CSS
### css方法
* css()

### 位置
* offset()    
* postion()
* scrollLeft([val])
* scrollTop([val])


### 尺寸
* width() / height()
* innerWidth()  / innerHeight()
* outerWidth() / outerHeight()


# 文档处理(添加删除元素)
### 内部插入
* append()
* appendTo()
* prepend()
* prependTo()

### 外部插入
* after()
* insertAfter()
* before()
* insertBefore()

### 包裹
* wrap()
* wrapAll()
* wrapInner()
* unwrap()


### 替换
* replaceWith()
* replaceAll()


### 删除元素
* empty() 清空
* remove() 删除(自己)
* detach()  删除


### 克隆
* clone()



# 事件
### ready
### 事件绑定方式
* 事件(fn)
* bind("事件", fn)   指定对象 同时绑定多个事件
* on("事件", fn)
* one("事件", fn)

### 事件解除绑定
* unbind()
* off()


### 事件委派
* on(事件, 选择器, fn)
* delegate(选择器, 事件, fn)
* undelegate(选择器)   


### 自动触发事件
* trigger()       
* triggerHandler()


### jQuery 事件
* hover
* mouseenter
* mouseleave
* focusin
* focusout



### 事件对象

 

09.11

# 效果
### 基本 (width/height/opacity)
* show()
* hide()
* toggle()

### 滑动滑出 (height)
* slideUp()       隐藏
* slideDown()  显示
* slideToggle()

### 淡入淡出
* fadeOut()    隐藏
* fadeIn()      显示
* fadeToggle()
* fadeTo()
### 自定义动画 * animate(params, speed, easing, fn) ### 动画操作 * stop() * finish() * delay()  延迟 # 工具 ### 浏览器 * $.support ### 对象和属性操作 * $.each() * $.extend() # 核心 ### jQueryDOM 方法 * each() * size() * length

posted @ 2017-09-07 15:07  说一是二  阅读(148)  评论(0编辑  收藏  举报