jquery based on the front end

JavaScript review:

<! DOCTYPE html>"en">"UTF-8"> <title></title> <script>window.onload=function () {varEles=document.getelementsbyclassname ("Item");  for(varI=0; i<eles.length;i++) {Eles[i].onclick=function (Event) {alert (123); }            }        }    </script>class="Item BTN"> Menu One </div> <divclass="Item"> Menu Two </div> <divclass="Item"> Menu Three </div></div></body>onclick Click event
Scope chain
<! DOCTYPE html>"en">"UTF-8"> <title></title> <script>function Bar (age) {Console.log (age);//age=function            varAge = About; varsex='male';            Console.log (age); Function age () {alert (123);            } console.log (age); return  -; } result=bar (5); </script>Scope Chain
Output: Function age () {                alert (123);            }  About  About
<! DOCTYPE html>"en">"UTF-8"> <title></title>"Jquery-3.2.1.js"></script> <script>        $("P"). CSS ("Color","Red"); Console.log ($ ("P")[0].innertext);//InnerText is a property of a DOM object        varEle=document.getelementbyid ("ID");//find it by ID.        var$ele =$ ("P");//jquery Object</script></body>jquery Object
Output PPPPPPP
<! DOCTYPE html>"en">"UTF-8"> <title></title>"P2">pp</p><pclass="P3">ppp</p><div>div</div><divclass="outer"> <p>PPP</p> <divclass="Inner"> <p>PPPPPP</p> </div> <p>ppppppppppppppppppp</p></div><a href="">click</a><p>bingabcd</p><script src="Jquery-3.2.1.js"></script><script>//Basic Selector$("*"). CSS ("Color","Red");//all label values change to Red $ ("*")$("#p2,. P3"). CSS ("Color","Red");//The value of the label for the specified ID becomes red $ ("#id")$(". Outer,.inner"). CSS ("Color","Red");//$ (". Class")//Hierarchy Selector$(". Outer P"). CSS ("Color","Red");//descendant Selector$(". Outer>p"). CSS ("Color","Red");//descendant Selector$(". Outer+p"). CSS ("Color","Red");//adjacent Brother selector$(". Outer~p"). CSS ("Color","Red");//Ordinary brother selector</script></body>jquery basic selector and Hierarchy selector
jquery Filter, property selector, form selector
<! DOCTYPE html>"en">"UTF-8"> <title></title> <style> </style>class="Item">111</li> <liclass="Item">222</li> <liclass="Item">333</li> <liclass="Item">444</li> <liclass="Item">555</li></ul><div alex="SB">alex</div><div alex="SBB">alex</div><input type="text"Value="123"><input type="Password"Value="123"><script src="Jquery-3.2.1.js"></script><script>//JavaScript for Loop traversal    varEles=document.getelementsbyclassname ("Item");  for(varI=0; i<eles.length;i++) {Eles[i].style.color="Red"; }    //Filter$("ul. Item"). CSS ("Color","Red");//take all elements of class= "item" and turn red$("ul. Item:first"). CSS ("Color","Red");//take the first one, turn red.$("ul. Item:last"). CSS ("Color","Red");//take the last one .$("ul. Item:eq (2)"). CSS ("Color","Red");//take the element labeled 2 to turn red$("ul. Item:even"). CSS ("Color","Red");//take an element labeled an even number to turn red$("ul. item:odd"). CSS ("Color","Red");//take an element with an odd-numbered element and turn it red$("ul. ITEM:GT (2)"). CSS ("Color","Red");//take element subscript greater than 2 to turn red$("ul. ITEM:LT (4)"). CSS ("Color","Red");//take element subscript less than 4 to turn red//Property Selector$("[alex= ' SB ']"). CSS ("Color","Red"); //form selector: $ (": text)$("[type= ' text ']"). CSS ("Border","3px Solid Red"); $(": Text"). CSS ("Border","3px Solid Red")</script></body>jquery filters, property selectors, and hierarchy selectors
jquery based on the front end