zoukankan      html  css  js  c++  java
  • 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   所有的表单控件(inputselect extarea)
    * :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

  • 相关阅读:
    css样式学习笔记
    Css教程玉女心经版本
    weblogic高级进阶之ssl配置证书
    weblogic高级进阶之查看日志
    weblogic之高级进阶JMS的应用
    【WebLogic使用】3.WebLogic配置jndi数据源
    shiro的helloworld
    尚硅谷spring 事物管理
    尚硅谷spring aop详解
    Spring Boot 2.x Redis多数据源配置(jedis,lettuce)
  • 原文地址:https://www.cnblogs.com/lwwnuo/p/7489790.html
Copyright © 2011-2022 走看看