آموزش جاوا اسکریپت در یازده روز – روز اول

جمعه, ۲م بهمن , ۱۳۸۸ | ۴۳ دیدگاه

سلام،من عاطفه هستم و از امروز قراره طی ۱۰ جلسه آموزشی درباره طراحی سایت به کمک جاوا اسکریپت صحبت کنیم، البته کار ما به این ۱۰ جلسه ختم نمیشه و بعد از اینکه طی این جلسات تا حدودی با جاوا اسکریپت آشنا شدید، قصد دارم درباره تکنیک های جالبی که می توان با جاوا اسکریپت ایجاد نمود براتون بنویسم. در ابتدا موضوع هر جلسه رو مشخص کردم تا بدونید که در هرجلسه چه مبحثی آموزش داده میشود.

جلسه اول: جاوا اسکریپت در یک نگاه

جلسه دوم: آشنایی با مباحث اولیه جاوا اسکریپت

جلسه سوم: ایجاد کادر پیام و دریافت داده از کاربر

جلسه چهارم: رویدادها و متدها

جلسه پنجم: دستورهای شرطی

جلسه ششم: کار با توابع

جلسه هفتم: حلقه های تکرار

جلسه  هشتم: آرایه ها

جلسه نهم: اداره کردن کوکی ها

جلسه دهم: ایجاد انیمیشن

جلسه یازدهم: تکنیک ها

۱: ایجاد منوهای کشویی

۲: ساخت روزشمارسایت

۳: ساخت ساعت آنالوگ پویا

۴: ایجاد جعبه های چشمک زن

۵: حرکت قطاری عکس ها

۶: منوهای کرکره ای

و …

در جلسه یازدهم اگرشما علاقه مند به جلوه خاصی هستید شما می تونید تکنیک دلخواه ومورد نیازتون رو در قسمت نظرات بنویسید، من هم اگر کدش رو داشته باشم حتما در یک جلسه اون تکنیک رو آموزش میدم.

جلسه اول:

جاوا اسکریپت در یک نگاه

در این جلسه کمی درباره زبان های برنامه نویسی قوی و زبان های برنامه نویسی تحت وب از جمله جاوا اسکریپت صحبت می کنیم.

مباحثی که در این جلسه می خوانیم:

۱-       آشنایی با برنامه نویسی

۲-       کارهایی که می توان با جاوا اسکریپت انجام داد

۳-       آشنایی با HTML

بخش اول:آشنایی با برنامه نویسی

در حال حاضر زبان های برنامه نویسی زیادی وجود دارند مانند C#)  ، C++، ویژوال بیسیک

دلفی، جاوا) و… که در واقع این زبان ها ابزارهایی هستند برای اینکه ما به کمک آنها دستورات و خواسته های خود را به کامپیوتر منتقل کنیم. پس بدون این زبا ها نمی شود دستورات را به رایانه فهماند. ما به کمک این زبان ها می توانیم برنامه ها و حتی نرم افزارهای مورد نیاز خود را بسازیم.

اما در میان این زبان های برنامه نویسی قوی، زبان های برنامه سازی ساده ای هم وجود دارد،مانند جاوا اسکریپت. جاوا اسکریپت یک نوع زبان برنامه نویسی برای طراحی صفحات وب می باشد وبا جاوا که یک نوع زبان برنامه نویسی قوی است کاملا تفاوت دارد.

همانطور که گفتم زبان هایی مثل java و C++ برای ساخت نرم افزارها و برنامه های پیچیده به کار می رود، با این زبان ها حتی می توان بازی های کامپیوتر را طراحی نمود به همین دلیل بهآنها زبان برنامه سازی قوی می گویند. اما جاوا اسکریپت زبانی است که برای طراحی صفحات وب ایجاد شده و بسیار ساده تر از سایر زبانهاست. البته همین سادگی و راحتی کار با جاوا اسکریپت است که باعث رواج و محبوبیت جاوا اسکریپت در میان کاربران شده.

زبان جاوا اسکریپت توسط شرکت Sun  ایجاد شده است، که یکی دیگر از قابلیت های آن این است که به راحتی می تواند با HTML ترکیب شود و از امکانات آن استفاده نماید. با کمک جاوا اسکریپت و ترکیب آن با HTML و PHP می توانیم وب سایت های پویا و زیبایی را ایجاد نماییم.

نکته دیگر در مورد جاوا اسکریپت اینکه جاوا اسکریپت یک زبان اسکریپت نویسی برای سرویس گیرنده(Client) است، البته برای برنامه نویسی در سرویس دهنده(Server) نیز به کار می آید ولی بیشتر در برنامه نویسی برای سرویس گیرنده کارایی دارد.

زبانهای دیگری نیز برای برنامه نویسی تحت وب وجود دارند مانند Jscript  ، VBscript ، PHP و… که تفاوت آنها در همین نکته است.

برای درک بهتر مسئله مثالی می زنم:

فرض کنید من در وب سایتم با استفاده از جاوا اسکریپت یک ساعت پویا قرار دادم، وقتی شما صفحه سایت من رو باز می کنید این ساعت با ساعت سیستم شما تنظیم می شود و ساعت رو طبق ساعت سیستم خودتون به شما نمایش می دهد، این یعنی اینکه جاوا اسکریپت یک زبان اسکریپت نویسی در سرویس گیرنده است.

حال فرض کنید من همان ساعت رو توسط Asp  یا PHP  ایجاد کنم، این بار شما پس از ورود به سایت، ساعتی را می بینید که با زمان سیستم من تنظیم شده و ممکن است با ساعت شما کمی تفاوت داشته باشد. پس اسکریپت هایی که با Asp و PHP می نویسیم روی سیستم خود سرور(سرویس دهنده) اجرا می شود. اما اسکریپت های(کدهای) نوشته شده توسط Jscript ، VBscript و JavaScript در سیستم کاربر یا همان سرویس گیرنده اجرا می شود.

بخش دوم: کارهایی که می توان با جاوا اسکریپت انجام داد:

نوشتن برنامه هایی برای انجام محاسبات: مثلا با کمک جاوا اسکریپت می توان یک ماشین حساب طراحی کرد. و هر کاری دیگری که نیاز به محاسبه داشته باشد را می توان با جاوا اسکریپت کنترل کرد

مثلا کنترل فرم ها.

کنترل مرورگر: در جاوا اسکریپت شیء ای به نام  window وجود دارد که از طریق آن می توان کنترلی

روی کاربر و کارهای او داشت، مثلا کنترل کارهایی که کاربر انجام می دهد و نمایش یک پیغام مناسب در مقابل عمکرد او، همچنین با کمک آن می توان پنجره مرورگر جدیدی را باز کرد. در جلسه چهارم به طور کامل با مفهوم شیء و چگونگی کار با آن آشنا می شویم.

کنترل محتویات صفحه: یکی دیگر از شیء های جاوا اسکریپت document(سند) است که با کمک آن می توان کنترلی روی محتویات و ظاهر صفحه داشت. که باز هم توضیحات بیشتر را  برای جلسه چهارم می گذاریم.

قابلیت تعامل با فرم های HTML: جاوا اسکریپت می تواند با HTML تعامل برقرار کند، این تعامل با استفاده از شیء Form ایجاد می شود. یعنی می تواند فرم ایجاد شده توسط HTML را کنترل کند.

مثلا یک فرم طراحی شده توسط یک شرکت را در نظر بگیرید، جاوا اسکریپت می تواند قسمت های فروش یا سفارشات را کنترل و محاسبات آن را انجام دهد.

و بسیاری از ویژگی های دیگر مثل تعامل با کاربر، کارکردن با کوکی ها و …

بخش سوم آشنایی با :HTML

HTML یک زبان برنامه سازی نیست بلکه یک زبان طراحی است، که کارکردن با آن نیازمند آشنایی با هیچ زبان برنامه سازی نمی باشد. HTML پایه و اساس یک صفحه وب است، حتی اگر شما کدنویسی نکنید واز نرم افزارهایی مثل Dream weaver  استفاده کنید خود نرم افزار کار کدنویسی را انجام می دهد ودر قسمت code می توانید کدهای HTML  را ببینید. در اسکریپت نویسی نیز ما به HTML نیاز داریم ، بنابراین باید قبل از آموزش جاوا اسکریپت با تگ های اصلی HTML که در جاوا اسکریپت هم مورد نیاز هست آشنا شویم:

<html>

 <head>
دستورات جاوا اسکریپت
 </head>

  <body>
محتویات صفحه مثل تصاویر
متن هاو جدول ها
  </body>

</htm>

توضیحات:

HTML : تگ شروع صفحه می باشد.

تگ شروع: اگر با Html کار کرده باشید، می دونید که هر کدی باید بین یک تگ خاص قرار بگیرد و هر تگ یک شروع و پایانی دارد، که تگ شروع بین علامت <> قرار می گیرد.

پایان تگ: هر تگی باید در یک نقطه پایان یابد که تگ پایان بین علامت < /> نوشته می شود.

نکته: کدهای جاوا اسکریپت می توانند هم بین تگ head وهم بین تگ body قرار بگیرند.البته بعضی از دستورات جاوا اسکریپت برای اجرا باید حتما بین تگ body قرار بگیرند.
که شما دستورهایی که از این پس مشاهده می کنید رو باید بین تگ body بنویسید هرچند که بعضی از آنها درتگ head نیز قابل اجرا می باشند.
این دستورات را باید در یک فایل متنی(Notepad) وارد کنید وآنها را با یک نام و با پسوند html یا htm ذخیره کنید.

اگر از مطلب فوق لذت برده اید آنرا با دوستان خود به اشتراک بگذارید
  • Twitter
  • FriendFeed
  • del.icio.us
  • StumbleUpon
  • Digg
  • Facebook
  • Technorati
  • MySpace
  • RSS


۴۳ دیدگاه


  1. علیرضا
    ۲ بهمن ۱۳۸۸

    خیلی عالی بود. منتظر ادامه آموزش هستم




  2. کامران
    ۲ بهمن ۱۳۸۸

    عاطفه جان موفق باشی و امیدوارم که مسیح خوش خول و خوش ذوق و سلیقه هم باشید که تا اینجای کار اینطور به نظر میرسه
    ممنونه




  3. مسیح
    ۲ بهمن ۱۳۸۸

    سلام همکار (;
    چی کار بکنیم ما بعد از این ۱۱ جلسه و اون ۱۵ جلسه و اون بقیۀ جلسات ! چقدر افکت بارون بشه این ITT !

    خیلی خوش حالم که می تونم قدم قدم یه مروری روی جاوا اسکریپت داشته باشم به کمک شما.

    چون من بخش جی کوئری رو آموزش می دم توی این پنج قسمتی که آموزش نوشتم یه سری تجربه کسب کردم که مطمئنم به دردتون می خوره … چند تا سئوال جاوا هم دارم که دست شما رو می بوسن. پس اگر امکان داره من رو از طریق یاهو مسنجر اد کنید. ممنونم
    ID = masih32




  4. کامران
    ۲ بهمن ۱۳۸۸

    ما آمادگی خودمون رو برای افکت باران اعلام میکنیم. راستی یادتون نره تو این نظر سنجی هم شرکت کنید. اگه خدا بخواد و تالار گفتمان راه بندازیم اونجا جا برای خیلی کارها بیشتر میشه




  5. شاهین
    ۳ بهمن ۱۳۸۸

    مرسی از آموزش خوبتون منتظر آموزش های بعدی هستم




  6. امیر
    ۳ بهمن ۱۳۸۸

    سلام خوش اومدی ….
    امیدوارم که موفق باشی .




  7. بهزاد
    ۳ بهمن ۱۳۸۸

    کامران چه کردی بابا این همه حرفه ای رو یه جا ندیده بودم!
    تبریک میگم.




  8. کامران
    ۳ بهمن ۱۳۸۸

    به به آقا بهزاد گل
    جای شما با اون مطالب جالب و حرفه ایت خیلی خالیه
    امیدوارم که دوباره بتونیم پذیرای شما باشیم




  9. عاطفه
    ۳ بهمن ۱۳۸۸

    سلام دوستان،
    از همه شما به خاطر همراهیتون تشکر می کنم و به خصوص از آقا کامران که تو این زمینه خیلی به من کمک کردن.
    مسیح جان از شما هم ممنونم و خیلی خوشحال می شم که از تجربیات شما استفاده کنم . اگه سوالی هم دارین من درخدمتم.




  10. الهه
    ۳ بهمن ۱۳۸۸

    ممنون عاطفه جان.
    خیلی عالی بود.




  11. masoud
    ۴ بهمن ۱۳۸۸

    کامران جان نفست جاری…خانم عاطفه مرسی. خسته نباشید.




  12. هادی
    ۴ بهمن ۱۳۸۸

    خسته نباشید!
    عالیه و فکر کنم خیلی مفید باشه




  13. Hesam
    ۴ بهمن ۱۳۸۸

    دیگه اینجا واقعا معنی خودآموز گرفتهِ …




  14. فاطمه
    ۶ بهمن ۱۳۸۸

    خیلی خوب بود با یه متن ساده و قابل فهم آموزش داده شده ، عاطفه جان خیلی ممنون!!!!!!




  15. کامران
    ۶ بهمن ۱۳۸۸

    با روندی که در پیش گرفتیم به نظر میار یه روزی تمامی آموزشگاههای بزرگ در ایران اساتید دروس مربوط به آی تی شونو از اینجا انتخاب کنن
    تمامی دوتسان تایپ بسیار شیوایی دارند و مطلب را بسیار ساده و قابل درک و فهم به خوانندگان انتقال میدهند. برای همتون آرزوی موفقیت دارم و امیدوارم بتونم محبتهاتون رو روزی جبران کنم




  16. محسن
    ۱۳ بهمن ۱۳۸۸

    سلام

    من محسن هستم از کرج.
    کاردانی IT میخونم دانشگاه علمی-کاربردی.
    یک ترم بیشتر نمونده.

    به برنامه نویسی سایت و همچنین زبان جاوا خیلی علاقه دارم.
    البته فعلا نرفتم سمت جاوا و تمرکز کردم روی برنامه نویسی سایت.
    دانشگاه که چیز خاصی به ما اضافه نکرد و فقط کمی با مبانی اولیه برنامه نویسی آشنا شدم.

    من تازه همین امروز با اینجا خیلی اتفاقی آشنا شدم.

    خیلی خیلی جالبه و مفید.

    آموزشها با زبان ساده و قابل فهم هستش ضمن اینکه آدم اینجا انرژی میگیره.

    من مدتی هستش که خودم شروع کردم به یادگیری PHP

    ولی دیدم بهتره که قبل از اینکه روی PHP بخوام انرژی بذارم اول کمی جاوا اسکریپت و CSS یاد بگیرم.

    از امروز و از همین سایت جاوا اسکریپت رو شروع کردم.
    در مورد CSS هم آموزشی اینجا هست؟

    اگه دوستانی اینجا هستن که آموزشگاه خوب یا محل خوبی برای کارآموزی سراغ دارن و یا تجربه ای در زمینه ی برنامه نویسی سایت و کلا برنامه نویسی دارن خوشحال میشم که با من در تماس باشن.
    آی-دی من در یاهو: nama62_m




  17. عاطفه
    ۱۴ بهمن ۱۳۸۸

    سلام
    آقامحسن خیلی خوشحال میشم در زمینه جاوا اسکریپت بتونم کمکی بهتون کنم. در مورد Css هم تو همین سایت مطالبی هست ولی اگه آموزش مقدماتی رو میخوای پیشنهاد می کنم یه سری به این سایت بزنی http://www.neopersia.org




  18. محسن
    ۱۴ بهمن ۱۳۸۸

    سلام عاطفه خانم

    مرسی از پیغامتون.

    من درخواس add شمارو تایید کردم و براتو آف هم گذاشتم ولی آی-دی شما از مسنجرم حذف شده!

    اگه میشه دوباره منو add کنین تا من آنلاین چند تا مطلب رو از شما بپرسم و در یه مورد هم مشورت میخواستم بگیرم.

    مرسی…



  19. [...] آموزش جاوا اسکریپت در یازده روز – روز اول [...]



  20. [...] آموزش جاوا اسکریپت در یازده روز – روز اول [...]



  21. [...] آموزش جاوا اسکریپت در یازده روز – روز اول [...]




  22. معصومه
    ۳ اسفند ۱۳۸۸

    ممنون عاطفه جان ایشاله موفق باشی




  23. عاطفه
    ۴ اسفند ۱۳۸۸

    ممنون معصومه جان



  24. [...] آموزش جاوا اسکریپت در یازده روز – روز اول [...]



  25. [...] آموزش جاوا اسکریپت در یازده روز – روز اول [...]




  26. somaiye
    ۱۱ اسفند ۱۳۸۸

    سلام
    موفق باشید



  27. [...] آموزش جاوا اسکریپت در یازده روز – روز اول [...]




  28. محمدرضا
    ۹ اردیبهشت ۱۳۸۹

    به نام خدا
    من از اینجا از عاطفه تشکر میکنم که بدون چشم داشتی این اطلاعات رو در اختیار ما قرار داده.
    عاطفه خوشحال میشم بتونم دراین خصوص کمکی به شما بکنم

    با تشکر




  29. عاطفه
    ۹ اردیبهشت ۱۳۸۹

    ممنون محمدرضا، کاری نکردم، امیدوارم این آموزش ها بدرد شما دوستان بخوره. حتما روی کمکتون هم حساب میکنم. مرسی




  30. alami
    ۱۹ خرداد ۱۳۸۹

    عالی خشته نباشید واقعا محشره.

    لطفا درموردajaxوseo هم اگرمیتونید مطلب بزارید




  31. احسان
    ۳۰ خرداد ۱۳۸۹

    سلام .از اینکه دانشتون رو بی منت و با عشق در اختیار دیگران می گذارید بی نهایت سپاسگذارم.امیدوارم بی منت و با عشق به هر چی دوست داری برسی.آرزوی موفقیت برای شما.




  32. عاطفه
    ۳۱ خرداد ۱۳۸۹

    سلام
    بازم از همه ی دوستانی که به من لطف داشتن و با نظراتشون خوشحالم کردن، تشکر میکنم.
    آقا احسان از شماهم ممنونم. منم برای شما آرزوی موفقیت میکنم.




  33. حسین
    ۲۷ مرداد ۱۳۸۹

    یک دنیا ممنون




  34. بیتا
    ۷ آذر ۱۳۸۹

    سلام و خسته نباشید من یک تازه کارم که html , css را تازه تمام کردم به کمک دوستانی مثل شما که بدون چشم داشتی اطلاعات خود را در اختیار دیگران قرا می دهندو می خواهم با کمک شما ایندفعه جاوا اسکریپ را هم یاد بگیرم .ممنونم




  35. عاطفه
    ۱۷ آذر ۱۳۸۹

    موفق باشی بیتا جان




  36. امیر
    ۲۹ دی ۱۳۸۹

    ممنون عاطفه جان
    با آرزوی موفقیت روز افزون شما




  37. سپیده
    ۱۶ اسفند ۱۳۸۹

    سلام عاطفه
    نمیدونی چه کمکی می کنی با آموزش دادنت

    امیدوارم خیرشو ببینی توی زندگی
    مرسی




  38. عاطفه
    ۱۷ اسفند ۱۳۸۹

    سلام سپیده جان
    خوشحالم از اینکه این مطالب به دردتون میخوره.
    ممنون از لطفت




  39. محمد
    ۸ آذر ۱۳۹۰

    واقعا ممنون …




  40. سید محین ناصریان
    ۲ بهمن ۱۳۹۰

    سلام . خیلی آموزشاتون عالیه ، لینک جلسه دوم به بعدش کجاست ؟




  41. مهدی
    ۷ فروردین ۱۳۹۱

    عاطفه جان بابت زحمتی که برای این آموزش گذاشتی بسیار تشکر
    امیدوارم در تمام مراحل زندگی موفق وموید باشی




  42. اعظم
    ۷ فروردین ۱۳۹۱

    عاطفه جان خیلی ممنونم




  43. نجمه
    ۶ مرداد ۱۳۹۱

    سلاااااااااااااام عاطفه خانوم
    ممنون
    من تازه شروع کردم امیدوارم بتونم خوب یاد بگیرم



دیدگاه خود را بنویسید