Here i show what the different call method between JavaScript and JQuery handle stuff. Let see this example.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

<html>
<head>
<title>JQuery Hello World</title>
</head>
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<body>
 
<script type="text/javascript">
 
$(document).ready(function(){
 $("#msgid1").html("This is Hello World by JQuery 1<BR>");
});
 
$(function(){
 $("#msgid2").html("This is Hello World by JQuery 2<BR>");
});
 
window.onload = function(){
 document.getElementById('msgid3').innerHTML = "This is Hello World by JavaScript";
}
 
</script>
 
This is Hello World by HTML
 
<div id="msgid1">
</div>
 
<div id="msgid2">
</div>
 
<div id="msgid3">
</div>
 
</body>
</html>

JavaScript is depending on the DOM object

window.onload

JavaScript call like following

document.getElementById('msgid3').innerHTML

JQuery using own object

$(document).ready(function(){
});
 
$(function(){
});

JQuery call like following

 $("#msgid1").html("This is Hello World by JQuery 1");