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. Vue.js指令实例

    v-if  v-else  v-show v-if 根据表达式的值的真假条件渲染元素. v-else 不需要表达式.前一兄弟元素必须有 v-if 或 v-else-if v-show 根据表达式之真假 ...

  2. Ubuntu shutdown

    gsettings set com.canonical.indicator.session suppress-logout-restart-shutdown true

  3. HTTP简明学习

    前面的话 本文将详细介绍HTTP主要内容 概述 Web 的诞生,源于三大技术的诞生,它们都是当年 Web 之父 Tim Berners-Lee 自己 开发的,世界上第一个网站诞生的时间是 1991 年 ...

  4. Windows Linux的cmd命令查询指定端口占用的进程并关闭

    以端口8080为例: Windows  1.查找对应的端口占用的进程:netstat  -aon|findstr  "8080",找到占用8080端口对应的程序的PID号: 2.根 ...

  5. PKUWC2019爆0记

    PKUWC2019爆0记 访问量该骗的还是要骗. 1.20 坐了一天的高铁到jz了,热的一批 1.21 上午开营仪式 下午day1 打开发现有个地主斗 然后开T1 出题人你™搞笑吧放一道sb都能切的题 ...

  6. Python:正则表达式详解

    正则表达式是一个很强大的字符串处理工具,几乎任何关于字符串的操作都可以使用正则表达式来完成,作为一个爬虫工作者,每天和字符串打交道,正则表达式更是不可或缺的技能,正则表达式的在不同的语言中使用方式可能 ...

  7. 存在多个 AJAX 任务

    实现的效果: 这两个Ajax任务可同时实现,也可单独实现. 标准的函数: var xmlhttp; function loadXMLDoc(url,ufunc){ if(window.XMLHttpR ...

  8. 如何解决Angular网页内嵌推特时间线无法正常显示

    我最近解决了一个折磨了我好久但是解决方法却只是添加两三行代码的问题.我没有在网上找到合适的解决方案,最后是我根据官方网站和很多的帖子里的部分代码得到的启发,尝试了很久之后得到的解决方法.因为过程实在是 ...

  9. 工厂方法模式-Factory Method(Java实现)

    工厂方法模式-Factory Method 工厂方法模式定义一个用于创建对象的接口,让子类决定实例化哪一个类.工厂方法让实例化的具体内容交给子类工厂来进行. 本文中的例子是这样的. 生产一个身份证, ...

  10. SpringBoot系列: CommandLineRunner接口的用处

    ========================================使用 CommandLineRunner 对Spring Bean进行额外初始化==================== ...