jQuery

Dom和jQuery对象的转换

  • DOM-jQuery：$(DOM对象)
  • jQuery-DOM：$(“div”)[index]/$(“div”).get(index)

常用选择器

  • #id：获取指定id的元素

  • *：所有元素

  • .class：获取同一个class的元素

  • div：同标签元素

  • div,p,li：多个元素

  • li.current：交集元素

  • ul>li：子代选择

  • ul li：后代选择

  • :first：第一个元素

  • :last：最后一个

  • :eq(index)：第几个元素从0开始

  • :odd：索引为奇数的元素

  • :even：索引号为偶数的元素

  • parent()：获取父级

  • children(selector)：最近的儿子

  • find(selector)：后代选择

  • siblings(selector)：兄弟节点

  • nextAll([expr])：该元素之后的同辈元素

  • prevtAll([expr])：该元素之前的同辈元素

  • hasClass(class)：指定类的元素

  • eq(index)：index位的元素

常用属性

  • $(“div”).css(“属性名”,“属性值”);

  • addClass()：添加类名

  • removeClass()：移除类名

  • toggleClass()：切换类，若存在该类名去掉，没有加上

  • show(speed,easing,fn)：显示

  • hide()：隐藏

  • toggle()：切换

  • slideDown()：滑动

  • slideup()：滑动

  • slideToggle()：滑动

  • fadeIn():淡入淡出

  • fadeOut():淡入淡出

  • fadeToggle():淡入淡出

  • fadeTo():淡入淡出

  • animate()：自定义动画

  • prop()：获取标签自身属性值

  • attr()：获取自定义属性

  • text()：文本内容

  • html()：元素内容

  • val()：获取value值

  • each(function(index,domEle){})：遍历元素

  • $(“

  • “)：创建标签

  • remove()：删除自身

  • empty()：清空子节点

  • html(“”)：清空元素内容

  • width()/height()：宽度/高度

  • innerWidth()/innerHeight()：宽度/高度包含padding

  • outerWidth()/outerHeight()：宽度/高度包含padding、border

  • outerWidth(true)/outerHeight(true)：宽度/高度包含padding、border、margin

  • offset()：相对文档的偏移坐标，返回obj，有left/top属性，可以设置

  • postion()：距离带有定位的父亲节点的坐标对象，不能设置

  • scrollTop()/scrollLeft()：被卷去的距离

  • on({click:function(){}})：绑定多个事件

  • off(“事件名”)：解绑事件

  • one(“click”,function(){})：执行一次事件

  • 元素.事件：手动触发事件

  • trigger(“事件名”)：手动触发事件

  • triggerHandler(“事件名”)：手动触发事件不触发默认行为

  • $.extend(targetObj,obj)：对象拷贝