Today, I will introduce a new method, is(). It seems that this method is not very popular. Here’s a taste of this approach.

Function Description: Checks whether the element in the currently matched element set is a selector, DOM element, or jQuery object, and returns true if at least one of these elements matches the given parameter.

The method accepts four parameter types, which are described below

Jquery. is(selector)

Selector: A string containing a selector expression used to match elements.

This method has already been used in my previous article. You can see it in jQuery Filter Map ().

JQuery. Is (function(index))

Function (index) : A function that tests the elements in the collection. It takes a single parameter, index, which is the index position of the element in the jQuery collection. In the function, this refers to the current DOM element.

This seems not to know what to say, but let’s use a code example to illustrate, 23333……..

<! - HTML - > < ul > < li > web front-end < / li > < li > dream blue < / li > < li > web - 7258 < / li > < / ul > <! -- js --> var isLength=$("ul").is(function () { return $(this).children("li").length==3; }); console.log(isLength); //trueCopy the code

In fact, this formal method is not a selector in terms of function representation. .is() returns true if the function returns true, otherwise it does the opposite. This is a good option if you have a lot of judgment, as long as the result is returned.

Jquery.is (jQuery Object)

JQuery Object: An existing jQuery object to match the current element.

It’s important to pay attention. This is a very nice approach, and if you’re a good front-end developer who cares about performance, you’ve probably thought about it.

Suppose the current requirements are as follows: there is currently a list without any special identification. Then dynamically add N identical list elements before and after this element. When I click to start the default list element, I need to execute the corresponding code.

The above requirement becomes quite tricky without adding a special identity to the default list in all sorts of unknown situations. There are two problems: (1) it is not known where the current element is already in the list; (2) How many unknown lists can be added. For performance improvement, adding events to the list container element can minimize the creation of multiple event listeners.

Now it’s time for **is()** to play its part.

<! -- js --> var primaryLi=$("ul>li:eq(1)"); $("ul").on("click",">li",function () { if($(this).is(primaryLi)){ alert($(this).html()); // The blue of dreams}});Copy the code

The original HTML structure remains the same, first fetching the currently known element, then fetching the original element via the is() method when the click event is triggered.

JQuery. Is (element)

Element: THE DOM element used to match elements.

The fourth way is basically the same as the third way, directly to the code

<! -- js --> var li0=document.getElementsByTagName("li")[0]; $("ul").on("click",">li",function () { if($(this).is(li0)){ alert($(this).html()); // Web front-end}});Copy the code

As long as the is() method is used properly, this method is very useful, I recommend you to try this method, you will not be disappointed!

Author: Huanghe Ailang QQ: 1846492969, email: [email protected]

This article is original, copyright belongs to the author, please indicate the original link and source.

​