JQuery official learning materials: traversing JQuery objects and non-JQuery objects

 

• $. Each ()

Var sum = 0;Var arr = [1, 2, 3, 4, 5];For (var I = 0, l = arr. length; I <l; I ++ ){Sum + = arr [I];}Console. log (sum); // 15$. Each (arr, function (index, value ){Sum + = value;});Console. log (sum); // 15

Var sum = 0;Var obj = {Foo: 1,Bar: 2}For (var item in obj ){Sum + = obj [item];}Console. log (sum); // 3$. Each (obj, function (key, value ){Sum + = value;});Console. log (sum); // 3

// The following code is incorrect$. Each ($ ("p"), function (){});

 

• . Each ()

<Ul><Li> <a href = "#"> Link 1 </a> </li><Li> <a href = "#"> Link 2 </a> </li><Li> <a href = "#"> Link 3 </a> </li></Ul>$ ("Li"). each (function (index, element ){Console. log ($ (this). text ());});// Link 1// Link 2// Link 3

$ ("Li"). each (function (index, listItem ){This = listItem; // true$. Ajax ({Success: function (data ){// The context has changed.This! = ListItem; // true}});});

$ ("Li"). each (function (index, el ){$ (El). addClass ("newClass ");});$ ("Li"). addClass ("newClass ");

// Unable to run$ ("Input"). val ($ (this). val () + "% ");//. Val () cannot change the execution context, so here this = window$ ("Input"). each (function (I, el ){Var elem = $ (el );Elem. val (elem. val () + "% ");});

$ ("Input"). each (function (I, el ){Var elem = $ (el );Elem. val (elem. val () + "% ");});$ ("Input"). val (function (index, value ){Return value + "% ";});

 

• . Map ()

Var newArr = [];$ ("Li"). each (function (){NewArr. push (this. id );});$ ("Li"). map (function (index, element ){Return this. id;}). Get ();

 

• $. Map ()

<Li id = "a"> </li><Li id = "B"> </li><Li id = "c"> </li><Script>Var arr = [{Id: "",TagName: "li"},{Id: "B ",TagName: "li"},{Id: "c ",TagName: "li"}];// Return ["a", "B", "c"]$ ("Li"). map (function (index, element ){Return element. id;}). Get ();// Return ["a", "B", "c"]$. Map (arr, function (value, index ){Return value. id;});</Script>