jQuery Hello World
JQuery is the most popular Javascript Library . It is a powerful JavaScript API which makes it a lot easier to perform various standard JavaScript actions in your HTML page. All the power of jQuery is accessed via JavaScript, so having a strong grasp of JavaScript is essential for understanding, structuring, and debugging your code. A "HELLO WORLD!!" is a simple program that outputs "HELLO WORLD!!" on the screen. Since it's a very simple program, it's often used to introduce a new programming to a newbie. Let's go over the "HELLO WORLD!!" program, which simply prints "HELLO WORLD!!" in a messeagebox.
$(document).ready(function(){
$("#myButton").click(function(){
alert("HELLO WORLD!!");
});
});
<button id="myButton">Click Here</button>
Browser View
<html>
<head>
<title>Hello World</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#myButton").click(function(){
alert("HELLO WORLD!!");
});
});
</script>
</head>
<body>
<button id="myButton">Click Here</button>
</body>
</html>
Explanation:
Adding jQuery to Your Web Page
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
The above line shows how to include jQuery from a CDN, like Google.
Document Ready Event
$(document).ready(function(){
});
Here $() indicates jQuery syntax and is used to define jQuery part. $(document).ready() method get called when document is loaded.
$("#myButton").click(function(){
alert("HELLO WORLD!!");
});
We have used jQuery selector here. $(#myButton) actually selects DOM element with that id, so $(#myButton) selects button and when we click on that button,click function will get called, then we called the alert function with message "HELLO WORLD!!" .
Related Topics