Javascript এ যারা window.onload() function নিয়ে কাজ করেছেন তারা হয়ত খেয়াল 
করেছেন, এর মাধ্যমে কল করা কোন ফাংশন তখনই execute হয় যখন page এর সব object ও content load হয় ।মানে করুন কোন image যদি কোন কারণে লোড না হতে পারে তাহলে আপনার onload() এর দ্বারা যে ফাংশন কল করা হয়েছে তা আর execute হবে না।jquery তে .ready() function অনেকটা onload এর মত।difference হল এটাতে কোন page এর dom object গুলো যদি jquery হাতে পায় তাহলেই সে তার কাজ শুরু করে দেয় ।
আর একটা জিনিস হল ready() function টি আপনার যতবার দরকার ততবার-ই কল করতে পারবেন ।
মাঝে মাঝে $(document).ready(); কে “ $(); “ দিয়ে replace করে shortcut-এ
$ (function(){ your code here }); লেখা হয়।
$(document).ready(function() {
})();
$(function() {
})();
উপরের function দুটি একই, ২য় টি ১ম টির সংক্ষিপ্ত রুপ। এদেরকে self executing function বলা হয়। অর্থাৎ ইহা ready state(9 or 10 মিলি সেকেন্ড পর পর) এ dom element check করবে , dom element পেলেই function কাজ শুরু করবে । নিচের example গুলি মনযোগ সহকারে দেখলেই আশা করি self executing function কিভাবে ready state এ কাজ করে তা বুজতে পারবেন।
আমরা জানি program সবসময় উপর থেকে নিচের দিকে (top-down) execute হয়।
উদাহরণ Code:
[sourcecode language=”html”]
<!doctype html>
<html>
<head>
<meta charset=utf-8>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
<style>
.emphasis {
font-weight: bold;
color:red
}
</style>
<script>
$(‘li:first-child’).addClass(’emphasis’);
</script>
</head>
<body>
<ul>
<li>Arifur</li>
<li>Rahman</li>
<li>(Sazal)</li>
</ul>
</body>
</html>
[/sourcecode]
Output :
দেখুন code কাজ করছেনা, কারন html element এর পূর্বে jQuery code লেখা হয়েছে। এবার নিচের উদাহরন টি দেখুন :
উদাহরণ Code:
[sourcecode language=”html”]
<!doctype html>
<html>
<head>
<meta charset=utf-8>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
<style>
.emphasis {
font-weight: bold;
color:red
}
</style>
<script>
$(document).ready(function(){
$(‘li:first-child’).addClass(’emphasis’);
})();
</script>
</head>
<body>
<ul>
<li>Arifur</li>
<li>Rahman</li>
<li>(Sazal)</li>
</ul>
</body>
</html>
[/sourcecode]
Output :
এবার দেখুন code কাজ করছে, কারন on ready state এ self executing function টি নিজে নিজে call হচ্ছে এবং যখন-ই dom element কে পাচ্ছে তাতে jQuery action প্রোয়োগ হচ্ছে।
………………………………………………………………………………
আজ এখানেই শেষ করলাম। “HAVE A GOOD PROGRAMMING”
ধন্যবাদ……………
Good very good ….
অনেক ভালো হচ্ছে। আশা করি শেষ পর্যন্ত চালিয়ে যাবেন।