search
HomeWeb Front-endJS TutorialjQuery filter not() and filter() example code_jquery

The first way to write:
Copy the code The code is as follows:

$ (function(){
$("li").not(":even").css("color","red");
$("li").filter(":odd" ).css("color","red");

})

The second way of writing:
Copy code The code is as follows:

$(function(){
$("li").filter(function(index ) {
return index%2 == 0;
}).css("color","red");

$("li").not(function(index) {
return index%2 !== 0;
}).css("color","red");
})

Both of these writing methods can be used To achieve the same effect, not and filter are opposite filters!

jQuery filter selector:not() method introduction

jQuery(':not(selector)')
In earlier versions of jQuery, the :not() filter only supports A simple selector means that the selector we pass into the :not filter can be arbitrarily complex, such as: not(div a) and :not(div,a)

"a" >sdfsdfs


"b">sdfsdfs


"c">sdfsdfs



$ ("p:not(.a)").css({"color":"red"})
Then except for the p element whose class is equal to a, the text color of other P will become red.
:not() pseudo-class filter selector. This name is really hard to pronounce. jQuery’s :not() method is jQuery’s pseudo-class selector. It can filter out unnecessary elements and filter out the correct results. Simply put, we There is the following code:

$("selector1:not(selector2)")
Let’s analyze the above code. We want to get the elements of selector1, but maybe I don’t need them all. What should I do? Pass: not() method to filter, if there are #1, #2, #3, #4 in selector1's collection
Our selector2 is to filter out #4. With the above code, we will eventually get #1, #2, #3
A few more examples

$('li:not(:only-child)')//Match all li except
$('li which has only one child element :not(:first-child)');//Match LI
$("li :not(:first)").hide();// Hide all LI except the first LI
Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
解决“[Vue warn]: Failed to resolve filter”错误的方法解决“[Vue warn]: Failed to resolve filter”错误的方法Aug 19, 2023 pm 03:33 PM

解决“[Vuewarn]:Failedtoresolvefilter”错误的方法在使用Vue进行开发的过程中,我们有时候会遇到一个错误提示:“[Vuewarn]:Failedtoresolvefilter”。这个错误提示通常出现在我们在模板中使用了一个未定义的过滤器的情况下。本文将介绍如何解决这个错误并给出相应的代码示例。当我们在Vue的

Springboot中filter的原理与注册方法是什么Springboot中filter的原理与注册方法是什么May 11, 2023 pm 08:28 PM

1、filter先看下web服务器的filter所处的位置。filter是一个前后连接的链,前面处理完成之后传递给下一个filter处理。1.1filter的接口定义publicinterfaceFilter{//初始化方法,整个生命周期中只执行一次。//在init方法成功(失败如抛异常等)执行完前,不能提供过滤服务。//参数FilterConfig用于获取初始化参数publicvoidinit(FilterConfigfilterConfig)throwsServletException;//

Filter在java中如何过滤Filter在java中如何过滤Apr 18, 2023 pm 11:04 PM

说明1、如果Lambda参数生成true值,则filter(能够生成boolean结果的Lambda)将生成元素;2、生成false时,就不再使用此元素。实例创建一个List集合:ListstringCollection=newArrayList();stringCollection.add("ddd2");stringCollection.add("aaa2");stringCollection.add("bbb1");stringC

CSS 模糊属性详解:filter 和 backdrop-filterCSS 模糊属性详解:filter 和 backdrop-filterOct 20, 2023 pm 04:48 PM

CSS模糊属性详解:filter和backdrop-filter导语:在设计网页时,我们常常需要一些特效来增加页面的视觉吸引力。而模糊效果是其中一种常见的特效之一。CSS提供了两种模糊属性:filter和backdrop-filter,它们分别用于对元素内容以及背景内容进行模糊处理。本文将详细介绍这两个属性,并提供一些具体的代码示例。一、filt

CSS 视觉属性解析:box-shadow,text-shadow 和 filterCSS 视觉属性解析:box-shadow,text-shadow 和 filterOct 20, 2023 pm 12:51 PM

CSS视觉属性解析:box-shadow,text-shadow和filter引言:在网页设计和开发中,使用CSS可以为元素添加各种视觉效果。本文将重点介绍CSS中的box-shadow,text-shadow和filter这三个重要属性,包括其使用方法和效果展示。下面我们分别详细解析这三个属性。一、box-shadow(盒子阴影)box-shado

Java 8中的Optional类:如何使用filter()方法过滤可能为空的值Java 8中的Optional类:如何使用filter()方法过滤可能为空的值Aug 01, 2023 pm 05:27 PM

Java8中的Optional类:如何使用filter()方法过滤可能为空的值在Java8中,Optional类是一个非常有用的工具,它允许我们更好地处理可能为空的值,避免了NullPointerException的发生。Optional类提供了许多方法来操作潜在的空值,其中一个重要的方法是filter()。filter()方法的作用是,如果Option

Vue中如何利用filter对数据进行格式化和处理Vue中如何利用filter对数据进行格式化和处理Oct 15, 2023 pm 03:50 PM

Vue中利用filter对数据进行格式化和处理在Vue中,我们可以通过使用filter来对数据进行格式化和处理。Filter是一种可以在模板中直接调用的函数,它可以对要显示的数据进行处理并返回处理后的结果。在本文中,我们将介绍如何使用filter来格式化和处理数据,并提供具体的代码示例。注册filter在Vue实例中,我们需要先注册一个filter,以便在模

怎么在SpringBoot2中整合Filter怎么在SpringBoot2中整合FilterMay 16, 2023 pm 02:46 PM

首先定义一个统一访问URL拦截的Filter。代码如下:publicclassUrlFilterimplementsFilter{privateLoggerlog=LoggerFactory.getLogger(UrlFilter.class);@OverridepublicvoiddoFilter(ServletRequestrequest,ServletResponseresponse,FilterChainchain)throwsIOException,ServletException{H

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
Repo: How To Revive Teammates
4 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: How To Get Giant Seeds
4 weeks agoBy尊渡假赌尊渡假赌尊渡假赌

Hot Tools

PhpStorm Mac version

PhpStorm Mac version

The latest (2018.2.1) professional PHP integrated development tool

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.

SublimeText3 English version

SublimeText3 English version

Recommended: Win version, supports code prompts!

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)