Home > Web Front-end > JS Tutorial > Summary of jquery operation object array element methods (with case)

Summary of jquery operation object array element methods (with case)

php中世界最好的语言
Release: 2018-04-24 09:41:41
Original
2710 people have browsed it

This time I bring you jqueryOperationObjectArrayElement method summary (with case), jqueryNotes on operating object array elements What are they? The following is a practical case. Let’s take a look.

 <p id="p1">
     <span>a</span>
     <span>b</span>
     <span>c</span>
 </p>
Copy after login

1. Wrong way: You cannot use the [] method to get the jquery object array, as follows:

 $(function() {
     var p_span = $("#p1 span");
     for( var i = 0; i < p_span.length; i++ ) {
         p_span.[i].html(i);
     }
 });
Copy after login

This is invalid.

2.YesUse jquery's eq() method to select:

 for( var i = 0; i < p_span.length; i++ ) {
     p_span.eq(i).html(i);
 }
Copy after login

3. You canuse the each() method to traverse:

 $(function() {
     var p_span = $("#p1 span");
     var i = 0;
     p_span.each( function(){
         $(this).html(i);
         i++;
     });
 });
Copy after login

each() traverse When using $(this), you get the jquery object. If you use this directly, you get the DOM object

4. DOM object array obtained by pure js code , you can use [] to get array elements

The last three methods are correct, the first one is wrong, I put it first because I want to emphasize that it cannot be done in the future. If you make the same mistake again, friends, please watch carefully.

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

jquery’s method grep() implements array filtering

How jquery traverses arrays

The above is the detailed content of Summary of jquery operation object array element methods (with case). For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template