جستجو در محصولات

گالری پروژه های افتر افکت
گالری پروژه های PSD
جستجو در محصولات


تبلیغ بانک ها در صفحات
ربات ساز تلگرام در صفحات
ایمن نیوز در صفحات
.. سیستم ارسال پیامک ..
آشنايي با جاوا اسکريپت و آژاکس
-(0 Body) 
آشنايي با جاوا اسکريپت و آژاکس
Visitor 348
Category: دنياي فن آوري

1- جاوا اسکريپت JavaScript
 

شايد در اين دوره شما نيازي به درگير شدن جاوا اسکريپت و نحوه استفاده از آن نداشته باشيد. براي همين به ذکر پاره اي کليات در مورد اين زبان کارآمد وب مي پردازيم تا اگر روزي خواستيد از برخي فرم ها و برنامه هاي آماده آن استفاده کنيد، دچار سردرگمي نشويد.
جاوا اسکريپت در حقيقت يک زبان اسکريپت نويسي است و با اين هدف طراحي شده که امکان دسترسي به کامپاننت هاي پيش ساخته را براي کاربران عادي و نيمه حرفه اي فراهم آورد. در خصوص جاوا اسکريپت، کامپاننت هاي پيش ساخته بلوک هايي براي زيباسازي و سر و شکل دادن به صفحات وب هستند. کاربردهاي فراواني همچون فرم هاي اچ تي ام ال بهينه شده، تنظيم جزئيات مرورگر، پلاگين هاي مرورگر و… را مي توان براي اين بلوک هاي پيش ساخته متصور بود.
نکته: توجه داشته باشيد که زبان جاوا اسکريپت به کلي متفاوت از زبان جاوا بوده و تفاوت ماهوي با آن دارد. بنابراين هيچ وقت از کلمه «جاوا» به جاي «جاوا اسکريپت» استفاده نکنيد. اين دو ارتباطي با همديگر ندارند!

برخي کاربردهاي جاوا اسکريپت
 

شناسايي مرورگر: با استفاده از جاوا اسکريپت مي توانيد نوع مرورگر بيننده سايت تان را تشخيص دهيد. سپس صفحات ويژه اي که براي آن مرورگر طراحي شده اند را براي وي به نمايش بگذاريد.
کوکي ها: هنگامي که کاربر به سايت شما مراجعه مي کند، مي توانيد اطلاعات مورد نياز را بر روي کامپيوتر وي ذخيره کنيد تا در مراجعات بعدي وي به سايت، از آنها استفاده کنيد.
کنترل مرورگر ها: مي توانيد باز شدن پنجره هاي جديد مرورگر و اينکه داراي چه اجزايي را باشد، کنترل کنيد.
تاييد اعتبار فرم ها: براي کاهش ترافيک سايت و راحتي بيشتر کاربران، مي توانيد صحت اطلاعات ورودي در هر کادر را قبل از ارسال آنها به سرور و پاسخ گويي آن، در مرورگر و روي کامپيوتر کاربر بسنجيد. مثلا وقتي در کادري ايميل وارد مي شود، قبل از اينکه به سرور ارسال شود، کنترل مي شود که شکل صحيح ايميل و علامت @ را داشته باشد تا سرور به آن ايراد نگيرد.
واکنش نشان دادن به اتفاقات: مي توانيد جاوا اسکريپت را به گونه اي تنظيم کنيد که نسبت به اتفاقاتي که در صفحه وب اتفاق مي افتد واکنش نشان دهد. مثلا هنگامي که صفحه کامل لود مي شود يا بر روي لينک يا بخش خاصي از صفحه کليک مي شود، پنجره يا پيام خاصي را نشان دهد يا هر کار ديگري انجام دهد.
نکته: همانطور که احتمالا در برخي وبلاگ ها و سايت ها ديده ايد، برخي از کدهاي جاوا اسکريپت براي افکت هاي ويژه اي مانند ستاره در کنار موس، ساعت در کنار موس يا تغيير شکل موس استفاده مي شود. برخي هم با استفاده از اين کدها، پنجره هاي خودکار با پيام هاي خاص مانند سلام و خداحافظي را فعال مي کنند. توجه داشته باشيد که بهتر است از اين موارد استفاده نکنيد چرا که باعث دردسر و کلافگي کاربران و نهايتا ترک وب سايت يا وبلاگ شما خواهد شد.

شيوه شناخت کدهاي جاوا اسکريپت در صفحات وب
 

براي کدنويسي جاوا اسکريپت درون فايل هاي اچ تي ام ال، همانند ديگر دستورات، از تگ استفاده مي شود. با شناخت کد ويژه جاوا اسکريپت، مي توانيد آن را در هر صفحه اي تشخيص دهيد.
تگ کدنويسي جاوا اسکريپت در اچ تي ام ال، script است. تمامي کدهاي جاوا اسکريپتي که قرار است در صفحه استفاده شوند را ميان دو تگ باز و بسته اسکريپت مي گذارند. ضمنا اغلب اوقات يک کد جاوا اسکريپت به صورت دو تکه مورد استفاده قرار مي گيرد که درون فايل HTML، بخشي از آن در هد و بخشي در بادي گذارده مي شود.
براي مثال ممکن است چيزهايي مانند اين در بخش head ببينيد:

<script type="text/javascript" src="http://www.darsnameh.com/js/js_pUi7SMDemA4A2k3_hlAWRM.js"></script>
 

و کدهايي شبيه اين را هم احتمالا درون body صفحه اچ تي ام ال مورد نظر خواهيد يافت:

<script type="text/javascript">
(function() { po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
 

2- آژاکس AJAX
 

هنگامي که با يک صفحه اچ تي ام ال خالي و يا مخلوطي از اچ تي ام ال و جاوا اسکريپت کار مي کنيد، براي هرگونه تبادل اطلاعات ميان سايت و سرور آن، صفحه بايد يک بار ديگر به صورت کامل بارگذاري (لود) شود. اما داستان آژاکس، به روز کردن بخش هايي از اطلاعات صفحه با سرور، بدون بارگذاري مجدد صفحه است. با اين کار علاوه بر بالا رفتن سرعت کار در سايت و کاربر پسندتر بودن آن، ترافيک سرور را بسيار پايين آورده و پايداري و کارايي آن را به شکل قابل توجهي افزايش مي دهد.
کلمه AJAX مخفف عبارت Asynchronous JavaScript and XML يا جاوا اسکريپت و ايکس ام ال غير همزمان است. يعني اينکه کدهاي موجود در صفحه به صورت جداگانه با سرور در ارتباط هستند و اطلاعات شان را با بانک اطلاعاتي سايت همسان سازي مي کنند. با اين کار هميشه صفحات وب سريع و پويايي در اختيار خواهيد داشت.
در صفحات وب کلاسيک، داستان اينگونه بود که براي تبادل اطلاعات هر بخش صفحه، بايد تمام آن براي سرور ارسال مي شد، سرور اطلاعات را با پايگاه داده کنترل مي کرد و پاسخ را در يک صفحه کاملا جديد براي کامپيوتر کاربر ارسال مي کرد.
از جمله برنامه هاي تحت وب و سايت هاي مشهوري که از آژاکس استفاده مي کنند، مي توان به گوگل مپ، جيميل، يوتيوب يا فيس بوک اشاره کرد. اگر عضو فيس بوک باشيد، احتمالا ديده ايد که صفحه پيام ها و يا نظرات، بدون بارگذاري دوباره کل صفحه باز مي شود و پس از نوشتن نظرتان، تنها همان بخش نظرات دوباره لود شده و نظر شما نشان داده مي شود. يا در صفحه جيميل، بدون اينکه صفحه به صورت کامل از ابتدا بارگذاري شود، ايميل هاي جديد در ليست اينباکس شما ظاهر مي شوند.
مورد بسيار ملموس تر استفاده از آژاکس، که اتفاقا باعث ترويج و شيوع استفاده از آن در صفحات وب شد، پيشنهادات بخش جستجوي گوگل است. اگر دقت کرده باشيد، وقتي عبارتي را در باکس جستجوي گوگل مي نويسيد، منويي باز شده و پيشنهادات گوگل در خصوص پرکاربردترين ترکيبات آن عبارت را در اختيارتان مي گذارد. خب، چگونه گوگل مي تواند با سرور ارتباط برقرار کرده و سريعا پرکاربردترين عبارات مشابه را دريافت کرده و به شما نشان دهد؟ بدون اينکه شما کوچکترين تغييري در صفحه اي که مشاهده مي کنيد احساس کنيد.
تنها نکته اي باقي مي ماند اين است که کدهاي آژاکس هم درون صفحه، تقريبا شبيه کدهاي جاوا اسکريپت نوشته مي شوند و در همان تگ script قرار مي گيرند.
خوب شما در اين درس با دو فناوري مهم و بسيار پرکاربرد در اينترنت آشنا شديد. قرار نيست کد جاوا اسکريپت و آژاکس بنويسيد اما حداقل حالا مي دانيد که آنها چيستند و به چه کاري مي آيند. اين دو فناوري به طور بسيار گسترده اي در تمام وب استفاده مي شوند و شما آنها را همه جا مي بينيد. جاوا اسکريپت و آژاکس يکي از اجزاي مهم پويا شدن وب به حساب مي آيند
منبع:درسنامه
ارسال توسط کاربر محترم سايت :king007
Add Comments
Name:
Email:  
User Comments:
SecurityCode: Captcha ImageChange Image