Introduction to some of the core approaches in jquery programming

The method of invoking a JQuery object is simple:

$ ( ' H1 ' ).remove();

Most jquery methods are called as above, and these methods are located within the $.fn namespace, which are called jquery object methods.

However, there are methods that do not need to depend on the result set of the selector, which is within the jquery namespace, which is called the jquery core approach. If you find it difficult to understand, remember the following two articles:

1. All JQuery selector methods are located within the $.fn namespace.
2. The methods in the $ are generally useful functional methods that do not depend on selectors, and the parameters and return values of these methods are very different.

Some object methods have the same name as the core methods, such as $.fn.each and $.each, which require extra attention when used.

There are a number of practical methods available in the JQuery $ namespace:

$.trim (' lots of extra whitespace ');

Return ' lots of extra whitespace '

Iterate over arrays and objects:

$.each ([' foo ', ' Bar ', ' baz '), function (idx, Val) {

Console.log (' element ' + idx + ' is ' + val);

});

$.each ({foo: ' Bar ', Baz: ' BIM '}, function (k, v) {

Console.log (k + ': ' + V);

});

Returns the index of an element in the array, or 1 if the element does not exist

var myArray = [1, 2, 3, 5];

if ($.inarray (4, MyArray)!==-1) {

Console.log (' found ');

}

To extend another object with one object:

var firstobject = {foo: ' Bar ', A: ' B '};

var secondobject = {foo: ' Baz '};

var newObject = $.extend (Firstobject, secondobject);

Console.log (Firstobject.foo); ' Baz '

Console.log (Newobject.foo); ' Baz '

If you do not want to change the value in the first object, pass in an empty object in the first argument of $.extend:

var firstobject = {foo: ' Bar ', A: ' B '};

var secondobject = {foo: ' Baz '};

var newObject = $.extend ({}, Firstobject, Secondobject);

Console.log (Firstobject.foo); ' Bar '

Console.log (Newobject.foo); ' Baz '

To change the scope of a function:

var myFunction = function () {console.log (this);};

var myObject = {foo: ' Bar '};

MyFunction (); Logs Window object

var myproxyfunction = $.proxy (myFunction, myObject);

Myproxyfunction (); Logs MyObject Object

To see how to change the scope of a function by combining events:

var myObject = {

Myfn:function () {

Console.log (this);

}

};

$ (' #foo '). Click (MYOBJECT.MYFN); Logs DOM element #foo

$ (' #foo '). Click ($.proxy (MyObject, ' myfn ')); Logs MyObject

JavaScript itself has a method of type detection, as well as jQuery, and does it better:

var myvalue = [1, 2, 3];

Use JavaScript's typeof operator to determine the type

typeof myvalue = = ' String '; False

typeof myvalue = = ' number '; False

typeof myvalue = = ' undefined '; False

typeof myvalue = = ' Boolean '; False

Use constant equals to detect null

MyValue = = = NULL; False

Use the JQuery method to determine the type

Jquery.isfunction (myvalue); False

Jquery.isplainobject (myvalue); False

Jquery.isarray (myvalue); True

Add additional data to the HTML element:

$ (' #myDiv '). Data (' KeyName ', {foo: ' Bar '});

$ (' #myDiv '). Data (' KeyName '); {foo: ' Bar '}

The data that you want to add can be any type:

$ (' #myList Li '). each (function () {

var $li = $ (this), $div = $li. Find (' div.content ');

$li. Data (' Contentdiv ', $div);

});

No need to look for those div again;

Can be read directly from the list

var $firstLi = $ (' #myList li:first ');

$firstLi. Data (' Contentdiv '). HTML (' new content ');

The method of invoking a JQuery object is simple:

?

1	$ ( ' H1 ' ).remove();

Most jquery methods are called as above, and these methods are located within the $.fn namespace, which are called jquery object methods.

However, there are methods that do not need to depend on the result set of the selector, which is within the jquery namespace, which is called the jquery core approach. If you find it difficult to understand, remember the following two articles:

1. All JQuery selector methods are located within the $.fn namespace.
2. The methods in the $ are generally useful functional methods that do not depend on selectors, and the parameters and return values of these methods are very different.

Introduction to some of the core approaches in jquery programming