A simple example to demonstrate how to call a function to create dynamic content after page loaded, both in JavaScript and jQuery.

1. JavaScript

To call a function after page loaded, JavaScript uses the “window.onload“, and “innerHTML” to create the content dynamically.

window.onload = function(){
 document.getElementById('msgid3')
         .innerHTML = "This is Hello World by JavaScript";
}

2. jQuery

To call a function after page loaded, jQuery uses the “$(document).ready“, and “html()” to create the content dynamically.

$(document).ready(function(){
 $("#msgid1").html("This is Hello World by JQuery 1<BR>");
});

Example

<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>
jquery-function-call-javascript
This article was posted in JQuery category.

Related Posts