Differences and usage of eq and get operations on jquery objects in jQuery -- a powerful tool for foreground display operations

Differences and usage of eq and get operations on jquery objects in jQuery -- a powerful tool for foreground display operations

: The eq () selector selects an element with the specified index value.

The index value starts from 0, and the index value of all the first element is 0 (not 1 ).

Get (index) gets a matching element. Index indicates the number of matched elements.

This allows you to select an actual DOM element and operate on it directly, instead of using the jQuery function. $ (This). get (0) is equivalent to $ (this) [0.

The following is a simple code:

<script type="text/javascript" src="http://u.myxzy.com/jquery/jquery-1.7.1.js"></script> <script> $("document").ready(function(){        alert($("li:eq(0)"));       alert($("li").get(0));}) </script> 
 
 
  
  
  
Li-1
  
  
  
Li-2
 
 

The result is:

The returned results are: [object Object] and [object HTMLLIElement].

Eq returns a jquery object and get returns an array of html objects.

Use eq to obtain the color value of the first li Tag:

$ ("Li" ).eq(0).css ("color") // Since eq (num) returns a jq object, you can use the jq method css

Use get to obtain the color value of the second li Tag:

$ ("Li "). get (1 ). style. color // because get (num) returns an html object, it is useless to use the traditional HTML object method.

Of course, you can also get (num) and convert the object into the jq object before performing the operation:

$ ("Li" ).get(1)).css ("color ")

However, we know that, for example, for the eqreturned jqueryobject, we can directly use jqueryobjects such as .css(),.html (), and get returns the html array object using the traditional HTML object method or converting it to a jquery object before performing operations.

NOTE: It can achieve the same effect, so it is recommended to use eq in a unified manner, without worrying about the differences between them or anything.

<script type="text/javascript" src="http://u.myxzy.com/jquery/jquery-1.7.1.js"></script><script>$("document").ready(function(){$("li:eq(0)").css("color",'red');$("li").eq(1).css("color",'blue');$("li").get(2).style.color='green';$($("li").get(3)).css("color",'yellow');})</script>
 
 

  
  
li-1
  
  
li-2
  
  
li-3
  
  
li-4