zoukankan      html  css  js  c++  java
  • JQuery查找标签

    JQuery查找标签

    一、基本标签

    1 id选择器:

    $("#id(名称)")
    

    $("#cent")

    2 标签选择器:

    $("tabName(便签名称)")
    

    $("a")

    3 class选择器:

    $(".class(class选择器名称)")  
    

    $(".b")

    4 配合使用:

    $("标签名称.选择器")  // 找到有c1 class类的div标签
    

    $("div.c")

    5 所有元素选择器:

    $("*")
    

    6 组合选择器:

    $("id选择器, class选择器, 标签选择器")
    

    img

    img

    二、层级选择器:

    1 x的所有后代y(子子孙孙

    $("选择器1  选择器2")
    
    

    $("x y"); // 只要选择器2

    2 x的所有儿子y(儿子)

    $("选择器1 > 选择器2")
    

    $("x > y"); // 只要儿子

    3 找到所有紧挨在x后面的y

    $("选择器1 + 选择器2")
    

    $("x + y");// (一个)

    4 x之后所有的兄弟y

    $("选择器1 ~ 选择器2")
    

    $("x ~ y");//(多个)

    三、基本筛选器

    1 第一个

    :first
    

    2 最后一个

    :last
    

    3 索引等于index的那个元素

    :eq(index)
    

    4 匹配所有索引值为偶数的元素,从 0 开始计数

    :even
    

    5 匹配所有大于给定索引值的元素

    :odd
    

    6 匹配所有小于给定索引值的元素

    :gt(index)
    

    移除所有满足not条件的标签

    :lt(index)
    

    7 移除所有满足not条件的标签

    :not(元素选择器)
    

    8 选取所有包含一个或多个标签在其内的标签(指的是从后代元素找)

    :has(元素选择器)
    

    四、属性选择器

    $("tagName[attrbute]")
    $("tagName[attrbute=name]")// 属性等于
    
    [attribute!=value]// 属性不等于
    

    $("input[type=text]")

    $("input[type]")

    五、表单筛选器

    $(":text") 
    $(":password") 
    $(":file") 
    $(":radio") 
    $(":checkbox")  // 找到所有的checkbox
    
    
    $(":submit") 
    $(":reset") 
    $(":button") 
    
    表单对象属性:
    $(":enabled") 
    $(":disabled") 
    $(":checked") 
    $(":selected")
    

    • 找到可用的input标签
    <form>
      <input name="email" disabled="disabled" />
      <input name="id" />
    </form>
    
    $("input:enabled")  // 找到可用的input标签
    
    • 找到被选中的option:
    <select id="s1">
      <option value="beijing">北京市</option>
      <option value="shanghai">上海市</option>
      <option selected value="guangzhou">广州市</option>
      <option value="shenzhen">深圳市</option>
    </select>
    
    $(":selected")  // 找到所有被选中的option
    

    六、筛选器方法

    1 下一个元素:

    $("#id").next() // 下一个标签
    $("#id").nextAll() // 标签下面的全部
    $("#id").nextUntil("#i2") // 两者之间
    

    2 上一个元素:

    $("#id").prev() // 上一个标签
    $("#id").prevAll() // 上一个标签全部
    $("#id").prevUntil("#i2") // 两者之间
    

    3 父亲元素:

    $("#id").parent()
    $("#id").parents()  // 查找当前元素的所有的父辈元素
    $("#id").parentsUntil() // 查找当前元素的所有的父辈元素,直到遇到匹配的那个元素为止。
    

    4 儿子和兄弟元素:

    $("#id").children();// 儿子们
    $("#id").siblings();// 兄弟们
    

    5 查找

    $("div").find("p") ===>等价于$("div p")
    

    6 筛选

    筛选出与指定表达式匹配的元素集合。这个方法用于缩小匹配的范围。用逗号分隔多个表达式

    $("div").filter(".c1")  ===> 等价于 $("div.c1")  // 从结果集中过滤出有c1样式类的
    

    7 补充

    .first() // 获取匹配的第一个元素
    .last() // 获取匹配的最后一个元素
    .not() // 从匹配元素的集合中删除与指定表达式匹配的元素
    .has() // 保留包含特定后代的元素,去掉那些不含有指定后代的元素。
    .eq() // 索引值等于指定值的元素
    
    在当下的阶段,必将由程序员来主导,甚至比以往更甚。
  • 相关阅读:
    Spring-----aop
    Activity的四种launchMode《转》
    解决gradle /Users/xxxx/Documents/workspace/fontmanager/.gradle/2.2.1/taskArtifacts/cache.properties (No such file or directory)报错办法
    Mac删除JDK
    Mac OSX Java 编译时乱码问题
    android中出现Error retrieving parent for item: No resource found that matches the Theme.AppCompat.Light
    使用AndroidStudio报错:INSTALL_FAILED_UPDATE_INCOMPATIBLE
    Java 类库和常用类库
    (斐波那契总结)Write a method to generate the nth Fibonacci number (CC150 8.1)
    各种排序学习归纳总结(Java)
  • 原文地址:https://www.cnblogs.com/randysun/p/11704909.html
Copyright © 2011-2022 走看看