jQuery Preliminary (Basics)

 

jQuery all properties and functions are defined jQueryunder this article, it makes you will not use the jQuery library and conflict with other namespaces had some global variables and so on. In addition, to obtain jQuery objects, you can also use another abbreviation symbol alias (alias) provided by it-money font size $. At this time, you may ask what if I use other JavaScript libraries and use "$"? There is a way to solve it with the following line:

jQuery.noConflict();

Then you can continue to use $ to manipulate the functions you originally have. But what if you still want to use $ to manipulate jQuery? There are also tricks:

(function($) {
  // In this block we use $ to refer to the jQuery object
  // Using $ in this block will not conflict with other functions
})(jQuery);

You can also take an alias of jQuery Object yourself:

var $alias = jQuery.noConflict();

Then you can use $alias instead of $.

jQuery's basic operating concepts (Coding basics)

The jQuery code starts with $ (or jQuery) → is followed by a round curly mark "()" → and the parameter in the round mark is what you want jQuery to help you find (which element(s) to get) → then you What action (or event handling) do you want jQuery to perform. E.g:

// Select the element with id el and bind the onclick event
// Ask jQuery to change its CSS background color property to gray
$('#el').click(function() {
  $('#el').css('background-color', 'green');
});   

Chaining

In jQuery, almost all members will return the results of their own execution-it is also a jQuery object, so you can use functions (Chaining) continuously. Below we use an example to illustrate what Chaining is all about:

$('#el').css('color', 'blue').css('background-color', 'red');

The above code is composed of two functions:

// First change the text to blue
$('#el').css('color', 'blue');
// Change the background color to red
$('#el').css('background-color', 'red');

But using the features of jQuery Chaining, there is only one line left, isn't it much more concise?

Post a Comment

0 Comments