Jquery basic notes (all)

Jquery basic notes (all)

Var x = 42; console. log (x); var message = (function (x) {return function () {console. log (x is + x) ;}}) (x); message (); x = 12; console. log (x); message (); -------------------- p47 self-executed anonymous function () // object p42 $. extend (obj1, obj2, obj3) // merge $. extend ({}, obj) // copy $. extend (true, {}, obj) // deep copy // array $. makeArray (obj); // array for object conversion $. inArray (); // specifies whether a value exists in the array;-1 $ is returned if no value exists. unique (); // remove the repeated element obj1.concat (obj2) from the element group of the DOM element. // The obj2 array is connected to the ob J1 array var numArray = [1, 2, 3, 4]; $. each (numArray, function (index, value) {value = value * 2; console. log (index is: + index + new value is: + value) ;}); // traversing each is similar to map $. each (array, callback function); // The first parameter of the callback function is the index and the second element value $. map (array, callback function); // The first parameter of the callback function is the element value and the second index. // $. queue () queue first-in-first-out, $. queue (function () {$ (this ). push (obj); $ (this ). pop (obj); $ (this ). clearQueue (); // clear all functions $ (this ). dequeue (); // remove a function and execute it}) // $. contains (container node, target node) // container Whether the node is a subnode of the target node // $. now (); current time = (new Date ). getTime () // if ($. support. ajax) {}// check whether the browser supports ajax requests ,. support () // eval () executes arbitrary js Code, and eval () executes local context // $. globalEval () executes the global context // chain operation p72 // attribute selector p85 $ ([attributeName = 'string2match']); $ ([attributeName ^ = 'str']); // match all elements starting with 'str' $ ([attributeName $ = 'str']); // match all elements ending with 'str' $ ([attributeName * = 'str']); // contains all elements of str $ ([attributeName ~ = 'Str']); // contains all elements of str (including spaces, for example, xxx str) // duplex attribute selector var n =$ (form [name $ = 'office1 '] form [name ^ = 'admin']). length; // position selector $ (li: even) // returns an even number of Members. 0 is also an even number of li: odd // an odd number of li: first // The first element li: last // The last li: eq (3) // returns the fourth li: gt (2) // returns all elements that match the SET index greater than 2 li: lt (3) // less than 3 // filter selector: animated // select all the elements of the animation being executed: header // select all the title elements such as h1, h2, h3: not // select the element that does not match the selector // filter the form Element $ (function () {var n1 = $ (input ). length; // all elements of xuaninput var n2 =$ (: input ). length; // contains all elements of dom (input, textarea, select, button) var n3 =$ (form> *). length; // all elements in the form var n4 =$ (: text ). length; // The property is all var n5 =$ (input [type = 'text']). length; // The property is text for all consoles. log (n1 +, + n2 +, + n3 +, + n4 +, + n5 );});

// Visibility filter jquery determines whether an element is visible Based on the offsetWidthoffsetHeight attribute of the element. If both attributes are 0, jquery considers the element to be hidden, and the element style is display: block and display: none jquery detects these $ (function () {var numInv = $ (: text: hidden ). length; // All hidden var numVis =$ (: text: visible ). length; // all visible consoles. log (numInv); // 1 console. log (numVis); // 1 });// Content filter: contains () $ (function () {var jennies =$ (p: contains ('jenny ')). length; console. log (jennies); // returns 2 });

Jenny smith

Jennyjones

Jim bob

//: Has () $ (function () {var jennies =$ (p: contains ('jenny ')). length; console. log (jennies); // returns 2 var hasdoemo =$ (div: has ('P ')). attr (id); // The child element of the element must contain at least one console element that matches the specified selector. log (hasdoemo); // lt });

Jenny smith

Jennyjones

Jim bob

Afdfd // does not contain any content: empty () $ (function () {var nothing = $ (p: empty ). length; console. log (nothing); // returns 1}); div>

 

Something here

//: Parent () selects the element with sub-elements $ (function () {console. log ($ (div: parent ). attr (id); // gt}); afdfd

Jenny smith

Jennyjones

Jim bob

/// Filter by link <script >$ (function () {console. log ($ (div span: first-child) // select the first of each parent element. // [span # turkey, span # bear, span # martian] console. log ($ (div span: last-child) // select the last one of each parent element // [span # hawk, span # horse, span # martian] console. log ($ (div span: only-child) // select each parent element to be unique. // [span # martian] console. log ($ (div span: nth-child (2) // the nth number of each parent element // [span # chicken, span # rabbit] console. log ($ (div span: nth-child (2n + 1) // n = 0 ..... n // [span # turkey, span # parrot, span # hawk, span # bear, span # fox, span # horse, span # martian] console. log ($ (div span: nth-child (even) // [span # chicken, span # pigeon, span # rabbit, span # monkey]}); </script> Turkey Chicken Parrot Pigeon Hawkbear rabbit fox monkey horsemartian // User-Defined selector <script >$ (function () {// Define custom filter by extending $. expr [:] $. expr [:]. greenbg = function (element) {return condition (element).css (background-color) === green ;}; var n =$ (: greenbg ). length; console. log (There are + n + green divs) ;}); </script> // event // bind (), unbind (), live (), die (); delegate (), undelegate () // an element that does not exist is bound to an event handler p121 bind. The difference between live // live and delegate is generated during runtime, delegate can be linked to call //. one () Time Processing once //. trigger ("click") matches all click events for parallel execution //. triggerHandler (click) matches the click Event and executes the first matching event. processing is not bubbling //. on (func ),. off (func) can completely replace the previous live, bind, delegate Methods // p154 and then study modernizr datalink // $. offset () // locate the element relative to the document, return the css object, and study p159 // $. position () // element relative to parent container element positioning // difference between visibility and display visibility: hidden exists in the document stream, and display: none does not exist // e. stopPropagation (); // stop events // slideUp, slideDown (fast, xx, callback); // p162 $ (function () {$ (div # message ). click (function (e) {e. stopPropagation (); console. log ($ (div # message ). width () ++ $ (div # message ). height (); // $ (div # message ). slideUp ('fast '); $ (div # message ). fadeIn () ;}); $ (document ). click (function () {// $ (div # message ). slideDown ('fast '); $ (div # message ). fadeOut () ;}); // $ (function () {$ (document ). click (function (event) {$ (div # box ). animate ({left: '+ = 100px' // note}, 200 );});});