JavaScript and jQuery

JavaScript is the programming language of the web. HTML defines the content and CSS defines the style. But it is JavaScript that provides most of the action and interaction!

Just like most other programming languages, JavaScript has variables, operators and built-in methods. There are also conditional loops using if…else, for, while and switch…case. Further on, coders can write functions to introduce many interactive behaviours on the website.

Using the Document Object Model (DOM) and Browser Object Model (BOM), JavaScript can also manipulate the web content or browser elements. For e.g., JavaScript can make text in your document appear and disappear (using DOM) and obtain the height and width of  your browser window (using BOM). Check out the below interactive example.

Click on Run Pen to view.

AJAX and JSON are two other terms that you will hear about when you use JavaScript.

Asynchronous JavaScript and XML (AJAX) is a technique for creating fast and dynamic web pages. Using AJAX, it is possible to update parts of a web page, without reloading the whole page.

JavaScript Object Notation (JSON) is a syntax for storing and exchanging data. A common use of JSON is to read data from a web server, and display the data in a web page.

A JavaScript library is a library of pre-written JavaScript which allows for easier development of JavaScript-based applications, especially for AJAX and other web-centric technologies.


jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML. It is the most popular, fast, small, and feature-rich JavaScript library in use today. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers.

You can see some examples of the power of jQuery below. Click on Run Pen to view.  I have used functions like hide, show, toggle and animate to create some interactive elements.

jQuery Tutorials

Check Also

Website Header with HTML5 and CSS3

A Simple Website Header with HTML5 and CSS3

Would you like to see the creation process of a simple website header using just HTML5 and CSS3 - from sketch to HTML page to working prototype?

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.