Summary of jQuery syntax and precautions_jquery

element. There are two methods:


4. The same function implements set and get

Many methods in Jquery are like this, mainly including the following:



Similarly blur, focus, select, submit events can have these two calling methods

5. Collection processing function

For the collection contents returned by jquery, we do not need to loop through and process each object separately. jquery has provided us with a very convenient method to process the collection.
Including two forms:

6. Expand the functions we need

Use the extended method (called through "$.method name") ：

alert("a=10,b=20,max=" $.max(10,20) ",min=" $.min(10,20));

7. Supports continuous writing of methods
The so-called continuous writing means that you can continuously call various methods on a jquery object.

For example:

8. Style of operating elements

Mainly include the following methods:

9. Complete event processing function

Jquery has provided us with various event processing methods. We do not need to write events directly on html elements, but can directly process them through jquery The obtained object adds an event.
For example:

Several customizations in jQuery Defined events:

(1) hover(fn1,fn2): A method that simulates hover events (the mouse moves over an object and out of the object). When the mouse moves over a matching element, the first specified function will be triggered. When the mouse moves out of this element, the specified second function will be triggered.

(2) ready(fn): Bind a function to be executed when the DOM is loaded and ready for query and manipulation.


(3) toggle(evenFn,oddFn): Switch the function to be called each time it is clicked. If a matching element is clicked, the first function specified is triggered, and when the same element is clicked again, the second function specified is triggered. Each subsequent click repeats the call to these two functions in turn.

(4) trigger(eventtype): Trigger a certain type of event on each matching element.
For example:
$("p").trigger("click"); //Trigger click events for all p elements

(5) bind(eventtype,fn), unbind(eventtype ): Binding and unbinding of events
Remove (add) the bound event from each matching element.
For example:



10. Several practical special effects functions

The toggle() and slidetoggle() methods provide state switching functions.
For example, the toggle() method includes hide() and show() methods.
The slideToggle() method includes the slideDown() and slideUp methods.

11. Several useful jQuery methods

$.browser. Browser type: Detect browser type. Valid parameters: safari, opera, msie, mozilla. For example, if you check whether it is IE: $.browser.isie, if it is an IE browser, it will return true.
$.each(obj, fn): General iteration function. Can be used to iterate over objects and arrays approximately (instead of looping).
Such as
$.each( [0,1,2], function(i, n){ alert( "Item #" i ": " n ); });

Equivalent In:

You can also process json data, such as
$.each( { name: "John", lang: "JS" }, function(i, n){ alert( "Name: " i ", Value: " n ); });

The result is:
Name:name, Value:John
Name:lang, Value:JS
$.extend(target,prop1,propN): Use Extend an object with one or more other objects and return the extended object. This is the inheritance method implemented by jquery.
For example:
$.extend(settings, options);
//Merge settings and options, and return the merged result to settings, which is equivalent to options inheriting setting and saving the inherited result in setting.
var settings = $.extend({}, defaults, options);
//Merge defaults and options, and return the merged result to the setting without overwriting the default content.
Can have multiple parameters (combine multiple parameters and return)

$.map(array, fn): array mapping. Saves the items in an array (after processing the transformation) into a new array and returns the resulting new array.
For example:
var tempArr=$.map( [0,1,2], function(i){ return i 4; });
The content of tempArr is: [4,5,6]
var tempArr=$.map( [0,1,2], function(i){ return i > 0 ? i 1 : null; });
The content of tempArr is: [2,3]
$.merge(arr1,arr2): Merge two arrays and delete duplicate items.
For example:
$.merge( [0,1,2], [2,3,4] ) //Return [0,1,2,3,4]

$. trim(str): Remove whitespace characters at both ends of the string.
For example:
$.trim(" hello, how are you? "); //Return "hello, how are you? "

12. Solve the problem with custom methods or other class libraries Conflicts with jQuery

Many times we define the $(id) method ourselves to get an element, or some other js libraries such as prototype also define the $method. If we put these contents together at the same time, Will cause variable method definition conflict, Jquery provides a special method to solve this problem.
Use the jQuery.noConflict(); method in jquery to transfer control of the variable $ to the first library that implements it or the previously customized $ method. When using Jquery later, just replace all $ with jQuery. For example, the original reference object method $("#msg") is changed to jQuery("#msg").
For example:
will pop up