jquery eq and get use method

Source: Internet
Author: User

$ ("P:eq (1)") Try It Yourself
Definitions and usage
: the EQ () selector selects the element with the specified index value.

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

Often used with other elements/selectors to select elements of a specific ordinal in a specified group, such as the example above.

Grammar
$ (": EQ (Index)") parameter description
Index required. The index value of the specified element.

<!doctype html> div {width:60px; height:60px; margin:10px; float:left;
BORDER:2PX solid blue; }
. blue {Background:blue;}
</style>
<script src= "Http://code.jquery.com/jquery-1.5.js" ></script>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<script>
$ (' body '). Find ("div"). EQ (2). addclass ("Blue"); </script> </body>

Effect chart

<p style= "Color:yellow" > Fei rain </p> use EQ to get the color value of the first P tag:
$ ("P"). EQ (0). CSS Tutorial ("COLOR")//Because EQ (num) Returns a JQ object, you can use the JQ method css to get the color value of the first P tag:

jquery get

$ ("P"). Get (0). Style.color//Because getting (num) returns an HTML object, the JQ object is useless at this time using the traditional HTML object method. Of course, you can also convert objects to JQ objects after get (num):
$ ($ ("P"). Get (0)). CSS ("color")--------------------------------------------------------------------------
More EQ
See
http://api.jquery.com/eq/
--------------------------------------------------------------------------
More get:
See
http://api.jquery.com/get/
EQ: Return is a jquery object function is to reduce the set of matched elements to one element. The position of this element in the set of matching elements becomes 0, and the set length becomes 1.
Get: is an HTML object array function is to obtain one of the matching elements. Num represents the acquisition of the first few matching elements.

such as: HTML code
Copy code code as follows:

<ul>
<li>li-1</li>
<li>li-2</li>
</ul>

For example, we go through the jquery selector $ ("li") then we will have two Li elements how do I just want to choose one?

$ ("Li:eq (0)"). HTML () or $ ("li"). EQ (0). HTML () is the first Li here we will get li-1
$ ("Li:eq (1)"). HTML () or $ ("li"). EQ (1). HTML () is the second Li here we will get li-2

Let's take a look at get because the get return is an HTML object so we're here
$ ("Li"). Get (0). style.color= ' Red '
The only way to use or convert a Get return object to a jquery object is to manipulate
$ ($ ("Li"). Get (0)). CSS ("Color", ' red ')

Complete code
Copy code code as follows:

<!doctype HTML PUBLIC "-//W3C//DTD HTML 4.0 transitional//en" >
<title> New Document </title>
<meta http-equiv= "Content-type" content= text/html; F-8 "/>
<script language=" Web Effects "src=" Js/jquery.js "></script>
<script" JavaScript " >
<!--
$ ("document"). Ready (function () {
Alert ($ ("Li:eq (1)"). html ());//Display Li-2 alert ($ ("Li:eq (0)" ). HTML ())
$ ("Li"). Get (0). style.color= ' Red ';
$ ($ ("Li"). Get (1)). CSS ("Color", ' Red ')
}
//-->
</script>
<body>
<ul>
<li>li-1</ Li>
<li>li-2</li>
</ul>
</body>

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.