Java 笔记 十四 JQuery

189 阅读3分钟

JQuery

2. 分类

    1. 基本选择器
        1. 标签选择器(元素选择器)
            语法: $("html标签名") 获得所有匹配标签名称的元素
        2. id选择器
            语法: $("#id的属性值") 获得与指定id属性值匹配的元素
        3. 类选择器
            语法: $(".class的属性值") 获得与指定的class属性值匹配的元素
        4. 并集选择器
            语法: $("选择器1, 选择器2...")获的多个选择器选中的所有元素
    2. 层级选择器
        1. 后代选择器
            语法: $("A B") 选择A元素内部的所有B元素
        2. 子选择器
            语法: $("A > B") 选择A元素内部的所有B子元素
    3. 属性选择器
        1. 属性名称选择器
            语法: $("A[属性名]") 包含指定属性的选择器
        2. 属性选择器
            语法: $("A[属性名='值']") 包含指定属性等于指定值的选择器
        3. 复合属性选择器
            语法: $("A[属性值='值'][]...")包含多个属性条件的选择器
        4. 过滤选择器
            1. 首元素选择器
                语法: first 获得选择的元素中的第一个元素
            2. 尾元素选择器
                语法: last 获得选择的元素中的最后一个元素
            3. 非元素选择器
                语法: not(selector) 不包含指定内容的元素
            4. 偶数选择器
                语法: even 偶数,从0开始计数
            5. 奇数选择器
                语法: odd 奇数, 从0开始计数
            6. 等于索引选择器
                语法: eq(index) 指定索引元素
            7. 大于索引选择器
                语法: gt(index) 大于指定索引元素
            8. 小于索引选择器
                语法: lt(index) 小于指定索引元素
            9. 标题选择器
                语法: header获得标题(h1~h6)元素,固定写法
        5. 表单过滤选择器
            1. 可用元素选择器
                语法: enabled 获得可用元素
            2. 不可用元素选择器
                语法: disabled 获得不可用元素
            3. 选中选择器
                语法: checked获得单选/复选框中的元素
            4. 选中选择器
                语法: selected 获得下拉框选中的元素
                
3. DOM操作
    1. 内容操作
        1. html(): 获取/设置元素的标签体内容 <a><font>内容</font></a> --> <font>内容</font>
        2. text(): 获取/设置元素的标签体纯文本内容 <a><font>内容</font></a> --> 内容
        3. val(): 获取/设置元素的value属性值
    2. 属性操作
        1. 通用属性操作
            1. attr(): 获取/设置元素的属性
            2. removeAttr(): 删除属性
            3. prop(): 获取/设置元素的属性
            4. removeProp(): 删除属性
            attr和prop区别?
                1. 如果操作的是元素的固有属性,则建议使用prop
                2. 如果操作的是元素自定义属性,则建议使用attr
        2. 对class属性操作
            1. addClass(): 添加class属性值
            2. removeClass(): 删除class属性值
            3. toggleClass(): 切换class属性
            4. css()
    3. CRUD操作
        1. append(): 父元素将子元素追加到末尾
            a.append(b): 将b添加到a元素内部,并且在末尾
        2. prepend(): 父元素将子元素追加到开头
            a.prepend(): 将b添加到a内部,并且在开头
        3. appendTo(): 
            a.appendTo(b): 将a添加到b内部,并且在末尾
        4. prependTo():
            a.prependTo(b) 将a添加到b内部,并且在开头
        5. after(): 添加元素到元素后边
            a.after(b): 将b添加到a后边,对象a和对象b是兄弟关系
        6. before(): 添加元素到元素前边
            a.before(b): 将b添加到a前边,对象a和b是兄弟关系
        7. insertAfter()
        8. insertBefore()
        9.remove: 移除元素
            a.remove(): 将a元素删除掉
        10.empty(): 清空元素的所有后代元素
            a.empty(): 将对象的后代元素全部清空,但是保留当前对象以及其属性节点