Using jquery to simplify AJAX development--ajax development [1]

jquery is a JavaScript library that simplifies javascript™ and Ajax (asynchronous JavaScript + XML, asynchronous JavaScript, and XML) programming. Unlike other JavaScript libraries, jquery has his own philosophy that allows you to write code very simply. This article will show you the philosophy of jquery, explore his features and features, and do some Ajax examples and how to use Plug-in (Plug-ins) to extend jquery.

1. What is jquery?

jquery is a very good JavaScript library, it was born in 2006, from the hands of John Resig. Whether you're a beginner in JavaScript, but want to try Dom (Document Object Model) and Ajax, or you're a JavaScript expert, you're tired of repeating the tasteless DOM and Ajax scripts over and over again, jquery will be your choice.

jquery will help you keep the code simple and concise. You don't have to write a bunch of repetitive loops or dom call scripts, and with jquery, you'll quickly find the key points, and you can express your thoughts in minimal code.

The philosophy of jquery is simple: simplicity, reusability. When you understand and agree with this idea, you can begin to realize how easy it is to use jquery to make your programming enjoyable!

2. Some simple concepts

Here's a simple example that shows you how jquery affects the code you write. What you do is simple, such as adding a click Response event to all the links in a particular area on the page, and you can use the usual JavaScript and Dom to write, code see LISTING1:

Listing 1. DOM Scripting without JQuery

var external_links = document.getElementById('external_links');
var links = external_links.getElementsByTagName('a');
for (var i=0;i < links.length;i++) {
　　var link = links.item(i);
　　link.onclick = function() {
　　　　return confirm('You are going to visit: ' + this.href);
　　};
}

If you use jquery, you do the following:

Listing 2. DOM Scripting with JQuery

$('#external_links a').click(function() {
　　return confirm('You are going to visit: ' + this.href);
});

It's amazing, isn't it? With jquery, you can quickly find the key points and just express what you need to express,

Without the need for Rowe to be wordy. There is no need to loop through these elements, and the Click () function can handle all of this. And you don't want to thank too much for manipulating Dom's code,

All you need is to use a few characters to define the element you are looking for.

Take a look at how this code works, with a little bit of skill. First, see the most powerful function in the $ () function--jquery. Most of the cases,

You use this function to select elements from the document. In this example, use this function to pass with some cascading style sheets (cascading style sheets,css)

The syntax of the string, jquery can easily find this element.

If you know a little bit about the basic CSS selector, I think this syntax should look pretty familiar. In Listing2, #external_links用来寻找带有id为

The external_links element. The next space indicates that jquery is going to find all the <a> elements within the #external_links element. It's a bit of a struggle to speak in spoken English

It's also a hassle to write with a DOM script, but there's nothing more simple in CSS. The $ () function returns a JQuery object that contains all the elements that match the CSS selector. The concept of a jquery object is like an array, but it may contain many jquery functions. For example, you can call the Click function to bind a click event response to each element in the jquery object.

You can also pass an element or an array of elements to the $ () function, which packs all the elements into a jquery object. You might want to apply this feature to a Window object. For example, you might use this function to load events like this:

window.onload = function() {
　　// do this stuff when the page is done loading
};