Sunday, November 26, 2017

Part 1 - What is JQuery | Create your first JQuery project | Step by Step tutorial


What is JQuery ?

jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML. It is fast, small, and feature-rich JavaScript library
The jQuery library contains the following features:

  1. HTML/DOM manipulation
  2. CSS manipulation
  3. Event handling
  4. Effects and animations
  5. AJAX
  6. JSON parsing
  7. Extensibility through plug-ins

JavaScript code requires many lines of code to accomplish some task but, jQuery can do the same thing in single line of code

Steps to create first project

  1. Download latest jQuery file from official site here: Download latest version of jquery
  2. Open Your IDE and create an html page
  3. Include jQuery file in your project and give the reference of it in html page. 
  4. Try below example

# Example
Replace your html code with below code and try to show alert on button click in Jquery

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="jquery-3.2.1.min.js"></script>

    <script>

        $(document).ready(function () {
            $("button").click(function () {
                alert("Button was clicked")
            })

        })
    </script>
</head>
<body>
    <button>Click to show alert</button>
</body>
</html>

No comments: