jQuery过滤选择器:not()方法使用介绍

jQuery(':not(selector)')

在jQuery的早期版本中,:not()筛选器只支持简单的选择器,说明我们传入到:not这个filter中的selector可以任意复杂,比如:not(div a) and :not(div,a)


代码如下:

<p >"a">sdfsdfs</p>
<p >"b">sdfsdfs</p>
<p >"c">sdfsdfs</p>
$("p:not(.a)").css({"color":"red"})

那么除了class等于a的p元素外,其他的P的文字颜色就变成了红色.

:not()伪类过滤选择器,这叫法真拗口,jQuery的:not()方法是jQuery的伪类选择器,可以过滤不需要的元素,筛选出正确的结果,简单的说我们有如下代码:


代码如下:

$("selector1:not(selector2)")

我们分析下上面的代码,我们要获取selector1的元素,但可能我不需要全部,怎么办,通过:not()方法来过滤,如果selector1的集合中有#1,#2,#3,#4

我们的selector2就是要过滤掉#4，上面的代码我们最终将获得#1,#2,#3

再举几个列子


代码如下:

$(‘li:not(:only-child)')//匹配所有的li,除了只有一个子元素的
$(‘li:not(:first-child)');//匹配除了在他父元素中是第一个子元素的LI
$("li :not(:first)").hide();//隐藏除了第一个LI外的所有LI

赞 (0)

相关推荐

  • 使用jquery选择器如何获取父级元素、同级元素、子元素

    一.获取父级元素 1. parent([expr]): 获取指定元素的所有父级元素 复制代码 代码如下: <div id="par_div"><a id="href_fir" href="#">href_fir</a> <a id="href_sec" href="#">href_sec</a> <a id="href_thr&qu

  • jQuery Selector选择器小结

    //jQuery 选择器 $ //$(expression,[context]) return jQuery //Unit One //expression 之 CSS 定义符 就是以CSS语法表示所要选择的元素 // $("*"); // 表示页面所有元素标签 // $("th, td") // 表示所有<th><td>元素标签 // $("a") // 表示所有<a>元素标签 // $("div#

  • Jquery选择器中使用变量实现动态选择例子

    例子一: <table> <tr> <th>用户名</th> <th>状态</th> <tr> <tr> <td>张三</td> <td data-uid="10000">正常</td> <tr> <tr> <td>李四</td> <td data-uid="10001"

  • JQuery 选择器、过滤器介绍

    JQuery 选择器、过滤器介绍

    今日的学习再结合昨天的JavaScriptDOM的内容,让我对此十分清晰.JQuery原则:"write less, do more.",这句话已充分说明它对简化使用JavaScriptDOM编程的功力! 每位老师都有自己的教学方式,可能根据教授的内容的不同教学方式也有轻微的变化.老佟是一位非常有经验的软件教师,之前他在大连的软件公司做培训.经过多年的总结,他已经有自己一套成熟的教学方式.这个方式让我十分喜欢!至于是什么方式,你自己来体验吧!哈哈~~ 从学习JavaWEB.Struts

  • jquery 中多条件选择器,相对选择器,层次选择器的区别

    一.Jquery常用的过滤选择器如下所示: 1.:first,选取第一个元素,比如$("div:first")选取第一个div元素 2.:last,选取最后一个元素,比如$("div:last")选取最后一个div元素 3.:not(选择器),选取不满足"选择器"条件的元素,比如$("div:not(.className)"),选取样式不是className的所有div元素 4.:even/:odd,选取索引为偶数/奇数的元素

  • jQuery选择器之子元素过滤选择器

    本文实例为大家分享了jQuery子元素过滤选择器的具体代码,供大家参考,具体内容如下 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Untitled Document</title> <link rel="stylesheet" type="

  • jquery选择器-根据多个属性选择示例代码

    根据多个属性选择E[attr=val][attr=val] $("div[title='ttt'][class='aaaa']").click()................ 所有div元素下所有属性title值是等于ttt并且属性class等于aaaa的元素

  • Jquery颜色选择器ColorPicker实现代码

    Jquery颜色选择器ColorPicker实现代码

    在CMS中通常都有给标题添加颜色的功能,但一般都比较简单,颜色支持也少,这里我要分享一个自己修改的颜色选择器.界面简洁,功能强大.在我们的日常项目中可以快速的部署. 复制代码 代码如下: $(".colorpicker").colorpicker({ target:'#title', success:function(o,color){ $("#color").val(color) }, reset:function(o){ $("#color"

  • JQuery中$之选择器用法介绍

    1.$.在jQuery 中$("<span>"),这个语法等同于$(document.createElement("span")) ,这是一种用法,在选择元素的时候还会这样子的用:[attribute$=value],匹配给定的属性是以某些值结尾的元素.下面举个例子来说明一下: HTML代码 <input name="newsletter" /> <input name="milkman" /&g

  • jQuery过滤选择器:not()方法使用介绍

    jQuery(':not(selector)') 在jQuery的早期版本中,:not()筛选器只支持简单的选择器,说明我们传入到:not这个filter中的selector可以任意复杂,比如:not(div a) and :not(div,a) 复制代码 代码如下: <p >"a">sdfsdfs</p> <p >"b">sdfsdfs</p> <p >"c">sdf

  • jQuery过滤选择器详解

    jQuery过滤选择器详解

    过滤选择器 过滤选择器主要是通过特定的过滤规则来筛选出所需的 DOM元素,该选择器都以":"开头 按照不同的过滤规则,过滤选择器可以分为基本过滤,内容过滤,可见性过滤,属性过滤,子元素过滤和表单对象属性过滤选择器. 基本过滤选择器 基本过滤选择器示例 改变第一个 div元素的背景色为 # bbffaa 改变最后一个 div元素的背景色为 # bbffaa 改变class不为 one的所有 div元素的背景色为 # bbffaa 改变索引值为偶数的 div元素的背景色为 # bbffaa

  • jQuery过滤选择器用法示例

    jQuery过滤选择器用法示例

    本文实例讲述了jQuery过滤选择器用法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head&

  • jQuery过滤选择器经典应用

    本文实例为大家分享了经典的jQuery过滤选择器应用,供大家参考,具体内容如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>过滤选择器</title> <style type="text/css"> #txt_show {display:none; color:#00C

  • jQuery过滤选择器用法分析

    jQuery过滤选择器用法分析

    本文实例讲述了jQuery过滤选择器用法.分享给大家供大家参考.具体分析如下: 在实践中,可以在基本选择器的基础上添加过滤选择器来完成查询任务,根据具体情况,在过滤选择器中可以使用元素的索引值.内容.属性.子元素位置.表单 域属性以及可见性作为筛选条件 1. :first选择器 格式: 复制代码 代码如下: $("selector: first") 用于对当前jQuery集合进行过滤并选择出第一个匹配元素 实例: 复制代码 代码如下: $("td:first").c

  • jQuery层次选择器选择元素使用介绍

    复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- 1.层次选择器: 通过DOM元素间的层次关系获取元素,其主要的层次关系包括后代.父子.相邻.兄弟关系,通过其中基类关系可以方便快捷地定位元素 jQuery选择器详解 根据所获取页面中元素的不同,可以将jQuery选择器分为:基本选择器.层次选择器.过滤选择器.表单选择器四大类.其中,在过滤选择器中有可以分为:简单过滤选择器.

  • jQuery基本选择器选择元素使用介绍

    复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- 1.基本选择器:是jQuery中使用最频繁的选择器,它由元素Id.Class.元素名.多个选择符组成,通过基本选择器可以实现大多数页面元素的查找 jQuery选择器详解 根据所获取页面中元素的不同,可以将jQuery选择器分为:基本选择器.层次选择器.过滤选择器.表单选择器四大类.其中,在过滤选择器中有可以分为:简单过滤选择

  • jquery.ajax之beforeSend方法使用介绍

    常见的一种效果,在用ajax请求时,没有返回前会出现前出现一个转动的loading小图标或者"内容加载中..",用来告知用户正在请求数据.这个就可以用beforeSend方法来实现. 下载demo:ajax loading 代码如下: 复制代码 代码如下: function test_ajax(){    $.ajax(    {       type:"GET",//通常会用到两种:GET,POST.默认是:GET       url:"a.php&qu

  • jquery中的on方法使用介绍

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head>

  • jQuery 过滤not()与filter()实例代码

    第一种写法: 复制代码 代码如下: $(function(){ $("li").not(":even").css("color","red"); $("li").filter(":odd").css("color","red"); }) 第二种写法: 复制代码 代码如下: $(function(){ $("li").filter

随机推荐