JSON (JavaScript Object Notation) is a lightweight, alternative format to store data (besides XML, CSV, etc..). Lightweight is the key here. It is very quick and simple on the machine side to parse and generate, and it is very easy for users to read and write. Usually, JSON is considered beneficial over XML because of its speed and ability to hold onto the design aspect of an XML relatively well. Here is an example of an XML file and its corresponding JSON syntax (source
Wikipedia). XML file below:
John
Smith
25
21 2nd Street
New York
NY
10021
212 555-1234
646 555-4567
male
The JSON equivalent of the XML file is below:
{
"firstName": 'John',
"lastName": "Smith",
"age": 25,
"address": {
"streetAddress": "21 2nd Street",
"city": "New York",
"state": "NY",
"postalCode": "10021"
},
"phoneNumber": [
{
"type": "home",
"number": "212 555-1239"
},
{
"type": "fax",
"number": "646 555-4567"
}
],
"gender":{
"type":"male"
}
}
jQuery simplifies JavaScript and is another lightweight option to do the same tasks with less writing. It makes using JavaScript easier on a website for animation, events, navigation, and it opens up the doors for adding a layer of AJAX. jQuery takes some of the most used functions in JavaScript and puts them into a method that can be as short as a line! A couple of specific examples that jQuery significantly simplifies are AJAX and DOM manipulation.
The core syntax for jQuery is: $(selector).action()
$ sign defines/accesses jQuery, (selector) will "query" HTML elements, and the .action() performs something on the element.
The jQuery library is inclusive of:
HTML/DOM manipulation
CSS manipulation
HTML event methods
Effects and animations
AJAX
Utilities
AJAX is a tool used by jQuery for asynchronous server requests. The "$.ajax" directive means that jQuery ($.) is being used to execute an Ajax request. One of the biggest benefits and claims of AJAX is that is is the ability to exchanging data with a server, and update parts of a web page without a reload-- hence a massive plus for speed and optimization of websites. Asynchronous processing of web pages means that once the page has been initially loaded, AJAX can interact with the server and not change the current page being used in the browser. Think about good searches coming up with their best guess on what you are going to want to search in a drop down.. or eBay loading up new auctions as you scroll down. It would take a very long time to load every eBay auction at once and the user would dislike the page and probably be less likely to use it. However, since it loads quick AND has a lot of data to offer users are happy to use it and it manages to be quick, efficient, and continuously load data as needed or prompted by scrolling for more!
Ajax interacts with the server by an XMLHttpRequest object. The results can retrieve an XML, but more commonly in practice
JSON is used for the data to enhance the speed and ability to process by JavaScript.
A list of jQuery AJAX methods can be found
HERE.
