One of jquery learning object access_jquery

For more information about how to sort out objects in jquery learning, see. Each ()

Each (callback)

Execute a function using each matching element as the context. This means that each time the passed function is executed, the this keyword in the function points to a different DOM element (each time it is a different matching element ).

In addition, each time a function is executed, a numeric value indicating the position of the element used as the execution environment in the matched element set is passed to the function as the parameter (an integer starting from scratch ).

If 'false' is returned, the loop is stopped (just like using 'Break' in a normal loop '). Return 'true' to jump to the next loop (just like using 'contine' in a normal loop '). Execute a function within the context of every matched element. this means that every time the passed-in function is executed (which is once for every element matched) the 'eas' keyword points to the specific DOM element.

Additionally, the function, when executed, is passed a single argument representing the position of the element in the matched set (integer, zero-index ).

Returning 'false' from within the each function completely stops the loop through all of the elements (this is like using a 'Break' with a normal loop ). returning 'true' from within the loop skips to the next iteration (this is like using a 'contine' with a normal loop ). return Value

JQuery

Parameters

Callback(Function): the Function to be executed for each Matching Element

Example

Iterate two images and set their src attributes. Note: this indicates a DOM object instead of a jQuery object.

HTML code:

JQuery code:

$ ("Img"). each (function (I ){
This. src = "test" + I + ". jpg ";
});

Result:

[,]

If you want to get a jQuery object, you can use the $ (this) function.

JQuery code:

$ ("Img"). each (function (){
$ (This). toggleClass ("example ");
});

You can use 'Return 'to jump out of the each () loop in advance.

HTML code:

Change colors 
 
 
Stop here
 

JQuery code:

$("button").click(function () { $("p").each(function (index, domEle) {  // domEle == this  $(domEle).css("backgroundColor", "yellow");  if ($(this).is("#stop")) {  $("span").text("Stopped at p index #" + index);  return false;  } });});

The number of elements in the semi-size () jQuery object. The return value of this function corresponds' Length'Attributes are consistent. The number of elements in the jQuery object. This returns the same number as' Length'Property of the jQuery object. Return Value

Number

Example

Calculate the number of all images in the document

HTML code:

JQuery code:

$ ("Img"). size ();

Result:

2. The number of elements in the ------------------------------------------------------------------------------------------------------------------------- lengthjQuery object. Number of matched elements. SizeReturns the same value. The number of elements in the jQuery object. The number of elements currently matched. SizeFunction will return the same value. return value

Number

Example

Calculate the number of all images in the document

HTML code:

JQuery code:

$ ("Img"). length;

Result:

2 bytes -------- get ()

Obtains a set of all matched DOM elements.

This is a backward compatible method for obtaining all matching elements (different from jQuery objects, but actually element arrays ).

This function is very useful if you want to directly operate DOM objects instead of jQuery objects.

Access all matched DOM elements. this serves as a backwards-compatible way of accessing all matched elements (other than the jQuery object itself, which is, in fact, an array of elements ). it is useful if you need to operate on the DOM elements themselves instead of using built-in jQuery functions. return Value

Array

Example

Select All images in the document as element arrays and use the built-in reverse Method to reverse the array.

HTML code:

JQuery code:

$ ("Img"). get (). reverse ();

Result:

[] Condition -------- get (index) gets a matching element. Num 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. Access a single matched DOM element at a specified index in the matched set. this allows you to extract the actual DOM element and operate on it directly without necessarily using jQuery functionality on it. this function called as $ (this ). get (0) is the equivalent of using square bracket notation on the jQuery object itself like $ (this) [0]. return Value

Element

Parameters

Index(Number): gets the element at the index position.

Example

HTML code:

JQuery code:

$ ("Img"). get (0 );

Result:

[] Items -------- index (subject) searches for elements that match the object indicated by the parameter and returns the index value of the corresponding element. If a matching element is found, return from 0; if no matching element is found, return-1. Searches every matched element for the object and returns the index of the element, if found, starting with zero. Returns-1 if the object wasn' t found. Return Value

Number

Parameters

Subject(Element): the object to be searched

Example

Returns the index value of an element whose ID is foobar.

HTML code:

JQuery code:

$ ("*"). Index ($ ('# foobar') [0])

Result:

5