欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

jquery选择器基础

程序员文章站 2022-07-04 19:54:06
简单选择器 类 id 元素/标签 * 复合(sel1,sel2)逗号隔开 层次选择器 s1 s2;后代选择器,空格隔开 p>c;子代选择器;不包括孙代及以下 p+next ;相邻选择器 p~sub;兄弟选择器,同一父级下并列子代 表单选择器,表单form下元素 :input;包括 input,tex ......

简单选择器

  • id
  • 元素/标签
  • *
  • 复合(sel1,sel2)逗号隔开

层次选择器

  • s1 s2;后代选择器,空格隔开
  • p>c;子代选择器;不包括孙代及以下
  • p+next ;相邻选择器
  • p~sub;兄弟选择器,同一父级下并列子代

表单选择器,表单form下元素

  • :input;包括 input,textarea,select
  • :text;文本框
  • :password;密码框
  • :radio;单选按钮
  • :checkbox;复选框
  • :submit;提交按钮
  • :image;图像域
  • :reset;重置按钮
  • :button;按钮
  • :file;文件域
  • 例如:$("form:input").val();

***过滤选择器(重要)

  1. 表单对象属性过滤选择器

    • :enabled;属性为可用的标签元素
    • :disabled;属性为不可用的标签元素
    • :checked;属性为被选中的元素
    • :selected;被选择中option的元素;$("select option:selected")
  2. 子元素过滤选择器

  • :nth-child(eq(n)|even|odd|index);子元素,索引从1开始
  • :first-child;第一个子元素
  • :last-child;最后一个子元素
  • :only-child;获取父元素中仅有一个子元素的
  • 属性过滤选择器

    • [ attr ];所有拥有该属性的元素
    • [ attr = val ];属性的值为val的元素
    • [ attr != val ];属性值不等于val的元素
    • [ attr ^=val ];以属性值为val开始的元素
    • [ attr $= val ];以属性值为val结束的元素
    • [ attr *= val ];含有val值的元素
    • [ attr1 ][ attr2 ];同时满足两个属性的元素;$("div[ id = 'eg1'][ title = 'eg2' ]").show();
  • 可见性过滤选择器

    • :hidden;获取所有不可见,或者type=hidden的元素
    • :visible;获取所有可见元素
  • 内容过滤选择器

    • :content(text);获取包含指定文本的元素
    • :empty;        不含或空文本的元素
    • :has(selector);含有某选择器的元素;$("div:has('span')").show();
    • :parent;含有子元素或文本的元素
  • 简单过滤选择器

    • first()或:first;
    • last()或:last;
    • :not(seletor);
    • :even;索引为偶数,索引从0开始
    • :odd;索引为奇数,从0开始
    • :eq(index);给定索引,从0开始
    • :gt(index);大于索引,从0开始
    • :lt(index);小于索引,从0开始
    • :header;标题
    • :animatex;正在执行动画的