jQuery Hello world
Step 1: Create a file named hellojQuery.html and paste the below code,
<!DOCTYPEhtmlPUBLIC"-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<scriptsrc="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<scripttype="text/javascript">
jQuery(document).ready(function(){
// $ == jQuery, so you can use either $ or jQuery.
$(".world").hide();
// world is the World span class, inorder to access the class we should use .class (i.e) .world
$("#hello").click(function(){
// hello is the Hello span id, inorder to access the id we should use #id (i.e) #hello
$(".world").show();
});
$(".world").click(function(){
$(".world").hide();
});
});
</script>
</head>
<body>
<spanid="hello">Hello</span><spanclass="world">World</span>
</body>
</html>
Step 2:If you run the above program you can see “Hello” in the output screen.
If you click the Hello then Worldwill also be shown.
If you click the Worldthen World will be hidden.
Note:
You can access the html elements using tags, class and id.
If it is class then access with .(dot)
If it is id then access with #
If it is tag access with its tag name.
Thanks for reading this post………..!!!