1.选择器

(1)通配符:

$("input[id^='code']");//id属性以code开始的所有input标签
$("input[id$='code']");//id属性以code结束的所有input标签
$("input[id*='code']");//id属性包含code的所有input标签
$("input[name^='code']");//name属性以code开始的所有input标签
$("input[name$='code']");//name属性以code结束的所有input标签
$("input[name*='code']");//name属性包含code的所有input标签

(2)根据索引选择

$("tbody tr:even"); //选择索引为偶数的所有tr标签
$("tbody tr:odd"); //选择索引为奇数的所有tr标签

ps:jQuery选择器总结

jQuery 的选择器可谓之强大无比,这里简单地总结一下常用的元素查找方法

$("#myELement")    选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素

$("div")           选择所有的div标签元素,返回div元素数组

$(".myClass")      选择使用myClass类的css的所有元素

$("*")             选择文档中的所有的元素,可以运用多种的选择方式进行联合选择:例如$("#myELement,div,.myclass")

层叠选择器:

$("form input")         选择所有的form元素中的input元素 
$("#main > *")          选择id值为main的所有的子元素 
$("label + input")     选择所有的label元素的下一个input元素节点,经测试选择器返回的是label标签后面直接跟一个input标签的所有input标签元素 
$("#prev ~ div")       同胞选择器,该选择器返回的为id为prev的标签元素的所有的属于同一个父元素的div标签

基本过滤选择器:

$("tr:first")               选择所有tr元素的第一个 
$("tr:last")                选择所有tr元素的最后一个 
$("input:not(:checked) + span")

过滤掉:checked的选择器的所有的input元素

$("tr:even")               选择所有的tr元素的第0,2,4... ...个元素(注意:因为所选择的多个元素时为数组,所以序号是从0开始)   
$("tr:odd")                选择所有的tr元素的第1,3,5... ...个元素 
$("td:eq(2)")             选择所有的td元素中序号为2的那个td元素 
$("td:gt(4)")             选择td元素中序号大于4的所有td元素 
$("td:ll(4)")              选择td元素中序号小于4的所有的td元素 
$(":header") 
$("div:animated")

内容过滤选择器:

$("div:contains('John')") 选择所有div中含有John文本的元素 
$("td:empty")           选择所有的为空(也不包括文本节点)的td元素的数组 
$("div:has(p)")        选择所有含有p标签的div元素 
$("td:parent")          选择所有的以td为父节点的元素数组

可视化过滤选择器: 

$("div:hidden")        选择所有的被hidden的div元素 
$("div:visible")        选择所有的可视化的div元素

属性过滤选择器:

$("div[id]")           选择所有含有id属性的div元素 
$("input[name='newsletter']")    选择所有的name属性等于'newsletter'的input元素 
$("input[name!='newsletter']") 选择所有的name属性不等于'newsletter'的input元素 
$("input[name^='news']")         选择所有的name属性以'news'开头的input元素 
$("input[name$='news']")         选择所有的name属性以'news'结尾的input元素 
$("input[name*='man']")          选择所有的name属性包含'news'的input元素 
$("input[id][name$='man']")    可以使用多个属性进行联合选择,该选择器是得到所有的含有id属性并且那么属性以man结尾的元素

子元素过滤选择器:

$("ul li:nth-child(2)"),$("ul li:nth-child(odd)"),$("ul li:nth-child(3n + 1)") 
  $("div span:first-child")          返回所有的div元素的第一个子节点的数组 
$("div span:last-child")           返回所有的div元素的最后一个节点的数组 
$("div button:only-child")       返回所有的div中只有唯一一个子节点的所有子节点的数组

表单元素选择器: 

$(":input")                  选择所有的表单输入元素,包括input, textarea, select 和 button

$(":text")                     选择所有的text input元素 
$(":password")           选择所有的password input元素 
$(":radio")                   选择所有的radio input元素 
$(":checkbox")            选择所有的checkbox input元素 
$(":submit")               选择所有的submit input元素 
$(":image")                 选择所有的image input元素 
$(":reset")                   选择所有的reset input元素 
$(":button")                选择所有的button input元素 
$(":file")                     选择所有的file input元素 
$(":hidden")               选择所有类型为hidden的input元素或表单的隐藏域

表单元素过滤选择器: 

$(":enabled")             选择所有的可操作的表单元素 
$(":disabled")            选择所有的不可操作的表单元素 
$(":checked")            选择所有的被checked的表单元素 
$("select option:selected") 选择所有的select 的子元素中被selected的元素

jQuery的选择器中的通配符[id^='code']或[name^='code']及jquery选择器总结的更多相关文章

  1. jQuery的选择器中的通配符[id^='code'] 【转】

    JQuery 1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='cod ...

  2. jQuery选择器中,通配符[id^='code']input[id$='code'][id*='code']

     1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']&qu ...

  3. jQuery的选择器中的通配符[id^='code'] 等示例及说明

    1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']&quo ...

  4. jQuery的选择器中的通配符[id^='code']

    1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']&quo ...

  5. jQuery的选择器中的通配符[id^='code']或[name^='code']

    这两天在做一个专题的时候遇到了一个通配符的问题 //弹层操作$(function(){ //视频播放 $("a[href^='#video']").each(function(in ...

  6. Query的选择器中的通配符[id^='code']或[name^='code']

        1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code'] ...

  7. jQuery的选择器中的通配符总结

    1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']&quo ...

  8. jQuery的选择器中的通配符

    (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']");// ...

  9. jQuery的选择器中的通配符使用介绍

    $("input[id^='data']");//id属性以data开始的所有input标签 $("input[id$='data']");//id属性以dat ...

随机推荐

  1. webpack2.0 css文件引入错误解决及图片输出在根目录配置问题

    webpack引入css文件,main.js内容如下 import Vue from 'vue'; import App from './App.vue'; import Mint from 'min ...

  2. python之类的多态(鸭子类型 )、封装和内置函数property

    一.多态 1.什么是多态:一个类表现出的多种状态--->通过继承来实现的例如:class Animal:passclass Dog(Animal):passclass Cat(Animal):p ...

  3. 如何破解加密了的word文档

    https://blog.csdn.net/huangbaokang/article/details/79630223 变成xml文件格式之后--查找在documentProtection前面加上un ...

  4. [基础]Android 应用的启动

    Android 应用的启动模式分为两种,一种是通过启动器(Launcher)启动,另一种是通过Intent消息启动. 如果在通过Intent 消息启动前,希望判断欲启动的应用是否已经安装, 目前有两种 ...

  5. Pandas系列(十)-转换连接详解

    目录 1. 拼接 1.1 append 1.2 concat 2. 关联 2.1 merge 2.2 join 数据准备 # 导入相关库 import numpy as np import panda ...

  6. NOI-OJ 1.13 ID:23 区间内的真素数

    整体思路 这里需要大量使用素数,必须能够想到只求出M到N之间的素数是不够的,因为M到N之间数字的反序有可能是大于M或小于N的数字,例如M=2,N=20,那么19的反序91大于20,所以使用埃拉拖色尼算 ...

  7. java中<T> T和T的区别

    如果希望 getMax 方法的返回值类型为 T,就要这样去定义getMax方法: public T getMax() 如果希望 getMax 方法返回值的类型由调用者决定,那么就这么去定义 getMa ...

  8. SpringBoot中Application开启与关闭

    0.声明 缘由:没有学过或者没有经历SpringBoot的Application运行机制的话,一定会好奇,博主为啥会写一篇关闭开启的博文,是不是好幼稚?(/o(╥﹏╥)o),待我娓娓道来......为 ...

  9. AWT 新建窗口

    新建一个窗口 包 import java.awt.*; 定义 Frame frm_Draw = new Frame("Text"); 初始化代码 public void Frame ...

  10. gzip 压缩

    nginx 开启静态 gzip 配合 Vue 构建   在站点配置添加如下代码: location ~* \.(css|js)$ { gzip_static on; } 这是 nginx 的静态 gz ...