Example of using the each () method in jQuery, jqueryeach

Source: Internet
Author: User

Example of using the each () method in jQuery, jqueryeach

This document describes the usage of the each () method in jQuery. Share it with you for your reference. The specific analysis is as follows:

This method can execute a function by matching each element in the element set as the context.

Each time a function is executed, the execution environment of the function is a DOM element that matches the Element Set and passes the element index to the function, the index value starts from 0. If the return value is false, it can be used to stop the loop operation early. If the return value is true, the function will continue to be executed until every element in the matching element is traversed.
The each () method is different from the jQuery. each () method. The each () method can only traverse JQuery objects, while the jQuery. each () method can traverse any objects.
Syntax structure:
Copy codeThe Code is as follows: $ (selector). each (function (index, element ))

Parameter List:

Parameters Description
Function (index, element) Each matching element defines the running method.
Index-optional. The index of the current context element in the Matching Element Set.
Element-optional. The current element (you can also use the "this" selector ).

Instance code:

Copy codeThe Code is as follows:
<! DOCTYPE html>
<Html>
<Head>
<Meta charset = "UTF-8">
<Meta name = "author" content = "http://www.bkjia.com/"/>
<Title> each () function-helper's house </title>
<Script type = "text/javascript" src = "mytest/jQuery/jquery-1.8.3.js"> </script>
<Script type = "text/javascript">
$ (Document). ready (function (){
$ ("# Btn"). click (function (){
$ ("Li"). each (function (index, element ){
Alert ($ (element). text ())
})
})
})
</Script>
</Head>
<Body>
<Ul>
<Li> background area </li>
<Li> foreground area </li>
<Li> database zone </li>
<Li> webmaster area </li>
</Ul>
<Button id = "btn"> click to view results </button>
</Body>
</Html>

The code above facilitates each element in the li element set and then returns the text in the li element.

I hope this article will help you with jQuery programming.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.