نوشته شده توسط : رضا
برای دسترسی سريع از لينکهای زير استفاده کنيد:
با پيشرفت تکنولوژي در وب و نسخه هاي جديد مرورگرها که توانايي استفاده از مولتي مديا را در اختيار ما مي گذاشتن، انگيزه اي ايجاد شد تا صوت و تصوير هم در صفحات وب گنجانده شوند و سايتها را جذاب تر کنند. در اين صفحه راههاي اضافه کردن فايل صوتي به يک صفحه را مي آموزيد و در صفحه بعد افزودن فايلهاي تصويري را ياد خواهيد گرفت. اهميت حجم فايل صوتيMIMEفرمتهاي فايلهاي صوتيافزودن فايل صوتي به زمينه صفحهافزودن فايل صوتي بصورت لينکمثال فايلهاي صوتي يکي از سنگين ترين عناصر در وب از لحاظ حجم مي باشند که بايد در انتخاب آنها بيشتر دقت کنيد، چون هر چه فايل سنگين تر باشد دانلود شدن آن و همچنين صفحه وب کند تر و خسته کننده تر خواهد شد.
هنگاميکه يک فايل صوتي به صفحه اضافه شود، مرورگر به تنهايي قادر به پخش آن نمي باشد و بايد به کمک يک برنامه کاربردي ديگر اينکار را انجام دهد. مرورگرها توسط اطلاعاتي که از فايل دريافت مي کنند مي توانند تشخيص دهند که چه برنامه اي را بايد براي پخش آن فايل صدا بزنند که اين اطلاعات را MIME مي گويند. MIME مخفف Multipurpose Internet Mail Extensions است. زمانيکه مرورگر با يک MIME ناشناخته مواجه شود، پيغام خطاي “File Not Found” را در صفحه نمايش مي دهد.
WAV يکي از فرمتهاي صوتي که کيفيت بالايي هم دارد و البته حجم زيادي هم اشغال مي کند و در سيستم عامل ويندوز بکار مي رود. نوع MIME اين فرمت برابر است با audio/wav . AU اين فرمت متعلق به سيستمهاي عامل UNIX, Linux است و خاصيت آن داشتن حجم کم و البته با کيفيت پايين تر، که نوع MIME اين فرمت برابر است با audio/basic . AIFF اين فرمت هم متعلق به کامپيوترهاي Macintosh است با کيفيت بالا و حجم بسيار بالا. نوع MIME آن برابر است با audio/aiff . MIDI اين فرمت با فرمتهاي ديگر صوتي تفاوتهايي دارد. در اين فرمت بجاي ذخيره شدن فرکانس صدا، آهنگ صدا يا همان نت هاي موسيقي را ذخيره و پخش مي کند. بزرگترين مزيت آن حجم بسيار پايين و عيب آن، پخش آهنگ بدون گفتار است. نوع MIME اين فرمت audio/midi است.
با اضافه کردن تگ
يکي ديگر از راههاي اضافه کردن فايل صوتي به صفحه از طريق قرار دادن لينک و تگ است که بيننده با کليک کردن بر روي آن لينک مي تواند هم آن فايل را بر روي هارد ديسک خود ذخيره کند و يا آنرا از همانجا باز کند. البته در مرورگراينترنت اکسپلورر نسخه 6.0 ابتدا پيغامي ظاهر مي شود که اگر دکمه Yes را بزنيد آن فايل توسط خود مرورگر پخش خواهد شد. در تگ لينک بايد از خصوصيت href براي آدرس دهي استفاده کنيد، فقط دقت کنيد که پسوندها را درست بنويسيد.
افزودن فايل صوتي از طريق objectمثال يکي از بهترين راههايي که مي توان فايل صوتي را به صفحه اضافه کرد، از طريق تگ است. يکي از مزايايي که اين تگ دارد اينست که، شما مي توانيد يک متني را بين تگ آغازين و پايان دهنده اضافه کنيد که اگر مرورگر نتوانست آن فايل را بشناسد، نوشته مذکور در صفحه نمايان شود. در اين تگ براي آدرس دهي از خصوصيت data و براي تعيين MIME آن فايل از خصوصيت type استفاده مي شود، همچنين از خصوصيت height, width براي کنترل طول و عرض لوگوي برنامه پخش کننده فايل استفاده کنيد که در صورت لزوم آنها را برابر با عدد صفر قرار دهيد تا لوگو در صفحه ظاهر نشود.
نکته: هنگاميکه صفحه داراي اين تگ را باز کنيد يک پيغام هشدار در مورد ActiveX ظاهر خواهد شد که براي اجراي فايل بايد دکمه Yes را بزنيد. تکنيک ديگر براي افزودن يک فايل مولتي مديا به صفحه از طريق تگ embed است. اين تگ استاندارد W3C نيست و در بيشتر مرورگرها اجرا نمي شود. از خصوصيت src براي آدرس دهي فايل و براي کنترل طول و عرض لوگوي برنامه کمکي از خصوصيت height, width مي توانيد استفاده کنيد. اين تگ داراي خصوصيات autostart و loop مي باشد که با کلمات false يا true مقدار دهي مي شوند. loop="false" height="40" width="150">
احتمالاً متوجه شديد که راههاي ذکر شده در بالا به درستي جواب نمي دهند و به خاطر مشکلات امنيتي ، مرورگرها فايلها را پخش نمي کنند. اما تکنيک ديگري هم هست که کليه مرورگرها از آن پشتيباني کرده و حتي با استفاده از آن مي توانيد فايلهاي سنگين را هم در صفحات بکار بريد بدون آنکه بيننده زمان زيادي را براي دانلود آنها صرف کند. اين تکنيک استفاده از روش Streaming Audio and Video است که در صفحه بعد به آن مي پردازيم.
:: موضوعات مرتبط: صدا و تصوير در وب , , :: برچسبها: صدا و تصوير در وب در html , آموزش کدنویسی Html , آموزش اچ تی ام ال , :: بازدید از این مطلب : 2538 نوشته شده توسط : رضا
براي دسترسي سريع از لينکهاي زير استفاده کنيد:
هنگاميکه بخواهيد دو يا سه صفحه را در يک صفحه جاي دهيد بايد از عنصر فريم يا چارچوب استفاده کنيد. اين عنصر زماني کارآيي دارد که ميخواهيد يک قسمت، در همه صفحات ثابت باشد. به طور مثال شما در سمت چب صفحه يک ليست ثابت داريد و ميخواهيد هر وقت بيننده روي هر گزينه از اين ليست که کليک کرد توضيحات مربوط به آن در سمت راست نمايان شود. پس ابتدا يک صفحه براي آن ليست درست کنيد و براي اطلاعات هر گزينه هم يک صفحه بسازيد و آنها را در يک فريم بگذاريد. به مجموعه صفحات گنجانده شده در يک صفحه frameset مي گويند و به هر صفحه از آن يک frame يا يک چارچوب گفته ميشود. در ساختار اصلي کدها، ديگر تگ نوشته نميشود و جاي آن تگ قرارميگيرد، البته هر صفحه يعني هر فريم را که کد نويسي ميکنيد مانند ساختار معمولي است و از تگ بايد استفاده کنيد ولي هنگاميکه صفحات را در يک frameset ميگذاريد بايد در ساختار کد آن بجاي از استفاده کرد، توجه داشته باشيد که براي ديدن source code فريمها بايد بر روي هر فريم کليک راست کرده و گزينه view source را انتخاب کنيد و براي مشاهده کدهاي يک frameset بايد از منو view مرورگر اقدام نماييد.
هر فريم ميتواند عمودي يا افقي در صفحه قرار گيرد يا يک frameset مخلوطي از چند فريم عمودي و افقي باشد که هر کدام از آنها توسط خصوصيتي در تگ کنترل ميشوند. به طور مثال اگر دو فريم داشته باشيم و آنها را بخواهيم به صورت عمودي در صفحه قرار دهيم از خصوصيت cols=” “ استفاده ميکنيم و اين خصوصيت را برابر با درصد اشغال هر فريم قرار ميدهيم يعني اگر ما دو فريم داشته باشيم و بخواهيم که يکي از آنها %30 صفحه را اشغال کند پس ديگري %70 را اشغال خواهد کرد و تگ آن بدين صورت ميشود: نوشته شده توسط : رضا
برای دسترسی سريع از لينکهای زير استفاده کنيد:
فرم چيست؟دکمه (button)text field, text arealabelTab orderfile field ايميل فرستاده شود پس به اين نکات بايد دقت کنيد که در تگ اصلي فرم حتماً فرمها تنها عنصري هستند که بيننده سايت ميتواند اطلاعاتي را بطور مستقيم وارد کرده که اين اطلاعات بعد از تجزيه و تحليل يا در فايلي ذخيره شده يا فرستاده ميشود. شما ميتوانيد داخل يک صفحه يا يک وب سايت چندين فرم داشته باشيد بطور مثال براي چند نوع نظرسنجي از بينندگان که هر کدام از اين فرمها را با استفاده از خصوصيت name=” “در تگ بايد نامگذاري کنيد تا اطلاعات مربوط به هر فرم با نام همان فرم پردازش شود. فرمها داراي اجزاي متفاوتي با وظيفه مشخص ميباشند که بايد قبل از تگ پايان دهنده آنها را بکار برد. بعضي از اين اجزا عبارتند از: کادرهاي متني text fields ، قسمت انتخابات چند گزينه اي checkboxes وتک گزينه اي radio buttons ، ليستهاي پايين کشيدني drop-down lists و دکمه هاي تأييد submit وپاک کننده reset . فرمها توسط برنامه هايي نظير ASP, CGI و با افزودن خصوصيات action=” “, method=” “, enctype=” “ در تگ اطلاعات وارده را پردازش کرده و به وب سرور ميفهماند که به چه روش و در کجا اطلاعات ذخيره يا فرستاده شود. وب سرور به کامپيوتري که محتواي سايت شما بر روي آن قرار دارد گفته ميشود.
کليه اجزاي ساخته شده در يک فرم بدون بودن دکمه تأييد بي فايده هستند، چون بعد از فشردن اين دکمه است که اطلاعات وارده در فرم پردازش ميشوند. پس ابتدا به ساختن اين دکمه ميپردازيم. براي ساختن دکمه ها در يک فرم به دو روش ميتوانيم عمل کنيم: روش اول: با استفاده از تگ که داراي دو خصوصيت name=” “براي نامگذاري و type=” “براي مشخص کردن نوع دکمه که submit و يا reset ميباشد . در بين تگ آغازکننده و پايان دهنده هر چي نوشته شود در ظاهر دکمه نمايان ميشود
روش دوم: با استفاده از تگ که مانند روش اول دو خصوصيت name=” “که بايد کلمه button در جلوي آن بيايد و type=” “که ميتواند هم submit باشد و يا reset.
فرقي که اين دو روش با هم دارند در اينست که شما در روش اول هر نوشته اي را بخواهيد در روي دکمه هنگام نمايش صفحه در مرورگر نشان داده ميشود اما در روش دوم شما دخالتي در اين کار نداريد و به صورت پيش فرض کلمه submit , reset نمايان ميشود. البته ميتوانيد بجاي دکمه هاي ساخته شده توسط مرورگراز عکس هم استفاده کنيد يعني شکل يک دکمه را طراحي کنيد و در فرم قرار دهيد که خصوصيت type=” “ را برابر با کلمه image قرار ميدهيد و با خصوصيت src=” “ آن را آدرس دهي ميکنيد: > لازم بذکر است که در اين تکنيک فقط از حالت submit دکمه بايد استفاده کرد.
خب بعد از ساختن دکمه ها ميپردازيم به بقيه اجزاي يک فرم. از اين به بعد ما با تگ وخصوصياتش زياد کار داريم . ما براي وارد کردن متن در فرم بسته به نيازمان از دو مدل کادرمتني ميتوانيم استفاده کنيم، يکي براي وارد کردن يک خط متن کوتاه که چند کلمه بيشتر نباشد و کادر ما هم به صورت خطي ميباشد و ديگري براي يک متن بلند است و کادر ما داراي چندين رديف ميباشد. در مدل اول ازاين تگ استفاده ميکنيم:
دقت کنيد که کلمه text بايد در جلوي خصوصيت type=” “بيايد تا مرورگر بفهمد چه اجزائي از يک فرم را نمايش ميدهد. توسط خصوصيت size=” “ که با عدد مقدار دهي ميکنيد اندازه نمايش اين کادر خطي در مرورگر را کنترل ميکنيد و توسطmaxlength=” “ حداکثر تعداد حروفي را که بيننده مجاز هست تا وارد کند را کنترل ميکنيد. Textfield : اگر قرار باشد که بيننده داخل اين کادر خطي ، کلمه رمز را وارد کند پس بجاي خصوصيت type=”text” بايد از type=”password” استفاده کنيد تا هر متني که وارد شود بصورت ستاره در مرورگر نمايش داده شود. Password : اما مدل ديگري هست که متنهاي بلند داخل آن نوشته خواهد شد که بايد از تگ استفاده کنيد که جدا از خصوصيت name=” “از خصوصيات cols=” “ , rows=” “براي کنترل رديفها و ستونهاي کادر بکار ميبريد.
زمانيکه شما اجزاي فرم را اضافه مي کنيد، مي توانيد کنار هر کدام يک متني وارد کنيد تا نام آن قسمت درمرورگر مشخص شود. اما با افزودن تگ که اين کد به صورت زير ظاهر مي شود، دراين تگ، توسط خصوصيت for مي توانيد مشخص کنيد که label مربوط به کدام قسمت فرم است و در اين حالت نيازي به احاطه کردن اجزاي فرم نيست،
يکي از خصوصيات مفيد تگهاي html بنام tabindex است که کاربرد زيادي در عنصر فرم دارد و به همين خاطر در اين قسمت آنرا توضيح ميدهيم. تاکنون متوجه شده ايد که با زدن دکمه Tab بر روي کيبورد، مکان نما با ترتيب خاصي بر نقاط مختلف صفحه متمرکز مي شود که مي توانيم اين ترتيب حرکت را به کنترل خود در بياوريم. قبول کنيد که حرکت کردن بين اجزاي يک فرم توسط موس مخصوصاً زمانيکه يک فرم طولاني پيش رو داريم، بسيار سخت تر از حرکت با دکمه Tab کيبورد است. با اضافه کردن خصوصيت tabindex به تگهاي يک فرم و مقداردهي اين خصوصيت به ترتيب اعداد مي توانيم تمرکز مکان نما را از يک نقطه به نقطه مورد نظر به کنترل خود در آوريم. دقت کنيد که مقادير اين خصوصيت تکراري نباشد. به کد زير توجه بفرماييد:
گاهي اوقات نياز هست که به همراه اطلاعات وارد شده در فرم، فايلي هم ضميمه و به سرور فرستاده شود. براي اين حالت بايد در فرم، تگ را نوشت و خصوصيت type آنرا برابر با کلمه file قرار داد. هنگاميکه اين خصوصيت را وارد مي کنيد، مرورگر بطور اتوماتيک يک کادر متني و يک دکمه براي جستجوي فايل بنام Browse نمايان مي کند. در نظر داشته باشيد که براي اين تگ تنظيمات وب سروربسيار مهم است وگرنه فايل فرستاده شده، خراب خواهد شد و اگر هم فرم قرار است که بهenctype="multipart/form-data" را نوشته و در تگ file field هم accept="text/plain" را وارد کنيد که در اين حالت فايلهاي متني txt به درستي فرستاده مي شود. کلاً در بيشتر مواقع و با تنظيمات درست هم ممکن است فايل خراب شود.
:: موضوعات مرتبط: فرم ها , , :: برچسبها: ساخت اجزای فرم در html , آموزش کدنویسی Html , آموزش اچ تی ام ال , :: بازدید از این مطلب : 675 نوشته شده توسط : رضا
برای دسترسی سريع از لينکهای زير استفاده کنيد:
جدولها يکي از بهترين و مفيدترين عنصرها در صفحات وب ميباشند، با استفاده از آنها ما مي توانيم اطلاعات و عناصررا در يک صفحه سازمان دهي و مرتب کنيم . کليه اطلاعات يا عناصر ديگر وب را ميتوانيم داخل رديف ها يا ستون هاي يک جدول قرار دهيم بدون آنکه خطوط جدول مشخص باشد و يا در صورت نياز خطوط آنها نمايان ميشود. کمتر کسي را پيدا ميکنيد که از اين عنصر استفاده نکند و زمانيکه تجربه کافي براي طراحي يک سايت بدست آورديد به اهميت اين عنصر پي خواهيد برد.تگ مشخصه جدول استفاده ميکنيم. پس ساختار کلي يک جدول بدين صورت ميباشد:
|
هر چه تگهاي رديف و ستون بيشتر باشد به همان اندازه ما در جدولمان خانه خواهيم داشت. مجموعه کد بالا نشان دهنده يک جدول با يک رديف و يک ستون است يعني اين جدول داراي يک خانه ميباشد. يکي از ويژگيهاي جدول که محبوبيت آنرا زياد ميکند اينست که هر خانه از آن ميتواند به طور مجزا زمينه رنگي و يا عکسي در زمينه آن داشته باشد البته اندازه هاي هر خانه هم ميتواند متفاوت باشد.
خب براي اينکه بتوانيم يک جدول را در مرورگر خود ببينيم بايد با خصوصيت border=" " آشنا شويم. اين خصوصيت دور جدول يک کادردرست ميکند البته اگر اين خصوصيت را برابربا صفر قرار دهيم يا آنرا ننويسيم کادر دور جدول در مرورگر نمايان نخواهد شد و هر چه عدد بزرگتري بگذاريم کادر ضخيم تري خواهيم داشت، در ضمن bordercolor=" " که برابر با عدد هگز رنگ است تعيين ميشود. border ويژگيهاي ديگري هم دارد، به طور مثال شما ميتوانيد خصوصيت frame=" " را به تگ ويژگي ديگري هم هست ولي بهتره اول يک جدول درست کنيد تا مطلب جا بيافتد، برنامه Notepad را باز کنيد و کد زير را وارد کرده و به اسم Table.htm ذخيره کنيد: حالا خصوصيت rules=" "را به تگ ميتوانيد با استفاده از خصوصيت align=" "که در تگ با خصوصيات height=" " , width=" " هم اندازه طول و عرض يک جدول را ميتوان کنترل کرد که بايد آنها را برابر با عدد در مقياس پيکسل قرار دهيد در ضمن شما ميتوانيد از درصد % هم استفاده کنيد مانند width="90%" که اين جدول نود درصد عرض يک صفحه را اشغال ميکند. براي تعيين رنگ زمينه يک جدول ازbgcolor=" " که با عدد هگز رنگها مقدار دهي ميشود استفاده ميکنيم. اين خصوصيت را در تگ هاي تگ حالا که با درست کردن رديف و ستون در جدول آشنا شديد، ميتوانيد براي هر ستون و رديف عنوان گذاري کنيد و يک تيتر به بالاي ستون يا به ابتداي يک رديف اضافه کنيد. در هر قسمت که شما به يک تيتر و عنوان نياز داشتيد بجاي تگ گاهي اوقات شما نياز داريد تا چند خانه در يک رديف يا يک ستون از جدول را ترکيب کنيد تا يک خانه درست شود و بطور مثال يک تيتر و عنوان در آن قرار دهيد که براي ترکيب خانه هاي يک ستون از خصوصيت rowspan=" " و براي يک رديف از colspan=" " در تگ بطور معمول هر جدول داراي يک اسم و يا يک توضيح ميباشد که آنرا با تگ اگر جدول شما داراي ستونها و رديفهاي زيادي است پس تکرار خصوصيات در هر تگ مربوطه بسيار دشوار است. شما ميتوانيد بصورت گروهي اين خصوصيات را کنترل کنيد. براي کنترل رديفها بايد آنها را به سه قسمت تقسيم کرد، قسمت سرشامل فقط خانه هاي رديف اول، بدنه شامل همه رديفهاي وسط و قسمت انتهايي شامل فقط خانه هاي آخرين رديف، که قسمت سر را با ، قسمت بدنه را با و قسمت انتهايي را با کنترل ميکنيم. اين تگ داراي خصوصيت align نيز ميباشد. همچنين با تگ يک خصوصيت ديگر نيز براي تگ به اين موضوع هم توجه داشته باشيد که شما ميتوانيد داخل يک جدول، جدول ديگري هم درست کنيد يعني داخل هرخانه جداگانه يک جدول بسازيد که به اين روشNested table گفته ميشود. Image map يکي از تکنيکهاي ساخت عکس بصورت لينک است که گاهي اوقات به کمک ما ميايد. بطور مثال ما نقشه ايران را در صفحه اي قرارداده و ميخواهيم که بيننده سايت هرگاه روي يک استان کليک کرد صفحه مربوط به آن باز شود تا اطلاعات مربوطه را در اختيار کاربر قرار دهد. اين حالت حجم عکس را افزايش نخواهد داد و بهتر است از عکسهايي با حجم بالا استفاده نکنيم که در اين مورد به قسمت عکسها رجوع کنيد. خب حالا عکس مورد نظر را با استفاده از تگ درصفحه قراردهيد، سپس خصوصيت usemap=" " را به تگ اضافه کنيد که آنرا برابربا يک اسم واحد بايد قرار دهيم تا از آن اسم در جاي ديگر استفاده شود. اين خصوصيت به مرورگر ميفهماند که عکس را بصورت Image map ميخواهيم بکار بريم. "images/mypic.gif" usemap="#map01"> به علامت # دقت کنيد که بايد نوشته شود. در حال حاضر عکس آماده است و بايد تگهاي نقشه را وارد کنيم.ابتدا تگ map01"> وارد ميکنيم تا مرورگر بفهمد که نقشه آغاز شده و با استفاده از خصوصيتname=" " مشخص ميشود که چه عکسي قرار است اين خاصيت را داشته باشد. حالا نوبت به تعيين قسمتهاي مختلف عکس رسيده که هر قسمت در چه اندازه اي و به کجا بايد لينک شود. اين قسمتها ميتوانند اشکال هندسي نظيردايره، چهارگوش وچند ضلعي باشند. اين اطلاعات در تگ مشخص ميشوند، اين تگ داراي سه خصوصيت ميباشد: Shape=" " مشخص ميکند که هر قسمت داراي چه شکل هندسي ميباشد. اگر چهارگوش rectangle باشد آنرا برابر با "rect" قرار ميدهيم، اگر دايره circle بخواهيم برابر با "circle" و اگر چند ضلعي polygon بخواهيم برابر با "poly" قرار ميدهيم. Coords=" "اين خصوصيت، مختصات نقاط تشکيل دهنده شکلها را مشخص ميکند که مختصات هر نقطه بر اساس محور x, y در مقياس پيکسل ميباشد. براي تشکيل يک لينک به شکل چهارگوش بايد مختصات دو نقطه گوشه چپ طرف بالاوگوشه راست طرف پايين آنرا بدست بياوريم ، چون هر نقطه داراي دو مختصات ميباشد يکي بر روي محور xها و ديگري yها پس چهار عدد بايد بنويسيم و هر عدد را با علامت کاما جدا کنيم. Coords="10,10,65,65" همچنين براي درست کردن يک لينک به شکل دايره مختصات مرکز آن و اندازه طول شعاع را بايد پيدا کنيم که با توجه به گفته بالا سه عدد بايد نوشته شود و براي چند ضلعي به تعداد هر نقطه دو عدد مينويسيم که ديگر محدوديت ندارد. href=" " که در اين قسمت آدرس صفحه يا سايت مورد نظر را وارد ميکنيم. خب سوالي که حالا پيش ميايد، اينست که مختصات اين نقاط را چگونه پيدا کنيم؟ دو راه براي آن وجود دارد، يکي استفاده از برنامه هاي مختلف مانند Photoshop و ديگري که برايتان توضيح خواهم داد بدون استفاده از برنامه جانبي است و داخل همان صفحه ، با کمک مرورگر اينترنت اکسپلورراست. بعد از اينکه يک عکس را در صفحه قرار داديم و مراحل تشکيل Image map را انجام داديم يک تگ و يک خصوصيت به اين کدها اضافه ميکنيم و آنچه را که ميخواهيم براحتي بدست مياوريم. ابتدا تگ مخصوص لينک را قبل از<img> قرار ميدهيم تا عکس ما بصورت يک لينک ظاهر شود و سپس خصوصيت ismap را به تگاضافه ميکنيم و فايل را ذخيره ميکنيم. حالا آنرا باز کرده و همانطور که موس را روي عکس حرکت ميدهيد يک نگاه به نوار وضعيت status bar مرورگر در پايين بياندازيد، اعدادي را که مشاهده ميکنيد مختصات نقاط ميباشند. فراموش نکنيد که بعد از پيدا کردن مختصات نقاط، تمام مراحلي را که اضافه کرديد دوباره برداريد. برای دسترسی سريع از لينکهای زير استفاده کنيد: فرمتهای عکس در وب يکي از عناصري که باعث جذابيت در وب سايت ميشود عنصر عکس يا همان image است. عکسها زيبايي خاصي به صفحات ميبخشند ولي از طرف ديگر توليد دردسر هم ميکنند، اگر شما تعداد زيادي عکس در يک صفحه بگذاريد يا از عکسهايي با حجم زياد استفاده کنيد آن موقع است که بيننده بايد مدت طولاني را صرف کند تا صفحه سايت شما را به طور کامل ببيند و همين موضوع باعث از دست دادن يک بيننده و يک نمره منفي به حساب ميايد. همانطور که ميدانيد در کشور عزيزمان ايران سرعتهاي اينترنت خيلي پايين هست و ديدن صفحات سنگين بسيارعذاب آور است البته بماند که بعضي وقتها همان يک ذره سرعت هم نداريم. پس هميشه تا جايي که ميتوانيد صفحه را سبک کنيد تا براي بيننده خسته کننده نباشد. يک سايت موفق سايتي است که بيننده زياد داشته باشد. خب بپردازيم به ادامه بحث ، عکسها داراي فرمتهاي زيادي ميباشند ولي فرمتهايي که در وب بکار برده ميشوند، عبارتند از: .gif (Graphic Interchange Format) .jpeg (Joint Photographic Experts Group) .png (Portable Network Graphics) عکسها با فرمت .gif بيشترين استفاده را در وب دارند و محبوبترين نوع عکس است. اين نوع فرمت 256 رنگ را پشتيباني ميکند و از ويژگيهاي ديگر آن animation, transparency, interlacing است . البته محبوبيت آن بيشتر براي حجم کم آن است. Transparency به شفافيت يک عکس ميگويند که آنرا پشت نما هم مينامند. اين ويژگي است که يک عکس آنقدر شفاف است که شما ميتوانيد تا تصوير ، متن يا رنگ زير آن عکس را ببينيد. Interlacing گاهي وقتها شما منتظر ميشويد تا يک عکس به دليل بزرگي اندازه بارگذاري شود بعد آنرا ببينيد اما اگر عکسي اين ويژگي را داشته باشد کم کم عکس کامل خواهد شد يعني خط به خط به عکس اضافه ميشود تا کامل بارگذاري شود. Animation عکسهاي متحرک را مي گويند وفقط اين فرمت هست که از متحرک سازي عکس حمايت ميکند. عکسهايي با فرمت .jpeg حدود 16 ميليون رنگ را پشتيباني ميکنند ، نسبت به فرمت .gif از حجم بالاتري برخوردار است ولي کيفيتش بهتر است ، تمام ويژگيهاي gif را دارد به غير از Animation. فرمت .png نسبت به قبليها جديدتر است و مخلوطي از آنهاست يعني کيفيت jpeg و حجم کم gif را دارد. مانند همه عناصر داخل صفحه، عنصر عکس هم تگ خاص خودش را دارد که آن تگ و پايان دهنده هم ندارد. اما براي مشخص کردن فايل عکس و آدرس دهي آن بايد از خصوصيت src=" " داخل تگ استفاده کنيم که اگر يک عکس داخل دايرکتوري وب سايت خودتان باشد ديگر نيازي به آدرس کامل نيست و فقط اسم دايرکتوري و اسم فايل با پسوند مشخصه آن عکس نوشته ميشود ولي اگر ميخواهيد که عکسي را از وب سايت ديگري در صفحه خود بگذاريد بايد آدرس آن وب سايت و دايرکتوري که عکس در آن قرار گرفته و اسم کامل آن فايل را بنويسيد مانند: اين تگ خصوصيات ديگري هم دارد، يکي از آنها که کاربرد زيادي هم دارد خصوصيات طول height و عرض width ميباشد که توسط آنها اندازه يک عکس را داخل صفحه ميتوانيد کنترل کنيد. مقياس اندازه گيري طول و عرض بر حسب پيکسل Pixel ميباشد، اگر شما اين خصوصيات را کنترل نکنيد عکس در اندازه اصلي خود ظاهر ميشود. بطور مثال شما ميخواهيد عکسي را وارد کنيد که در صفحه بايد به اندازه 100×100 فضا اشغال کند: اين نکته را در نظر داشته باشيد که سرعت کامل شدن عکس يعني download شدن آن در صفحه بستگي به حجم آن دارد نه اندازه عکس، پس ميتوانيد اندازه هاي يک عکس را اضافه کنيد ولي دقت کنيد که کيفيت عکس خراب نشود. شما ميتوانيد محل قرارگرفتن عکس را نسبت به عناصر اطراف خودش با خصوصيت align=” “تعيين کنيد و ميتوانيد کلمات left,right,top,middle,bottom را براي اين خصوصيت بکار بريد. بر فرض ميخواهيد که يک متن بعد از عکس و در وسط قرار گيرد: This is a text در ضمن اگر ميخواهيد خود عکس در وسط صفحه قرارگيرد بايد از تگ اگر مايل هستيد براي عکس کادر بگذاريد ميتوانيد از خصوصيت border=” “ استفاده کنيد و آنرا برابر با يک عدد قرار دهيد که هر چه اين عدد بزرگتر باشد ، کادر دور عکس هم ضخيم تر است به صورت پيش فرض border=”0” است يعني هيچ کادري مشاهده نميشود. تا حالا متوجه شديد که در يک وب سايت هنگاميکه نشانگر موس بر روي يک عکس که قرار ميگيرد يک کادر متني کوچک باز شده بنام tooltip و اطلاعاتي را راجع به آن عکس ميدهد؟ پس شما هم اينکار را انجام دهيد، خصوصيت alt=" " را داخل تگ گذاشته و هر متني را که جلويش بنويسيد در صفحه هنگاميکه موس بر روي عکس قرار گيرد ، زيرنشانگر نمايان ميشود. بهتر است که شما هميشه اين کار را انجام دهيد چون مرورگرهايي وجود دارد که عکس را نمايش نميدهد پس با اينکار بيننده از حضور آن عکس خبر دار ميشود. دو خصوصيت ديگر هست که حاشيه و فضاي خالي دور عکس را کنترل می کند، hspace=” “براي حاشيه چپ و راست عکس وvspace=” “ براي بالا و پايين. عددي را که وارد ميکنيد در مقياس پيکسل است. Image link لينک آشنا شديد، در اينجا شما ميتوانيد يک عکس را به صورت لينک هم درست کنيد يعني هرگاه بيننده روي عکس کليک کرد به صفحه يا سايت ديگر هدايت شود. در بخش قبل با درست کردن شما بايد تگ لينک را قبل از تگ عکس بنويسيد و تگ پايان دهنده لينک را بعد از تگ عکس وارد ميکنيد، بدين صورت: در ضمن ميشود براي قسمتهاي مختلف يک عکس لينکهايي به جاهاي مختلف درست کرد. به فرض مثال ما يک عکس از نقشه ايران داريم و ميخواهيم که روي هر استان کليک شود ، آن قسمت لينک شود به صفحه مورد نظر. اين حالت را Image map مي گويند که در بخش بعد آنرا توضيح خواهم داد. برای دسترسی سريع از لينکهای زير استفاده کنيد: لينکها يا همان نقاط پيوند صفحات هم، يک نوع متن به حساب مي آيند، فقط تنها فرقي که بين آنها وجود دارد در اين است که هنگاميکه با موس بر روي آنها ميرويم نشانگر موس شکل دست به خود گرفته تا ما بر روي آن کليک کنيم، البته در بيشتر مواقع رنگ آن هم با متن هاي معمولي فرق دارد. پس از کليک کردن روي لينکها، ما به صفحات ديگر يا حتي به سايتي ديگر هدايت ميشويم. تگ مخصوص لينک > ميباشد که با خصوصيت href آدرس دهي ميشود که آن لينک به کجا وصل خواهد شد. به طور مثال اگر ما بخواهيم يک لينک درست کنيم که به سايت yahoo متصل شود بدين صورت عمل ميکنيم، که در مرورگر لينک زير ظاهر ميشود و ما را به سمت سايت ياهو حرکت ميدهد دقت کنيد فقط متني که مابين دو تگ آغاز کننده يعني و تگ پايان دهنده نوشته شود در مرورگر به شکل لينک ظاهر ميشود و قابل کليک است همانطور که مشاهده ميکنيد به صورت پيش فرض رنگ لينکها آبي بوده و زير آنها خط کشيده ميشود که در بخش Style Sheet شما ياد خواهيد گرفت تا اين خط را برداشته يا رنگ آن را تغيير دهيد. لينکها را مي توان به دو دسته داخلي و خارجي تقسيم کرد، همانطور که از اسمشان پيداست لينکهاي داخلي نقاط پيوند داخل يک صفحه يا صفحات مختلف يک وب سايت ميباشند و لينکهاي خارجي نقاط پيوند بين دو سايت مختلف ميباشند. Absolute and Relativetarget فريم که لينک قرار دارد نمايش داده ميشود. لينکهاي داخلي به دو صورت نوشته ميشوند، يا بايد آدرس کامل وب سايت و فايل را نوشت مانند: به اين مدل لينک absolute ميگويند. و يا اينکه فقط اسم فايل را بنويسيم البته اگر آن فايل داخل يک دايرکتوري است بايد ابتدا اسم آن دايرکتوري را نوشته سپس نام فايل را مينويسيم. به فرض مثال اگر لينک ما قرار است به يک صفحه به اسم Page01.htm در دايرکتوري بنام htmlpages متصل شود مجموعه کدي که بايد نوشته شود بدين صورت است: به اين مدل relative مي گويند. دقت کنيد دوستان وقتي صفحه اي که قرار است به اين لينک ما پيوند داده شود دردايرکتوري پايين تر از اين صفحه قرار دارد اينگونه عمل ميشود اما اگر لينک ما در صفحه اي قرار دارد که قرار است به يک صفحه در دايرکتوري بالاتر از آن متصل شود مي توانيم به جاي اسم دايرکتوري بالاتر از دو نقطه کنار هم( .. ) استفاده کنيم، به طور ساده مي توان گفت که اگر اين صفحه قرار است به صفحه اي داخل دو فولدر تو در تو متصل شود بايد اسم فولدر اول بعد اسم فولدر داخل فولدر اول سپس اسم آن فايل يا صفحه را مينويسيم ولي اگر در آن صفحه بخواهيم يک لينک بگذاريم که به اين صفحه پيوند داده شود جاي فولدر داخلي و فولدر اول ميتوانيم دو نقطه بگذاريم و سپس اسم اين فايل را بنويسيم يعني بدين شکل: تگ لينک خصوصيتي دارد که توسط آن مي توانيد محل باز شدن و يا نمايش صفحه اي که مي خواهيد به آن پيوند دهيد را کنترل کند که آن صفحه در همان پنجره يا در يک پنجره جديد باز شود. اين خصوصيت target نام دارد که بايد برابر با يکي از مقادير _blank , _self , _top , _parent قرار گيرد. _self _parent _top يک نوع لينک هم هست که دو نقطه را در داخل يک صفحه بهم متصل ميکند که به آن anchor مي گويند. کاربردهاي گوناگوني دارد ولي بيشترين کاربرد اين نوع لينک براي مواقعي است که طول يک صفحه از سايت زياد شده و در انتهاي همان صفحه شما يک لينک مي گذاريد تا با کليک کردن بر روي آن بيننده سايت شما به بالاي همان صفحه هدايت شود. براي اينکار دو سري تگ لازم است که بايد بنويسيد، يکي جايي است که ميخواهيد لينک به آن متصل شود که بايد آن نقطه از صفحه را نامگذاري کنيد و اين اسم بايد داخل همان صفحه تک باشد يعني در جاي ديگر بکار نبرده باشيد و تگ آن به اين صورت است: در بين دو علامت " " و به جاي کلمه top هر اسمي ميتوانيد بکار بريد اين نکته را در ذهن داشته باشيد که اين تگ درمرورگر ظاهر نميشود.اما تگ ديگري که نياز است خود کد لينک است وبجاي نوشتن آدرس فايل در خصوصيت href شما نامي را که انتخاب کرديد به اضافه علامت # را مينويسيد: در مورد لينکهاي خارجي يعني لينکهايي که به سايتهاي ديگر وصل ميشوند بايد از مدل absolute استفاده کنيد و آدرس کامل را بنويسيد: نکته: نوشتن پروتکل http:// اجباري نيست و ميتوانيد از نوشتن آن صرف نظر کنيد. علاوه بر اين لينکها شما ميتوانيد براي آدرسهاي ايميل هم لينک درست کنيد که تگ آن به صورت زير ميباشد: کلمه mailto: به مرورگر ميفهماند که بايد يک ايميل به آدرس بعد از آن فرستاده شود. البته اين لينکها براي بيننده هايي که ايميل هايشان را با برنامه هايي مانند Outlook express چک ميکنند ، مفيد است چون وقتي که روي اين نوع لينک کليک شود برنامه پيش فرض مديريت ايميل در سيستم عامل کاربر باز ميشود پس براي بيننده هايي که آدرس ايميل ياهو دارند اين کد مفيد نيست بهتر است که آدرس کامل ايميل را نوشته و به صورت يک لينک درست کنيد تا براي کليه بينندگان سايت مفيد باشد، مانند مثال زير: البته شما ميتوانيد حتي موضوع و متن ايميل را تعيين کنيد. اگر قصد همچين کاري را داريد پس بايد بلافاصله بعد ازآدرس ايميل داخل تگ يک علامت سوال اضافه کنيد تا مرورگر بفهمد که اين آدرس ادامه دارد و بعد از علامت سوال کلمه subject= را مينويسيد که اين کلمه نشانگر موضوع ايميل است و هرچيزي که جلوي آن نوشته شود به عنوان موضوع ايميل در برنامه مشخصه نمايان خواهد شد و اگر متن ايميل هم بخواهيد نوشته شود بايد بعد از موضوعي که نوشتيد علامت & را بگذاريد وسپس کلمه body= را که نشانگر متن ايميل است و در جلوي علامت مساوي هر متني را ميتوانيد وارد کنيد. بر فرض مثال ميخواهيد که ايميل با موضوع Test و متن Hello my friends به آدرس ايميل فرستاده شود: توجه داشته باشيد که اگر ميخواهيد اين کد را امتحان کنيد اول بايد برنامه پيش فرض مديريت ايميل مانند نرم افزار Outlook را براي آدرس ايميل خود تنظيم کنيد. برای دسترسی سريع از لينکهای زير استفاده کنيد: ليستها هم جزو عنصر متن در html ميباشند که بخاطر زياد بودن تگهاي متن مجبورم آنها را از هم جدا کنم. سه نوع ليست وجود دارد، يکي ليستهاي با ترکيب منظم (Ordered list) و ليست با ترکيب نا منظم (Unordered list) وديگري ليستهاي توصيفي (Definition list) . شايد اين نوع نامگذاري بخاطر وجود اعداد يا حروف بترتيب در ليست منظم است که در ديگري فقط نقطه هاي توپر هست که ترتيبي را نميتوان براي آنها در نظر گرفت. در هر صورت تگهاي آن به شرح زير ميباشند: براي درست کردن ليست در يک صفحه از اين تگها بايد استفاده کنيم، بدين صورت که در آغاز قسمتي که ميخواهيم ليست درست کنيم تگ اگر دقت کنيد به صورت پيش فرض اعداد 1,2,3 به ابتداي گزينه هاي ليست مان اضافه ميشود. شما ميتوانيد خصوصيت type را به تگ اين تگ را unordered list مينامند و مانند تگهاي بالا براي درست کردن ليست در يک صفحه ميباشد با اين تفاوت که بجاي حروف و اعداد از دايره يا مربع هاي توپر استفاده ميکند که مانند بالا ميتوانيد از خصوصيت type که با کلمات” disc”, “circle”, “square” مقدار دهي ميشود استفاده کنيد. شما ميتوانيد براي درست کردن يک ليست که داراي چند گزينه است و هر گزينه هم چند زير مجموعه دارد از مخلوط اين دو نوع ليست استفاده کنيد که به اين حالت Nested list گفته ميشود. بر فرض مثال ما يک ليست داريم که چهار گزينه دارد و هر کدام از آنها دو رنگ سفيد و سياه دارند: آخرين مدل، ليستهاي توصيفي هستند که براي تعريف و توصيف يک کلمه بکار ميروند که کلمه مشخص را با تگ و توصيف آنرا با بکار ميبرند. همانطور که دربخشهاي قبل گفته شد، هرمتني را بين تگهاي وارد کنيد بعد از ذخيره آن فايل با پسوند.html يا.htm و هنگام نمايش فايل در مرورگر آنرا مشاهده خواهيد کرد که متن مورد نظر با تنظيمات مرورگر نمايان خواهد شد. ولي ما با استفاده از تگهاي اين عنصر کنترل نمايش نوشته ها را بدست خود ميگيريم تا همان چيزي که مورد نظر ما است نشان داده شوند. تگهاي متن را ميتوان به دو دسته تقسيم کرد، تگهاي اوليه که بيشتر وظيفه خط بندي، پاراگراف بندي و يا تنظيمات در ارتباط با متن را به عهده دارند و تگهايي که شکل و آرايش حروف را کنترل ميکنند که به آنها formatting مي گويند. بهتر است که Notepad يا هر برنامه ويرايشگر متن را که داريد باز کنيد و هر کدام از اين تگها را امتحان کنيد تا کاربرد آنها در ذهن شما جاي گيرد. ... <hr> width=" "طول خط را کنترل ميکند که هم با عدد در مقياس پيکسل و هم با درصد ميتوان مقدار دهي کرد. align=" " که محل قرار گيري خط در يک سطر را کنترل ميکند. color=" " size=" " اين خصوصيت ضخامت خط را تعيين ميکند که هرچه عدد بزرگتر باشد ، ضخامت بيشتر است. بصورت پيش فرض خط داراي سايه ميباشد و اگر خصوصيت noshade را به تگ اضافه کنيد ديگر سايه را نشان نميدهد.مثال <marquee>> align=" "محل قرار گرفتن متن را تعيين ميکند که با کلمات top, middle, bottom مقدار دهي ميشود. behavior=" "اين خصوصيت نحوه حرکت متن را کنترل ميکند که آنرا برابر با scroll اگر قرار دهيم، متن بصورت متناوب از يکطرف صفحه وارد و از طرف ديگر خارج ميشود و اگر برابر با alternate قرار دهيم ، متن از صفحه خارج نميشود و در عرض مرورگر حرکت ميکند، همچنين اگر برابر با slide باشد ، متن از يکطرف وارد صفحه شده و در طرف ديگرميايستد. bgcolor=" " direction=" "جهت ورود متن به صفحه را کنترل ميکند و با کلمات left, right, top, down که از چپ ، راست، بالا و پايين ميتواند وارد شود. height=" "ارتفاع کادر marquee را به عدد در مقياس پيکسل يا به درصد تعيين ميکند. hspace=" " حاشيه چپ و راست را کم وزياد ميکند. loop=" "تعداد چرخش متن را کنترل ميکند. scrolldelay=" " سرعت حرکت متن را تعيين ميکند. vspace=" " حاشيه بالا و پايين متن را مشخص ميکند. width=" " عرض کادر را کنترل ميکند. <-- !.....--> قسمت مقدماتي آموزش جاوااسکريپت به پايان رسيد و همانطور که مشاهده کرديد دستورات اين زبان، توضيح داده شد تا با استفاده از آنها بتوانيد اسکريپتهايي براي صفحات وب خود بنويسيد و يا اگر با اسکريپتي برخورد کرديد، کاملاً آنرا درک کنيد و مطابق نياز خود آن را اصلاح کنيد. فراموش نکنيد که اين دستورات و کدها را مرتب تمرين کرده و اسکريپتهاي جديد و ساده براي خود بسازيد تا اين زبان در ذهن شما قرار گيرد. بهترين راه به خاطر سپردن دستورات جاوااسکريپت خلق کدهايي براي خودتان و ديگران است. هرگاه خواستيد که اسکريپتي خلق کنيد، ابتدا آنرا در ذهن خود بررسي کنيد که اين اسکريپت چه کاري بايد انجام دهد و چه نتيجه اي را مي خواهيد از آن بگيريد، سپس افکارتان را روي کاغذ پياده کنيد با جزئيات کامل که چه اطلاعاتي را بايد دريافت کنيد و توسط چه دستوراتي آنرا پيش ببريد و در آخر چه نتيجه اي بايد بدهد. هنگام خلق يک اسکريپت نکاتي را بايد در نظر داشته باشيد: سعي کنيد بعد از هر خط علامت ; را بگذاريد تا پايان آن خط مشخص شود. document.write ( " text string " ); جاوااسکريپت case sensetive است يعني به حروف کوچک و بزرگ حساس است و بين آنها فرق مي گذارد. در جاوااسکريپت myFunction با myfunction تفاوت دارد. دقت کنيد کليه علامتها مانند پرانتز، آکلاد و کروشه در هر جا که مي نويسيد بايد دوباره آنها را ببنديد. ( { [ ..... ] } ) جاوااسکريپت فاصله هاي اضافي را در نظر نمي گيرد، پس شما مي توانيد براي خوانا بودن کد خود فاصله هايي را اضافه کنيد. دو خط زير تفاوتي با هم ندارند: var name="value"; در نظر داشته باشيد که يک خط کد جاوااسکريپت حتماً بايد در يک خط نوشته شود و نمي توانيد ادامه آنرا در خط بعدي بنويسيد، مگر اينکه به انتهاي صفحه برسيد و خود به خود به ابتداي خط بعد هدايت شويد. اما در ميان رشته هاي متني با گذاشتن علامت \ مي توانيد به خط بعد رفته و ادامه دهيد. document.write ( " Hello \ شما مي توانيد جلوي کدهاي خود يک توضيح و يا يک نظريه را وارد کنيد تا براي مراجعتهاي بعدي يک سر نخي داشته باشيد و سريع متوجه بشويد که آن قسمت از اسکريپت، چه کاري را انجام مي دهد و يا اينکه شما يک اسکريپت براي يک فرد مبتدي مي سازيد و مي خواهيد بعضي از قسمتهاي کد را توضيح دهيد که براي اين منظور ها مي توانيد در هر خط از اسکريپت که مي خواهيد علامت // گذاشته و سپس آن توضيح را بنويسيد. document.write( " text " ) ; // your comment اگر هم نظريه يا توضيح شما بيشتر از چند کلمه است مي توانيد به صورت زير عمل کنيد: /* This is a comment لازم بذکر است که اين توضيحات و نظريات در صفحه نمايش داده نمي شوند. در حال حاضر کليه مرورگرها از جاوااسکريپت پشتيباني مي کنند ولي بعضي ممکن است از مرورگرهاي قديمي استفاده کنند و يا مرورگرهايي که قابليت جاوااسکريپت را نداشته باشند، بکار برند. در اين حالت شما يک تگ بعد از مجموعه اسکريپت خود به تگهاي اچ تي ام ال صفحه اضافه مي کنيد به اسم noscript و متني را داخل آن مي نويسيد تا به آن کاربر نشان داده شود و کاربر از کدهاي جاوااسکريپت آن صفحه با خبر شود.
براي دسترسي سريع از لينکهاي زير استفاده کنيد: در بخشهاي قبل با شئ هاي درون ساخت جاوااسکريپت آشنا شديد. در اين صفحه قصد داريم شئ هاي مربوط به HTML DOM را توضيح دهيم. ابتدا اجازه دهيد در مورد DOM يک توضيحي بدهم که اصلاً DOM چي هست؟ W3C است: " The Document Object Model is a platform- and language -neutral interface that will allow programs and scripts to dynamically access and update the content, structure and style of documents. The document can be further processed and the results of that processing can be incorporated back into the presented page. This is an overview of DOM-related materials here at W3C and around the web. " اما به زبان ساده، DOM رابطه بين عناصر HTML مانند متن ها، عکس ها و غيره را با همان سند اچ تي ام ال بيان مي کند. اين يک فرآيندي است که به برنامه ها و اسکريپت ها اجازه دسترسي به محتوا و ساختار داخلي پنجره مرورگر را ميدهد تا آنها بتوانند بصورت آزادانه تغييراتي ايجاد کنند که نتيجه اين تغييرات در صفحه وب نمايان شود. در همين رابطه زباني بنام DHTML بوجود آمد که با ترکيب کردن عناصر اچ تي ام ال با استايل شيت و اسکريپتها مي تواند محتواي اسناد وب را بصورت متحرک و پويا درآورد. در اينجا پويا بودن فقط به اين منظور نيست که متنها حرکت کنند و از يک طرف وارد بشوند و از طرف ديگر خارج؛ ممکن است لينکها هر بار شما را به يک سايتي پيوند دهند و يا عکس ها مرتب تغيير کنند، کلاً هر تغييري که نياز به کدنويسي مجدد براي آن سند را نداشته باشد، منظور پويا بودن را مي رساند. همانطور که در شکل مشاهده کرديد از شئ window تا شئ Document جزو دسته BOM مي باشند و اشياء بعد از Document در دسته DOM قرار مي گيرند. ناگفته نماند که در حال حاضر کمتر صحبت اصطلاح BOM مي شود و کلاً اين مجموعه را DOM مي گويند. شما بايد اين سلسله مراتب را براي استفاده اشياء آن، رعايت کنيد. اين سلسله مراتب را مي توان به شجره نامه تشبيه کرد و شما مجبور هستيد براي صدا کردن هر شخص آنرا با نام پدرش بياوريد و در بعضي جاها حتي نام پدر بزرگ هم لازم است، بطور مثال: علي فرزند محمد يا علي فرزند محمد فرزند حسين. در اينجا هم پدر اصلي Window مي باشد وپدر بعدي Document است که فرزندهاي آن همان عناصر اچ تي ام ال ميباشند و سپس Form و در آخر هم Select که تنها يک فرزند دارد. براي استفاده از آنها بايد ابتدا اسم پدر و سپس اسم فرزند را نوشت و در آخر هم خصوصيت و يا متد آن فرزند که همه اينها با يک نقطه از هم بايد جدا شوند. بطور مثال اگر ميخواهيد يک فرم را بنام form1 صدا بزنيد تا با آن ارتباط برقرار کنيد بايد به شکل زير عمل شود: window.document.form1 مانند همه اشياء در جاوااسکريپت ، اين شئ ها هم داراي خصوصيات و متدهايي هستند که بعد از رعايت کردن سلسله مراتب با گذاشتن يک نقطه مي توانيد آنها را بنويسيد. مانند: window.history.go (-1) که اگر اين شئ را در يک لينک قرار دهيد با کليک کردن بر روي آن، کاربر به صفحه قبل بازگشت داده مي شود. در جدول زير شئ هاي اصلي اين سلسله مراتب ليست شده است.
براي دسترسي سريع از لينکهاي زير استفاده کنيد: خلق اعداد تصادفی شئ Math هم يکي ديگر از اشياي درون ساخت جاوااسکريپت است که شامل يکسري مقادير ثابت و همچنين توابعي براي انجام عمليات رياضي در صفحات وب ميباشد. براي ساختن اين شئ نيازي به دستور new نيست چون اين شئ براي مفسر جاوااسکريپت، کاملاً شناخته شده است. اين شئ هم مانند بقيه اشياء داراي خصوصيات و متدهايي است که ابتدا به معرفي چند متد پرکاربرد از اين شئ مي پردازيم و سپس با بقيه آنها آشنا خواهيم شد. هرگاه نياز داشتيد که اين متد بين صفر و يک عدد بزرگتر از يک، عدد تصادفي پيدا کند بايد طبق الگوي زير عمل کنيد: Math.random ( ) * num که بجاي num عدد مورد نظر را مي نويسيد. مثال براي گرد کردن يک عدد اعشاري به عدد قبل: Math.floor ( num ) و براي گرد کردن عدد اعشاري به نزديک ترين عدد: Math.round ( num ) بهتر است براي خلق اعداد تصادفي، اين دو متد گفته شده را با هم ترکيب کنيد تا اعداد صحيح بدست بيايند. مثال دو متد ديگر وجود دارد که مي توانند بين اعداد تعيين شده، بزرگترين و کوچکترين عدد را پيدا کنند: Math.max ( num, num, ... )
اين شئ داراي خصوصيات و ثابتهايي است که براي محاسبات عمليات پيچيده رياضي بکار مي رود: Math.E اين خصوصيت مقدار ثابت عدد Euler را بر ميگرداند که تقريباً برابر است با 2.7182 . اين عدد به عدد E معروف است. Math.PI مقدار ثابت عدد پي که تقريباً برابر است با 3.14 Math.LOG2E لگاريتم عدد Euler بر مبناي دو. تقريباً برابر است با 1.4426 Math.LOG10E لگاريتم E بر مبناي ده. تقريباً برابر است با 0.4342 Math.LN2 لگاريتم دو بر مبناي E. تقريباً برابر است با 0.6931 Math.LN10 لگاريتم ده بر مبناي E. تقريباً برابر است با 2.3025 Math.SQRT2 جذر عدد دو. تقريباً برابر است با 1.4142 Math.SQRT1_2 جذر يک دوم. تقريباً برابر است با 0.7071 توسط اين خصوصيات ديگر لازم نيست که شما اين اعداد را به خاطر بسپاريد و فقط کافي است در صورت نياز، اين خصوصيات را در اسکريپت خود وارد کنيد. متدهايي هم که در زير ليست شده اند، کاربرد کمتري نسبت به متدهاي ذکر شده در ابتداي اين بخش دارند. abs قدرمطلق بر ميگرداند. acos آرک کسينوس نقطه x که يک عدد ميان منفي يک و يک بايد باشد؛ خارج از اين اعداد مقدار NaN بر گردانده مي شود. آرک کسينوس عدد يک برابر با صفر است و منفي يک برابر با عدد پي. مثال asin آرک سينوس نقطه x که يک عدد ميان منفي يک و يک ؛ خارج از آن مقدار NaN بر گردانده مي شود. مثال atan آرک تانژانت نقطه x . مثال atan2 آرک تانژانت زاويه تتا بين دو نقطه x و y . مثال cos کسينوس يک زاويه را بر ميگرداند. مثال exp مقدار Ex را بر ميگرداند که E همان عدد ثابت Euler است و x هم يک مقدار عددي. مثال log لگاريتم يک عدد بر مبناي عدد E . مثال pow اين متد توان را براي يک عدد محاسبه مي کند و داراي دو پارامتر است که در اولي عدد مشخص مي شود و در پارامتر دوم مقدار عددي توان را تعيين مي کنيد. مثال sin سينوس يک مقدار عددي را محاسبه مي کند. مثال sqrt جذر يک عدد را برمي گرداند. مثال tan عددي بر مي گرداند که نشان دهنده تانژانت يک زاويه است. مثال براي دسترسي سريع از لينکهاي زير استفاده کنيد:
شئ String يکي ديگر از شئ هاي درون ساخت جاوااسکريپت ميباشد و براي کار کردن روي متنها استفاده مي شود. رشته هاي متني عبارتند از کليه کاراکترهايي که بتوان توسط کيبورد تايپ کرد و تا زماني که اين کاراکترها بين دو علامت " " قرار بگيرند، جاوااسکريپت آنها را در شئ String ذخيره خواهد کرد. البته شما مي توانيد يک رشته متني را بصورت خيلي ساده در يک متغير ذخيره کنيد و نيازي هم به اين شئ نداشته باشيد، مانند کد زير: mytxt = "This is a string." شئ String داراي خصوصيات و متدهايي است که توسط آنها مي توانيد تسلط بيشتري روي رشته هاي متني داشته باشيد. مطابق تمام اشياء در جاوااسکريپت، ابتدا بايد اين شئ را توسط دستور new تعريف و در يک متغير ذخيره کنيد: mytxt = new String ( "This is a string." ) اين شئ داراي خصوصيت length مي باشد که اشاره به طول يک رشته دارد و توسط اين خاصيت، شما مي توانيد تعداد کاراکترهاي بکار رفته در يک رشته متني را بدست آوريد. توجه داشته باشيد که براي استفاده از خصوصيات و متدهاي اين شئ، تفاوتي نمي کند که شما به چه شکلي يک رشته را تعريف کنيد. اگر بخواهيم طول شئ بالا را محاسبه کنيم، بايد بصورت زير عمل کنيم: document.write ( mytxt.length ) بعد از اجراي اين کد بايد عدد 17 در صفحه چاپ شود. ناگفته نماند که جاوااسکريپت فضاي خالي بين کلمات را هم به عنوان يک کاراکتر، محاسبه مي کند. همانطور که ميدانيد براي تعريف يک متد، ابتدا شئ را نوشته سپس يک نقطه مي گذاريم و متد مورد نظر را به همراه پرانتز مي نويسيم که اگر اين متد پارامتري هم داشت بايد آنرا داخل پرانتز بنويسيم. الگوي کلي تعريف متد براي شئ String بصورت زير است: object.methodname ( ) اکنون مي پردازيم به معرفي متدهاي اين شئ. دقت کنيد بعضي از اين متدها در مرورگر اينترنت اکسپلورر اجرا نمي شوند. فراموش نکنيد که به سورس کد مثالها هم دقت کنيد. anchor اين متد رشته را بصورت آنکر در صفحه در مي آورد که کد اچ تي ام ال آن به اين صورت خواهد بود: big متن را بصورت ضخيم و بزرگ ذخيره مي کند. مثال blink اين متد، متن را بصورت چشمک زن در مي آورد ولي در مرورگر IE اجرا نمي شود. مثال bold يک رشته را بصورت bold در مي آورد. مثال charAt توسط اين متد، مي خواهيد که بطور مثال کاراکتر پنجم از يک رشته را اعلام کند. دقت کنيد که اولين کاراکتر در يک رشته شماره صفر است. مثال charCodeAt شماره موقعيت کاراکتر در يک رشته را ميدهيد و جاوااسکريپت يونيکد آن را برميگرداند. اولين کاراکتر مانند بالا صفر ميباشد. مثال concat دو يا چند رشته را به هم پيوند ميدهد. مثال fixed متن چاپ شده در صفحه بصورت حروف تايپي خواهد بود. مثال fontcolor تغيير رنگ فونتها که اسم رنگ يا کد هگز را به عنوان پارامتر در پرانتز بايد معين کنيد. مثال fontsize تعيين سايز فونت ها که سايز را بايد در پرانتز بنويسيد. مثال fromCharCode يونيکد را ميدهيد و جاوااسکريپت کاراکتر برميگرداند. مثال indexOf اين متد دو پارامتر دارد که الگوي آن به صورت زير است: StringObject.indexOf ( searchvalue, fromindex ) توسط اين متد مي توانيد يک حرف و يا يک کلمه را در داخل يک رشته جستجو کنيد که اگر يک حرف باشد شماره موقعيت آنرا در رشته برميگرداند و اگر کلمه باشد، فقط شماره موقعيت اولين کاراکتر آن کلمه را برميگرداند. اگر هم پيدا نکند عدد منفي يک را برميگرداند. حرف و کلمه مورد نظر براي جستجو را در پارامتر اول بايد معين کنيد و مشخص کردن اين پارامتر هم اجباري است و مي توانيد از جايي که جاوااسکريپت جستجو را بايد شروع کند در پارامتر دوم معين کنيد که اين پارامتر اختياري است. فراموش نکنيد که موقعيت کاراکتر اول هر رشته عدد صفر ميباشد و همچنين حروف بزرگ با حروف کوچک هم فرق دارند. مثال italics کاراکترهاي يک رشته به صورت ايتاليک نوشته مي شوند. مثال link براي ساختن لينک بکار مي رود. مثال match مانند متد indexOf عمل مي کند با اين تفاوت که هر کلمه را جستجو کنيد، اگر پيدا کند همان کلمه را برميگرداند و اگر پيدا نکند مقدار null برميگرداند. مثال replace اين متد کاراکترهايي را جستجو مي کند و به محض پيدا کردن اولين کاراکترهاي همانند، کاراکترهاي ديگري را جايگزين مي کند. اين متد داراي دو پارامتر مي باشد، در پارامتر اول کلمه يا کاراکتري که لازم است پيدا شود را مشخص مي کنيد و سپس در پارامتر دوم جايگزين آنرا تعيين مي کنيد. الگوي اين متد به صورت زير است: Stringobject.replace( /findString/ , "newString" ) اين متد هم مانند بقيه متدها به حروف بزرگ و کوچک حساس است که اگر مي خواهيد جاوااسکريپت تفاوتي قائل نشود بايد به اين صورت عمل کنيد: Stringobject.replace( /findString/i , "newString" ) اگر مي خواهيد کلمه يا کاراکتر را در کل رشته پيدا و جايگزين کند، بايد به صورت زير عمل کنيد: Stringobject.replace( /findString/g , "newString" ) در صورت نياز مي توانيد از مخلوط آن دو استفاده کنيد: Stringobject.replace( /findString/gi , "newString" ) search اين متد فقط در رشته جستجو مي کند و به محض پيدا کردن کلمه مورد نظر عدد موقعيت اولين کاراکتر آن کلمه را بر ميگرداند و اگر پيدا نکند عدد منفي يک را نمايش ميدهد. داراي يک پارامتر هست که کلمه مورد نظر براي جستجو را در آن مشخص مي کنيد و اگر هم مانند مثال بالا حرف i اضافه کنيد از بزرگي و کوچکي حروف صرفنظر مي کند. Stringobject.search( /findString/i ) slice توسط اين متد مي توانيد يک قسمت از رشته را جدا کنيد. اين متد داراي دو پارامتر ميباشد که پارامتر اول بايد نوشته شود و در آن عدد کاراکتري را که جداسازي از آنجا بايد شروع شود را معين مي کنيد و در پارامتر دوم عدد کاراکتر پاياني را و اگر آنرا مشخص نکنيد جاوااسکريپت تا انتهاي رشته را در نظر ميگيرد. Stringobject.slice( start, end ) small اندازه حروف کوچک مي شود. مثال split تبديل يک رشته به آرايه. يعني بين کلمات يک رشته علامت کاما گذاشته و آنها را مانند آرگومان هاي آرايه مرتب مي کند. داراي دو پارامتر است که در پارامتر اول مدل علامت گذاري معين مي شود. اگر از "" استفاده کنيد بدون فاصله، مابين کليه کاراکترهاي رشته، کاما مي گذارد و اگر از " " با فاصله استفاده کنيد، در آن رشته بدنبال فاصله ها مي گردد و علامت گذاري ميکند يعني بين کلمات کاما مي گذارد. در پارامتر دوم هم که اختياري است مي توانيد تعداد تکرار کاما را تعيين کنيد. مثال strike بر روي رشته خط مي کشد. مثال sub رشته مورد نظر را پايين تر از خط نشان ميدهد. مثال sup رشته مورد نظر را بالاتر از خط نشان ميدهد. مثال substr تقريباً مانند متد slice عمل ميکند که در پارامتر اول عدد کاراکتر را براي شروع جداسازي معين مي کنيد ولي در پارامتر دوم تعداد انتخاب کاراکتر بعد از نقطه شروع را مشخص ميکنيد که اگر آن را ننويسيد تا انتهاي متن انتخاب خواهد شد و اگر مقادير پارامترها را منفي دهيد نقطه شروع از انتهاي رشته تعيين ميشود. مثال toLowerCase کليه حروف انگليسي داخل يک رشته را به حروف کوچک انگليسي تبديل مي کند. مثال toUpperCase کليه حروف تبديل به حروف بزرگ خواهد شد. مثال خب دوستان با کليه متدهاي يک رشته هم آشنا شديد. بعضي از آنها کاربرد زيادي دارند و بعضي از آنها هم شبيه به يکديگر هستند که براي راحتي کار همه آنها بيان شده است. در صفحه بعد مي پردازيم به يکي ديگر از شئ هاي درون ساخت جاوااسکريپت. براي دسترسي سريع از لينکهاي زير استفاده کنيد: object چيست؟ در بخشهاي قبل با بعضي از object ها يا همان شئ هاي جاوااسکريپت مانند، شئ Date و آرايه ها آشنا شديد. در اين صفحه قصد داريم در مورد شئ هاي ديگر در جاوااسکريپت صحبت کنيم.
وظيفه شئ ها را مي توان شبيه به متغير ها دانست اما شئ ها بسيار کامل تر از متغيرها هستند چون آنها مي توانند اطلاعات بيشتري را در خود ذخيره کنند و همچنين تفاوت ديگري هم که با متغيرها دارند اينست که متغيرها بايد تعريف شوند تا جاوااسکريپت آنها را بشناسد اما بعضي از شئ ها در جاوااسکريپت ساخته و تعريف شده اند. اين شئ هاي از قبل تعريف شده را درون ساخت يا Built-in مي گويند مانند شئ Date . البته همانطور که ميدانيد بايد همين اشياء هم در ابتداي کد يکبار ديگر با دستور new تعريف شوند: mydate = new Date ( ) پس فراموش نکنيد که از اين دستور براي شروع يک object استفاده کنيد. کليه شئ ها داراي خصوصيات و متدهاي شناخته شده براي جاوااسکريپت هستند که آنها را با گذاشتن يک نقطه بعد از خود شئ بکار مي بريم و مي توانيم مقادير مختلفي را براي آنها در نظر بگيريم. به غير از شئ هاي درون ساخت Date و Array که در صفحات قبل با آنها آشنا شديد، شئ هاي درون ساخت ديگر جاوااسکريپت عبارتند از شئ String و Math و شئ هايي که مربوط به HTML DOM مي شوند. در بخش هاي بعدي به ترتيب به توضيح هر کدام از اين اشياء خواهيم پرداخت. در اين دستور شما مي توانيد يک شئ را به همراه خصوصيات و متدهايش بصورت پيش فرض در اسکريپت خود تعريف کنيد. اين دستور به نوعي کد شما را راحت تر و خلاصه تر مي کند و مانند توابع فقط اسم تعيين شده را در کدها بکار مي بريد که جاوااسکريپت کليه خصوصيات و متدهاي آنرا برايش در نظر خواهد گرفت. قالب دستور with به شکل زير است: with ( name ) { در بالا صحبت از يک سري اشياء شد که جاوااسکريپت از قبل با آنها آشناست اما گاهي اوقات نياز هست که يک شئ را خودتان تعريف کنيد تا بهتر بتوانيد اسکريپت خود را مديريت کنيد. البته توسط دستور with هم مي توانيد اينکار را انجام دهيد، به اين صورت که اسم شئ مورد نظر را بجاي name در الگوي بالا بنويسيد و خصوصيت و متد آنرا در خطوط بعدي بين { } تعريف کنيد. اما اگر بخواهيد يک شئ را در اسکريپت خود بسازيد نياز به دو چيز داريد، ابتدا يک تابع سازنده که به آن Constructor مي گويند و در آن نوع شئ تعيين مي شود، سپس به نمونه شئ که از آن تابع استفاده مي کند و به آن Instance مي گويند که توسط دستور new تعريف مي شود. اين مطلب ممکن است کمي گيج کننده باشد اما به مثال زير توجه کنيد تا کاملاً به ساخت شئ توسط خودتان تسلط پيدا کنيد. مي خواهيم يک شئ براي اتومبيل تعريف کنيم که خصوصياتي مانند اسم، رنگ و مدل را داشته باشد. براي اينکار ابتدا يک تابع بايد تعريف کنيم بنام car و خصوصيات آنرا به عنوان پارامترهايش در پرانتز بنويسيم و سپس اين پارامترها را بر اساس خصوصياتش مقداردهي مي کنيم: function Car ( name, model, color ) { به عبارت this دقت کنيد، اين يک دستور جاوااسکريپت است و به شئ که در حال تعريف آن هستيم، اشاره دارد و در حقيقت به مفسر جاوااسکريپت مي فهماند که اين خصوصيت شئ تعريف شده با اين مقدار است و شما بايد از اين دستور استفاده کنيد تا خصوصيت يک شئ را برايش تعريف کنيد و مقدار آنها را هم مانند بالا مشخص کنيد. حالا بايد يک شئ جديد براي آن بسازيد که اين شئ جديد را در متغيري بنام mycar ذخيره مي کنيم: mycar = new Car ( "Corvette", "Z06", "Red" ) اين خط کد به جاوااسکريپت مي فهماند که يک شئ بنام mycar داراي خصوصيات اسم که Corvette و مدل Z06 و رنگ Red مي باشد. شما مي توانيد هر شئ ديگر که بخواهيد با دستور new بسازيد: thecar = new Car ( "BMW", "Z4", "Silver" ) الان مي خواهيم از شئ اول اسم ماشين و از شئ دوم رنگ را در صفحه چاپ کنيم: document.write ( mycar.name + " بعد از اينکه خصوصياتي براي يک شئ تعريف کرديد حالا نوبت به متدهاي شئ ساخته شده، مي رسد. در اينجا متدي که تعريف مي کنيم براي کليه ماشينها مي توانيم بکار بريم. الگوي کلي يک متد به شرح زير است: object.methodname( ) = function_name object شئ است که ساختيم، methodname نام متدي است که شما در نظر مي گيريد و function name هم اسم تابعي که بايد بسازيد. سپس هر کجا که لازم بود از متد استفاده کنيد ابتدا شئ و سپس با گذاشتن يک نقطه متد را به همراه پرانتز مي نويسيد که اگر اين متد پارامتري هم داشت بايد آنرا داخل پرانتز معين کنيد. متدي که مي خواهيم براي شئ Car بسازيم را بايد ابتدا بصورت يک تابع تعريف کنيم: function displaycar ( ) { حالا با استفاده از دستور this اين تابع را به عنوان متد شئ Car تعريف مي کنيم: function Car ( name, model, color ) { بعد از تعريف توابع، شئ را توسط دستور new مي سازيم و متد را اجرا مي کنيم: mycar = new Car ( "Corvette", "Z06", "Red" ) براي دسترسي سريع از لينکهاي زير استفاده کنيد: تابع چیست؟
هنگاميکه شما شروع به نوشتن کد مي کنيد، بايد سعي کنيد که اسکريپت شما حتي الامکان خلاصه و منظم و خوانا باشد تا در مراجعت بعدي براي عيب يابي و يا تغييرات، مشکلي نداشته باشيد. هميشه کدهاي شما کوتاه نيست و گاهي اسکريپت شما ممکن است تا پنجاه خط برسد که در اين موقع نياز به يک سازمان دهي داريد. توابع يا همان functions در جاوااسکريپت مي توانند کمک بزرگي به اين سازمان دهي کنند. شما مي توانيد يک مجموعه کد را که بايد در جاهاي مختلف تکرار شود را به صورت يک تابع تعريف کنيد و در هر جاي اسکريپت به آن نياز داشتيد آنرا فراخواني کنيد و از نوشتن مجدد بپرهيزيد. پس يک تابع، مجموعه کدي است که مي توان آنرا در جاهاي مختلف اسکريپت استفاده کرد بدون آنکه نياز به نوشتن مجدد آن کدها باشد. يک تابع مي تواند هر دستوري از جاوااسکريپت و يا حتي يک خط کد ساده باشد: function message ( ) همانطور که مشاهده مي کنيد براي تعريف يک تابع از کلمه function استفاده مي شود و دقت کنيد که حروف آن بايد حتماً کوچک باشد. بعد از نوشتن دستور function نوبت به تعيين يک اسم واحد براي اين تابع است که بهتر است اين اسم متناسب با وظيفه اي که اين مجموعه قرار است انجام دهد باشد چون بخاطر آوردن آن هم راحتتر خواهد بود. سپس پرانتز مي گذاريم تا در صورت لزوم پارامترهايي را در آن مشخص کنيم که به اين پارامترها آرگومان و يا argument مي گويند. طبق معمول هم با گذاشتن علامت آکلاد مشخص مي کنيم که اين مجموعه در کجا شروع و در کجا ختم مي شود که در بين اين علامت هم کدهاي جاوااسکريپت را وارد مي کنيم. در اينجا يک دستوري نوشته شده که هنگام فراخواني اين تابع و اجراي کد، يک پنجره باز مي کند و عبارت متني داخل پرانتز را نمايش مي دهد که در بخشهاي بعدي در مورد اينگونه پيغامها و پنجره ها بيشتر توضيح خواهم داد. شما يک تابع را در هر کجاي يک سند html مي توانيد بکار بريد. اگر دستوراتي است که هنگام باز شدن صفحه وب بايد اجرا شوند و يا آماده اجرا باشند پس بهتر است در قسمت head نوشته شوند. حتي مي توانيد يک تابع را در فايل خارجي جاوااسکريپت که با پسوند js ذخيره مي شود وارد کنيد تا در صفحات مختلف آنرا بکار بريد. توابعي که در يک سند اچ تي ام ال تعريف مي شوند به خودي خود اجرا نخواهند شد. اگر شما يک تابع تعريف کنيد پس از باز کردن صفحه وب خواهيد ديد که هيچ اتفاقي نمي افتد. توابع پس از تعريف بايد در جاي مورد نظر فراخواني شوند يعني آنها را صدا کنيم تا به کمک ما بيايند. در حقيقت آنها آماده هستند تا پس از فراخواني اجرا شوند. همانطور که با صدا کردن اسمتان شما پاسخ مي دهيد، يک تابع هم بايد اسمش را بکار بريد تا اجرا شود. پس هر کجا که نياز به دستورات آن تابع داشتيد، نامش را بنويسيد: نگران دستور alert و onclick نباشيد چون در بخشهاي بعدي با آنها آشنا خواهيد شد. فقط به فراخواني تابع دقت کنيد که چگونه بکار برده مي شود.
گاهي اوقات هنگام تعريف يک تابع، آرگومان و يا پارامتري را براي آن داخل پرانتز تعيين مي کنيد تا هنگام صدا زدن تابع، آن آرگومان مقداردهي شود. در کل مي توان گفت که يک آرگومان، متغيري است که هنگام صدا زدن تابع مقدار آن ارسال مي شود تا تابع از آن استفاده کند. مي توانيم مثال بالا را با يک آرگومان تعريف کنيم: function message ( msg ) در اينجا يک آرگومان بنام msg تعيين کرديم تا هنگام فراخواني تابع، مقدارش به تابع فرستاده شود و نتيجه آن اجرا شود. در حقيقت عبارت Hello friends مقدار اين آرگومان مي باشد. تعيين آرگومان هيچ محدوديتي ندارد و فقط بايد آنها را با علامت کاما از هم جدا کنيد. دقت کنيد که در دستورات جاوااسکريپت، بين دو علامت " " بايد از ' ' استفاده شود چون اگر مجدداً از خود علامت نقل قول يعني " " استفاده کنيد با پيغام خطا مواجه مي شويد. توابع جاوااسکريپت داراي يک دستوري بنام return هستند که وظيفه اين دستور برگرداندن مقادير تعريف شده در آن تابع است. function greeting ( ) { اين مجموعه کد را اگر بدون استفاده از return اجرا کنيد، نتيجه درست نخواهيد گرفت. به يک مثال ديگر توجه کنيد: همانطور که مشاهده مي کنيد دو آرگومان براي تابع total تعريف شده است که در متغير x ذخيره مي شوند و توسط دستور return مقدارشان به تابع ارسال خواهد شد. در نظر داشته باشيد که توابع در جاوااسکريپت بسيار کاربرد دارند و شما هنگام نوشتن اسکريپت خود پي به اهميت آنها خواهيد برد مخصوصاً زماني که يک سري کد را بخواهيد در کليه صفحات يک وب سايت بکار بريد که مي توانيد آنها را بصورت يک تابع در يک فايل خارجي جاوااسکريپت ذخيره کنيد و سپس در هر صفحه آن تابع را فراخواني کنيد. براي دسترسي سريع از لينکهاي زير استفاده کنيد: تابع چیست؟
هنگاميکه شما شروع به نوشتن کد مي کنيد، بايد سعي کنيد که اسکريپت شما حتي الامکان خلاصه و منظم و خوانا باشد تا در مراجعت بعدي براي عيب يابي و يا تغييرات، مشکلي نداشته باشيد. هميشه کدهاي شما کوتاه نيست و گاهي اسکريپت شما ممکن است تا پنجاه خط برسد که در اين موقع نياز به يک سازمان دهي داريد. توابع يا همان functions در جاوااسکريپت مي توانند کمک بزرگي به اين سازمان دهي کنند. شما مي توانيد يک مجموعه کد را که بايد در جاهاي مختلف تکرار شود را به صورت يک تابع تعريف کنيد و در هر جاي اسکريپت به آن نياز داشتيد آنرا فراخواني کنيد و از نوشتن مجدد بپرهيزيد. پس يک تابع، مجموعه کدي است که مي توان آنرا در جاهاي مختلف اسکريپت استفاده کرد بدون آنکه نياز به نوشتن مجدد آن کدها باشد. يک تابع مي تواند هر دستوري از جاوااسکريپت و يا حتي يک خط کد ساده باشد: function message ( ) همانطور که مشاهده مي کنيد براي تعريف يک تابع از کلمه function استفاده مي شود و دقت کنيد که حروف آن بايد حتماً کوچک باشد. بعد از نوشتن دستور function نوبت به تعيين يک اسم واحد براي اين تابع است که بهتر است اين اسم متناسب با وظيفه اي که اين مجموعه قرار است انجام دهد باشد چون بخاطر آوردن آن هم راحتتر خواهد بود. سپس پرانتز مي گذاريم تا در صورت لزوم پارامترهايي را در آن مشخص کنيم که به اين پارامترها آرگومان و يا argument مي گويند. طبق معمول هم با گذاشتن علامت آکلاد مشخص مي کنيم که اين مجموعه در کجا شروع و در کجا ختم مي شود که در بين اين علامت هم کدهاي جاوااسکريپت را وارد مي کنيم. در اينجا يک دستوري نوشته شده که هنگام فراخواني اين تابع و اجراي کد، يک پنجره باز مي کند و عبارت متني داخل پرانتز را نمايش مي دهد که در بخشهاي بعدي در مورد اينگونه پيغامها و پنجره ها بيشتر توضيح خواهم داد. شما يک تابع را در هر کجاي يک سند html مي توانيد بکار بريد. اگر دستوراتي است که هنگام باز شدن صفحه وب بايد اجرا شوند و يا آماده اجرا باشند پس بهتر است در قسمت head نوشته شوند. حتي مي توانيد يک تابع را در فايل خارجي جاوااسکريپت که با پسوند js ذخيره مي شود وارد کنيد تا در صفحات مختلف آنرا بکار بريد. توابعي که در يک سند اچ تي ام ال تعريف مي شوند به خودي خود اجرا نخواهند شد. اگر شما يک تابع تعريف کنيد پس از باز کردن صفحه وب خواهيد ديد که هيچ اتفاقي نمي افتد. توابع پس از تعريف بايد در جاي مورد نظر فراخواني شوند يعني آنها را صدا کنيم تا به کمک ما بيايند. در حقيقت آنها آماده هستند تا پس از فراخواني اجرا شوند. همانطور که با صدا کردن اسمتان شما پاسخ مي دهيد، يک تابع هم بايد اسمش را بکار بريد تا اجرا شود. پس هر کجا که نياز به دستورات آن تابع داشتيد، نامش را بنويسيد: نگران دستور alert و onclick نباشيد چون در بخشهاي بعدي با آنها آشنا خواهيد شد. فقط به فراخواني تابع دقت کنيد که چگونه بکار برده مي شود.
گاهي اوقات هنگام تعريف يک تابع، آرگومان و يا پارامتري را براي آن داخل پرانتز تعيين مي کنيد تا هنگام صدا زدن تابع، آن آرگومان مقداردهي شود. در کل مي توان گفت که يک آرگومان، متغيري است که هنگام صدا زدن تابع مقدار آن ارسال مي شود تا تابع از آن استفاده کند. مي توانيم مثال بالا را با يک آرگومان تعريف کنيم: function message ( msg ) در اينجا يک آرگومان بنام msg تعيين کرديم تا هنگام فراخواني تابع، مقدارش به تابع فرستاده شود و نتيجه آن اجرا شود. در حقيقت عبارت Hello friends مقدار اين آرگومان مي باشد. تعيين آرگومان هيچ محدوديتي ندارد و فقط بايد آنها را با علامت کاما از هم جدا کنيد. دقت کنيد که در دستورات جاوااسکريپت، بين دو علامت " " بايد از ' ' استفاده شود چون اگر مجدداً از خود علامت نقل قول يعني " " استفاده کنيد با پيغام خطا مواجه مي شويد. توابع جاوااسکريپت داراي يک دستوري بنام return هستند که وظيفه اين دستور برگرداندن مقادير تعريف شده در آن تابع است. function greeting ( ) { اين مجموعه کد را اگر بدون استفاده از return اجرا کنيد، نتيجه درست نخواهيد گرفت. به يک مثال ديگر توجه کنيد: همانطور که مشاهده مي کنيد دو آرگومان براي تابع total تعريف شده است که در متغير x ذخيره مي شوند و توسط دستور return مقدارشان به تابع ارسال خواهد شد. در نظر داشته باشيد که توابع در جاوااسکريپت بسيار کاربرد دارند و شما هنگام نوشتن اسکريپت خود پي به اهميت آنها خواهيد برد مخصوصاً زماني که يک سري کد را بخواهيد در کليه صفحات يک وب سايت بکار بريد که مي توانيد آنها را بصورت يک تابع در يک فايل خارجي جاوااسکريپت ذخيره کنيد و سپس در هر صفحه آن تابع را فراخواني کنيد. براي دسترسي سريع از لينکهاي زير استفاده کنيد:
آرايه هم داراي خصوصيت و متدهايي است که شما در صورت لزوم مي توانيد آنها را بکار بريد. براي تعريف کردن يک خصوصيت براي آرايه کافيست که بعد از متغير تعريف شده در آرايه، يک نقطه بگذاريد و سپس آن خصوصيت را بنويسيد. خصوصيتي که بيشترين کاربرد را براي آرايه دارد، length مي باشد. وظيفه اين خصوصيت نمايش انديس کلي يک آرايه است. اگر بخواهيم در مثال بالا اين خصوصيت را بکار بريم، بايد خط زير را بعد يا قبل از حلقه for بکار بريم: document.write ( weekdays.length + " بعد از وارد کردن اين کد و اجراي اسکريپت، عدد هفت در صفحه نوشته خواهد شد چون انديس ما در اينجا هفت بود. آرايه داراي متدهايي هم هست که نحوه تعريف کردن آنها همانند خصوصيت است و تنها فرقي که دارد بعد از نوشتن متد بايد پرانتز هم بگذاريد. متدهاي آرايه عبارتند از: concat(), join(), pop(), shift(), push(), unshift(), reverse(), slice(), sort(), splice(), toString(), valueOf() متد concat براي ترکيب مقادير دو يا سه آرايه بکار مي رود. اين متد هيچ چيزي را در آرايه ها تغيير نمي دهد و فقط مقادير تعريف شده را در صفحه چاپ مي کند. متد join تقريباً مانند متد قبلي عمل مي کند و کليه مقادير را بصورت يک رشته متني در صفحه نشان مي دهد با اين تفاوت که در اين متد مي توانيد يک علامت مانند نقطه، تعيين کنيد تا بين مقادير چاپ شده در صفحه قرار گيرد. بصورت پيش فرض اين علامت، کاما مي باشد. مثال متد pop آخرين مقدار آرايه را جدا کرده و در صفحه نمايش مي دهد. دقت کنيد که اين متد در خصوصيت length تأثير مي گذارد يعني اگر بعد از اين متد خصوصيت length را بکار بريد، يک انديس کمتر نشان مي دهد. مثال متد shift برعکس متد قبلي است يعني اين متد اولين مقدار آرايه را جدا مي کند و نشان مي دهد. مثال متد push يک يا چند مقدار را به آخر يک آرايه اضافه مي کند و انديس جديد برمي گرداند. مثال متد unshift يک يا چند مقدار به ابتداي يک آرايه اضافه مي کند و انديس جديد بر مي گرداند. دقت کنيد که اين متد در مرورگر اينترنت اکسپلورر بدرستي کار نمي کند. مثال متد reverse ترتيب نمايش مقادير يک آرايه را برعکس کرده و در صفحه وب نمايش مي دهد. مثال متد slice يکسري از مقادير موجود در يک آرايه را جدا مي کند که در اين متد شماره انديس مقداري که مي خواهيد از آنجا جداسازي شروع شود را بايد بنويسيد و همچنين مي توانيد آخرين مقدار هم مشخص کنيد که اگر آنرا معين نکنيد تا آخرين مقدار انتخاب خواهد شد. مثال متد sort براي منظم کردن مقادير يک آرايه به ترتيب حروف الفباي انگليسي است. اگر هم مقادير يک آرايه، عدد باشند به ترتيب اعداد تنظيم خواهند شد که مفسر جاوااسکريپت به اولين عدد از سمت چپ نگاه مي کند و بعد از رديف کردن آنها سپس به اعداد بعدي نگاه مي کند. مثال متد splice براي اضافه يا حذف يک مقدار در آرايه مي باشد که اين متد داراي پارامترهايي مي باشد که اين پارامترها را بايد در پرانتز مشخص کنيد. اولين پارامتر شماره انديس که در آنجا يک مقدار حذف يا اضافه خواهد شد و بايد عدد باشد. دومين پارامتر مقدار عددي است که معين مي کند چند تا مقدار از آن انديسي که در پارامتر قبل انتخاب کرديم، بايد حذف شود که اگر آنرا صفر در نظر بگيريد هيچ مقداري حذف نخواهد شد. اين دو پارامتر حتماً بايد نوشته شوند. در ضمن اگر مي خواهيد مقاديري هم اضافه شود بعد از اين پارامتر ها به عنوان پارامترهاي بعدي ذکر مي کنيد. مثال متد toString مقادير يک آرايه را تبديل به يک رشته متني مي کند. مثال اينها متدهايي هستند که کاربردشان در آرايه ها متداول است. شايد بنظرتان غير مفيد بيايند اما در بعضي جاها مي توانند به کمک شما بيايند و اسکريپت شما را خلاصه تر کنند. براي دسترسي سريع از لينکهاي زير استفاده کنيد: هر گاه بخواهيد يک مجموعه کد به دفعات مشخص و يا رسيدن به يک نتيجه مشخص تکرار شود، بايد از حلقه استفاده کنيد. حلقه ها در جاوااسکريپت دو نوع هستند، يکي حلقه for و ديگري حلقه while که هر کدام از آنها هم ممکن است بسته به موقعيت کد مدلهاي مختلفي داشته باشند که در ادامه با کار آنها آشنا خواهيد شد. خب براي اجراي اين مثال ابتدا کلمه for را نوشتيم تا شروع حلقه را به مفسر اعلام کنيم سپس يک پرانتز بايد باز کنيم تا پارامترهاي لازم براي تکرار در اين حلقه را وارد کنيم. اولين پارامتري که بايد وارد شود، يک متغير است با مقداردهي اوليه که به آن initial expression يا همان عبارت آغازين مي گويند. سپس دومين پارامتر که يک شرط است و مفهوم آن اينست که حلقه بايد ادامه پيدا کند تا متغير کوچکتر يا برابر با عدد 10 بشود. سومين پارامتر به عبارت افزاينده يا increment expression معروف است که در اينجا به اين مفهوم مي باشد که در هر بار اجراي حلقه يک واحد بايد به متغير افزوده شود. در انتهاي اعلام پارامترها پرانتز را مي بنديم. فقط دقت کنيد که در اين پرانتز هر پارامتري که نوشته شود بلافاصله بعد از آن بايد علامت ; قرار گيرد تا تداخلي بين آنها بوجود نيايد. بطور ساده پارامترهاي داخل پرانتز را مي توانيم اينچنين بيان کنيم: مقدار اوليه متغير سپس مقدار نهايي و در آخر هم ترتيب افزايش متغير در هر تکرار حلقه. ناگفته نماند که حتماً نبايد مقدار افزايشي باشد، مي تواند به ترتيب کم شود که همه مقادير برعکس خواهند شد. در خط بعد هم نتيجه را مابين آکلاد مي گذاريم تا به اسکريپت نظم دهيم و سپس دستور تايپ نتيجه که کلمه number را چون مي خواهيم عيناً در صفحه چاپ شود داخل " " گذاشتيم و بعد + که با پارامترهاي ديگه ترکيب بشود. البته در اينجا بجاي علامت بعلاوه مي توانيد کاما هم بگذاريد و بعد از آن متغير تعريف شده و در انتهاي آنها از تگ br استفاده کرديم تا هربار که حلقه تکرار مي شود نتيجه در يک خط جديد چاپ شود. کلمه while را مي توانيم ترجمه کنيم به ماداميکه ، پس در اينجا ما متغير را جداگانه تعريف کرديم و حالا مي گوييم، ماداميکه شرط کوچکتر يا مساوي 10 بودن برقرار نيست حلقه را تکرار کن و يک واحد به آن اضافه کن تا بالاخره شرط ما درست دربيايد. در اينجا همه چي مانند مثالهاي بالا است با اين تفاوت که کلمه do به ابتداي حلقه اضافه شده و بررسي شرط هم به انتهاي حلقه منتقل شده. همانطور که ميدانيد يکي از معني هاي do انجام دادن کاري است. مفهوم اين کد هم بدين گونه است که دستور چاپ را انجام بده و يک واحد به متغير اضافه کن ماداميکه متغير کوچکتر يا مساوي با عدد 10 بشود. پس اين دستورات حداقل يکبار اجرا مي شوند تا به شرط برسند، شما مي توانيد براي رسيدن به صحت اين گفته مقدار متغير را بجاي صفر به يک عدد ديگر تغيير دهيد مثلاً عدد 20 را بدهيد و يکبار کد را اجرا کنيد. در اين مثال نوع ديگر افزايش هم نشان داده شده است که شما مي توانيد از اين مدل هم استفاده کنيد. در اين حلقه هيچگاه شرط درست نخواهد بود و تا بي نهايت ادامه پيدا مي کند اما با استفاده از دستور break و شرطي که در نظر گرفتيم از تکرار نا محدود اين حلقه جلوگيري کرديم در حقيقت از حلقه خارج شديم. پس استفاده از اين دستور را براي حلقه هاي پيچيده در نظر داشته باشيد تا با مشکلات جدي مواجه نشويد. امروز با در خواست یکی از بازدید کنندگان در مورد خاصیت float و جاوا اسکرپت صحبت میکنیم. احتمالاً با خاصیت float در CSS آشنایی دارید. این خاصیت به ویژه وقتی مورد استفاده قرار میگیرد که طراح قصد داشته باشد بدون استفاده از جدولها چهارچوب صفحه را طراحی کند. این خاصیت باعث میشود تا یک بلوک HTML بسته به مقداری که به این ویژگی داده میشود تا حد امکان در سمت چپ یا راست المنت والد آن نمایش داده شود، به طوری که سایر المنتها و متن موجود در المنت والد در اطراف بلوک مورد نظر قرار گیرند. توضیح بیشتر در مورد این خاصیت مربوط به بخش آموزش CSS هست بنابراین به همین مقدار توضیح بسنده میکنیم. برای اختصاص دادن یک ویژگی CSS به المنتهای HTML از شیء style استفاده می شود. اما این نکته را باید در نظر داشته باشیم که float از کلمات کلیدی رزرو شده در جاوا اسکرپت است. به همین دلیل نمیتوانیم از متد style.float برای این منظور استفاده کنیم. برای جلوگیری از تداخل بین float مورد استفاده در CSS و کلمه کلیدی float در جاوا اسکرپت به منظور اختصاص این ویژگی به المنتهای HTML از متد cssFloat استفاده میکنیم. برای درک بهتر میتوانید به مثال زیر در دو حالت قبل و بعد از اختصاص این ویژگی با به المنت توجه کنید: این متن قبل از اختصاص ویژگی به المنت در زیر بلوک نمایش داده میشود قبل از اختصاص ویژگی float: این متن قبل از اختصاص ویژگی به المنت در زیر بلوک نمایش داده میشود کد مربوط به اعمال ویژگی با استفاده از جاوا اسکرپت: این متن قبل از اختصاص ویژگی به المنت در زیر بلوک نمایش داده میشود و در انتها این چیزی هست که در مرورگر نمایش داده خواهد شد: این متن پس از اختصاص ویژگی به المنت در کنار بلوک نمایش داده میشود مقادیر زیر را میتوان برای متد cssFloat به کار برد: در پایان این مقاله باید به این نکته اشاره کنم که مقادیر متد cssFloat از نوع رشته ای (String) هستند پس باید در کد جاوا اسکرپت در کوتیشن نوشته شوند. بیایید فرض کنیم می خواهیم نام فردی را قبل از ورود به صفحه بپرسیم و سپس نام آنها را در صفحه برای خودشان نمایش دهیم. این کار را با استفاده از جاوااسکرپت می توان انجام داد. فرمانی که برای این کار استفاده می شود به این صورت است: این فرمان یک پنجره را قبل از باز شدن صفحه نمایش می دهد که سؤال شما در آن پرسیده می شود و بیننده می تواند جواب خود را در کادری که برای او در نظر گرفته شده بنویسد. دو سینگل کوت بعدی جواب پیش فرض شما برای سؤال است. اگر شما چیزی بین این دو سینگل کوت ننویسید، بیننده با یک لیست خالی، آماده برای نوشتن مواجه می شود. این پیغام قبل از بارگذاری صفحه نمایش داده می شود پس شما می توانید پاسخ بیننده را در صفحه نمایش دهید. حالا به سراغ اسکرپتی که این کار را انجام می دهد می رویم. توجه داشته باشید که دستورات prompt و if/else در بخش HEAD صفحه وارد می شوند ولی نام کاربر در بخش BODY صفحه مشاهده می شود. اولین چیزی که اتفاق می افتد این است که متغیر yourname مقداری را که کاربر برای آن وارد می کند به خود می گیرد. پس مقدار متغیر yourname معادل استرینگی است که نام کاربر را می سازد. دستور if/else نام « ناشناس » را در صورتی که کاربر نامی را وارد نکند به عنوان مقدار متغیر yourname قرار می دهد. این دستور چک می کند که اگر نامی وارد نشود (null) و یا اگر فضای خالی وارد شود، مقدار « ناشناس » را به متغیر yourname می دهد. در بخش body متن دوباره از تگ script استفاده می کنیم تا کدهای جاوا اسکرپت از بقیه متن html متمایز شود. در این قسمت ما از یک فرمان جدید یعنی ;(" ")document.write استفاده کرده ایم. این همان چیزی است که به متغیر yourname اجازه نوشته شدن در صفحه html را می دهد. ما در این پیغام دو استرینگ را به علاوه متغیر yourname در صفحه می نویسیم. متغیر yourname در این فرمان بین دو دابل کوت قرار نمی گیرد چون یک مقدار است نه یک استرینگ، (البته مقدار متغیر yourname یک استرینگ است). به دلیل اینکه متغیر yourname یک استرینگ نیست ما از دو علامت بعلاوه در ابتدا و انتهای آن استفاده می کنیم. این سری نوشته ها مرورگر را وادار می کند ابتدا یک استرینگ سپس مقدار متغیر و سپس استرینگ دوم را بنویسد. چون ما در حال نوشتن یک کد جاوا اسکرپت هستیم برای اینکه بتوانیم متنی را در صفحه بنویسیم نمی توانیم مانند نوشتن متن در html عمل کنیم، و باید متن مورد نظر را بین دابل کوت و در قالب استرینگ در صفحه بنویسیم. شاید متوجه شده باشید تگهای پایانی h1 و center به گونه ای متفاوت با قبل نوشته شده اند ( مرورگر ها به صورت پیش فرض آدرس و حتی خود صفحاتی را که کاربر مشاهده می کند ذخیره می کنند. این آدرسها به ترتیبی که کاربر آنها را مشاهده کرده است در تاریخچه (history) مرورگر ثبت می شوند و دکمه های Back و Forward پنجره مرورگر بر اساس این تاریخچه کار می کنند. با استفاده از جاوا اسکرپت می توانیم به این تاریخچه دسترسی داشته باشیم و با کمک آن مسیر کاربران را هدایت کنیم. ما برای کار با تاریخچه مرورگر در اینجا از دکمه های HTML استفاده می کنیم که با کمک رویداد onclick در هنگام کلیک کردن روی این دکمه ها دستورات مورد نظر ما اجرا خواهند شد. در اینجا می توانید کد HTML مربوط به ساخت این دکمه ها را مشاهده کنید (البته مقدار مربوط به شناسه onclick مربوط به دستورات جاوا اسکرپت است که بعداً وارد خواهد شد) : برای آشنایی بیشتر با رویداد های HTML می توانید از صفحه رویدادهای مربوط به صفحه کلید و ماوس در HTML استفاده کنید. (لینک در صفحه جدید باز خواهد شد) دستورات مختلفی برای کار با تاریخچه مرورگر وجود دارد که همه آنها از شیء history استفاده می کنند. در ادامه می توانید تعدادی از این دستورات را که با بیشتر مرورگرها کار می کنند مشاهده کنید از این فرمان می توانید جهت هدایت کاربران به صفحه ای که قبل از صفحه کنونی در پنجره مرورگر مشاهد کرده اند استفاده کنید. این دستور دقیقاً مانند دکمه Back در پنجره مرورگر عمل می کند و در صورتی که صفحه کنونی اولین صفحه ای باشد که از زمان باز شدن پنجره نمایش داده شده باشد این دستور کاربردی ندارد. برای مشاهده یک نمونه از کاربرد این دستور می توانید لینک را کلیک کنید : برای مشاهده کاربرد دستور ()history.back اینجا را کلیک کنید در اینجا می توانید کئ مورد استفاده در مثال بالا را مشاهده کنید : در صورتی که بازدید کننده قبلاً از دکمه Back در مرورگر خود استفاده کرده باشد یا با استفاده از دستور دکمه زیر با استفاده از دستور ()history.forward شما را به صفحه ای که برای مثال مربوط به بازگشت به صفحه قبلی مشاهده کرده اید هدایت می کند : می توانید کد استفاده شده در ساخت دکمه بالا را در اینجا مشاهده کنید : با استفاده از دستورهای ()history.back و ()history.forward فقط امکان این وجود دارد که کاربران را یک صفحه به عقب یا جلو هدایت کنیم. اگر بخواهیم بازدید کننده را به چندین صفحه عقب یا جلو هدایت کنیم باید از دستور ()history.go استفاده کنیم. اگر برای دستور ()history.go از مقداری مثبت استفاده شود کاربر به همان تعداد صفحه در تاریخچه مرورگر به جلو هدایت می شود. به کد زیر توجه کنید : کد بالا دکمه ای را می سازد که کلیک کردن بر روی آن همان کاری را انجام می دهد که سه بار فشار دادن دکمه Forward در پنجره مرورگر انجام می دهد. در صورتی که دستور به صورت (1)history.go نوشته شود مانند دستور ()history.forward عمل می کند. در صورتی که این دستور به صورت (0)history.go نوشته شود باعث باز بارگذاری مجدد همان صفحه خواهد شد. برای مثال به کد زیر و دکمه ساخته شده با آن توجه کنید : این هم دکمه ساخته شده : اگر بخواهیم کاربر را چند صفحه در تاریخچه مرورگر به عقب هدایت کنیم می توانیم برای دستور ()history.go از مقادیر منفی استفاده کنیم. برای مثال به کد زیر توجه کنید : این کد دکمه ای را می سازد که وقتی کاربر آنرا کلیک کند به سومین صفحه ای که قبل از صفحه کنونی در پنجره مرورگر بازدید کرده است هداین می شود. کاربرد این دکمه در اینجا مشابه سه بار فشار دادن دکمه Back در پنجره مرورگر است. با استفاده از دستور history.lentgh می توانید تعداد صفحاتی را که در تاریخچه مرورگر وجود دارد پیدا کنید. یعنی با استفاده از این دستور می توانیم به تعداد صفحاتی که از زمان باز شدن پنجره مرورگر در آن نمایش داده شده است پی ببریم. برای مثال می توانید با کلیک کردن بر روی لینک زیر تعداد صفحات ذخیره شده در تایریخچه پنجره مرورگر خود را پیدا کنید : نمایش تعداد صفحات موجود در تاریخچه مرورگر در اینجا می توانید کد مورد استفاده در ساخت لینک بالا را مشاهده کنید : این فرمان یک دکمه را در صفحه شما قرار می دهد، اما اگر روی آن کلیک کنید اتفاقی نمی افتد... در زیر کار هر قسمت از فرمان بالا را می بینیم: احتمالاً شما نمی خواهید یک دکمه بسازید که کاری انجام نمی دهد. در زیر یک فرمان جاوا اسکرپت آورده شده است که مرورگر را مجبور می کند وقتی دکمه را کلیک کردید عکس العمل نشان دهد: فقط این فرمان را در تگ INPUT قرار دهید که دکمه را با آن ساختید، مانند زیر: برای مثال ما می توانیم مانند فرمان onMouseover در این دکمه نیز استفاده کنیم و متنی را در نوار وضعیت پنجره چاپ کنیم! حالا دکمه را فشار دهید و به متن نوار وضعیت نگاه کنید: شما می توانید با استفاده از دکمه ها به بینندگان خود اجازه دهید رنگ زمینه صفحه را برای خودشان تغییر دهند. فقط از فرمان زیر به جای فرمان window.status استفاده کنید: فرمان زیر را به عنوان تمرین فرمان onClick وارد کنید: حالا شما دکمه ای مانند زیر دارید که با کلیک کردن بر روی آن زمینه صفحه به رنگ زرد در می آید! شما می توانید به هر تعداد که می خواهید از این دکمه ها اضافه کنید، فقط مطمئن شوید که آنها گزینه بازگشت به حالت اولیه را نیز داشته باشند. اسکرپت زیر به شما چهار گزینه می دهد : سفید، زرد، قرمز و آبی . می توانید از دکمه «بازگشت به رنگ اولیه!» برای بازگرداندن تصویر زمینه این صفحه استفاده کنید. کدی که در این صفحه از آن استفاده شده است به دلیل وجود تصویر زمینه کمی با کد زیر متفاوت است ولی کارایی آن تفاوتی ندارد. برای دکمه چهارم به جای نام رنگ از معادل هگزادسیمال رنگها استفاده شده است. برای یافتن معادل هگزادسیمال رنگها و توضیح درباره آنها می توانید به این صفحه مراجعه کنید. حالا شما سه دکمه دارید، آنها را امتحان کنید! در اسکرپت آخری که در این قسمت بررسی می کنیم، اجازه می دهیم تا یک دکمه به عنوان یک لینک عمل کند. به این منظور فقط فرمان زیر را برای فرمان onClick استفاده کنید: برای مثال این هم اسکرپتی که شما را به صفحه آموزش جاوا اسکرپت ما می برد: وقت اون رسیده که نوشتن اولین اسکرپت خود را شروع کنید. این یکی راحته چون مجبور نیستیم درگیر اضافه کردن تگهای SCRIPT شویم. این اسکرپت کوچک به دلخواه شما وقتی نشانگر ماوستان روی یک لینک قرار می گیرد متنی را در نوار وضعیت مرورگرتان می نویسد. به مثال نگاه کنید: شما هم امتحان کنید و ببینید چگونه کار می کند. نشانگر ماوس خود را روی لینک زیر قرار دهید ولی کلیک نکنید (اگر کلیک کنید، چون در کد بالا آدرس لینک، آدرس همین صفحه است پس از کلیک کردن دوباره همین صفحه باز می شود). حالا پایین پنجره مرورگر خود به نوار وضعیت نگاه کنید باید این جمله را بینید: « آموزش جاوا اسکرپت » ماوس خود را روی این لینک قرار دهید!!! بسیار خوب، این چیزی است که با فرمان onMouseover اتفاق می افتد: " "=onMouseover '« آموزش جاوا اسکرپت »'=window.status return true دلیل استفاده از علامت سینگل کوت ( ' ) در فرمان window.status این است که window.status خود قسمتی از فرمان onMouseover است که از ( " ) استفاده کرده است. اگر دوباره از علامت دابل کوت ( " ) استفاده کرده بودیم ممکن بود مرورگر در مورد اینکه چه کاری باید انجام دهد گیج می شد. چون ممکن بود علامت دابل کوت دوم را به منزله پایان فرمان onMouseovr تلقی کند و فرمان جدیدی را با window.status شروع کند: onMouseover=""window.statuse مشکلی که ممکن است در اینجا به وجود آید پاک نشدن متنی است که می خواستید در نوار وضعیت نمایش داده شود. دو راه برای از بین بردن این مشکل وجود دارد. یکی استفاده از فرمان onMouseout است، و دیگری فرا خواندن تابعی که متن را پس ار مدتی پاک می کند. راه دوم نیازمند استفاده از توابع و اسکرپت تگها است. در اینجا آسانترین راه را به شما نشان می دهم: استفاده از فرمان onMouseout : این فرمان متن نوار وضعیت را وقتی که نشانگر ماوس روی آن نیست ناپدید می کند. مانند زیر: در حقیقت ما همان کار قبل را تکرار کردیم ولی به جای متن از فضای خالی در فرمان window.status استفاده کردیم. این اسکرپت جالب و مفید است و می تواند به بازدید کنندگان صفحه شما کمک کند تا بهتر بدانند لینک آنها را به چه صفحه ای می برد. و می توانند توضیحات شما را در مورد لینک ببینند. راه حل دیگر استفاده از دستور شرطی switch است. این دستور را می توان در هنگامی که می خواهیم یک متغیر را با چندین مقدار مقایسه کنیم و مقدار متناسب با آنرا پیدا کنیم کار برد دارد. ساختار این دستور به صورت زیر است : در این دستور مقدار متغیر معرفی شده در قسمت switch با مقادیر آورده شده در هر case مقایسه می شود. در صورت مساوی بودن مقادیر کد همان case اجرا می شود و با استفاده از دستور break آورده شده در هر قسمت برنامه پس از اجرای کد آن قسمت به خارج از دستور switch هدایت می شود. در غیر این صورت برنامه به سراغ case بعدی می رود و در صورتی که مقدار متغیر مورد نظر با هیچکدام از case ها برایر نبود کد قسمت default اجرا خواهد شد. قابل ذکر است که استفاده از default اختیاری است و شما بنا به نیاز خود می توانید از آن استفاده کرده یا آنرا حذف کنید.در دستور switch محدودیتی در تعدار case ها وجود ندارد و می توانید به هر تعدادی که نیاز داری از این مورد استفاده کنید. در این قسمت به ذکر یک نمونه برای ادستور switch می پردازیم : به کدی که در اینجا آورده شده است توجه کنید. پس از جرای این کد کادری باز می شود که از شما میخواهد عددی را وارد کنید. با وارد کردن عدد در این کادر و تأیید آن پیامی متناسب با روز معادل آن عدد در هفته ظاهر می شود. البته ما این کار را فقط برای اعداد 1 تا 3 انجام دادیم، شما در صورت تمایل می توانید آنرا تکمیل کنید : از دستورات شرطی برای انجام دستوراتی به شرط برقراری یک رابطه دیگر استفاده می شود. در طراحی صفحات وب بسیار پیش می آید که می خواهیم در شرایط خاصی صفحه یک رفتار مشخص داشته باشد و در موارد دیگر رفتار صفحه تفاوت داشته باشد. در این مواقع می توانیم از دستور شرطی if استفاده کنیم. با این دستور مشخص می کنیم اگر شرط خاصی برقرار بود یک عمل خاص انجام شود. ساختار این دستور به شکل زیر است : به یک مثال برای دستور if توجه کنید : برای اینکه کد بالا را آزمایش کنید لینک زیر را کلی کنید و در پیامی که نمایش داده می شود دکمه OK را کلیک کنید. اگر دکمه Cancel را کلیک کنید شرط بالا برقرا نمی شود و بدون اجرا شدن دستور شرطی صفحه مثال باز می شود. برای مشاهده مثال بالا در عمل اینجا را کلیک کنید. برخی مواقع ممکن است بخواهیم دستور شرطی یک شرط را چک کند تا در صورت برقرار بودن آن شرط یک فرمان خاص را اجرا کند و در صورتی که شرط برقار نبود یک فرمان دیگر را به اجرا در آورد. در این موارد می توانیم از دستور if به همراه else استفاده کنیم. ساختار این دستور به شکل زیر است : در کد بالا ابتدا شرط بررسی می شود و در صورت برقراری آن دستورات مربوطه اجرا می شوند ولی در صورتی که شرط برقرار نباشد دستورات مربوط به قسمت else اجرا می شود. برای مشاهده نتیجه مثال بالا لینک زیر را کلیک کنید و در کادری که نمایش داده می شود یک عدد از 0 تا 20 وارد کنید و دکمه OK را کلیک کنید. مثال استفاده از دستور if...else ممکن است در نظر داشته باشیم تا در صورت برقراری یک شرط یک دستور خاص اجرا شود و در صورتی که شرط برقرار نبود شرط دیگری بررسی شود و دستور مربوط به آن اجرا شود و در صورتی که هیچ یک از شرطهای قبل برقرار نبود دستور دیگری اجرا شود. در این مواقع می توانیم از دستور else if در دستور if...else قبلی استفاده کنید. به صورت زیر : در این روش محدودیتی از نظر تعداد شرطها وجود ندارد و می توانیم به تعداد نامحدود از دستور else if استفاده کنیم ولی در مواردی که تعداد این شرطها خیلی زیاد می شود بهتر است به جای این روش از دستور switch که بعداً توضیح داده خواهد شد استفاده کنیم. در اینجا مثال قبل را با کمی تغییر برای این روش استفاده می کنیم : برای مشاهده نتیجه مثال دستور if...else if...else اینجا را کلیک کنید. در جاوا اسکرپت این امکان وجود دارد که متنی را نوشته و در صفحه نمایش بدهیم. متن مورد نظر را می توانیم قالب بندی کنیم و از تگهای HTML نیز در آن استافده کنیم. برای این کار از فرمان ()document.write استفاده می کنیم که یک فرمان جاوا اسکرپت مخصوص چاپ کردن خروجی در صفحه است. روش کار به صورت زیر است : البته نقطه ویرگولی که در آخر فرمان نوشته شده تنها در صورتی الزامی است که بیش از یک فرمان در اسکرپت خود داشته باشیم. برای نوشتن متن به این صورت کافی است تا فرمان بالا را در جایی از صفحه HTML که می خواهید متن به نمایش در آید بنویسید. در مثال زیر متنی با استفاده از جاوا اسکرپت در صفحه نمایش داده می شود، برای مشاهده مثال لینک زیر را کلیک کنید : نوشتن متنهای ساده با استفاده از جاوا اسکرپت با استفاده از فرمان document.write امکان نوشتن متنهای قالب بندی شده با استفاده از تگهای HTML هم وجود دارد. برای اینکار فقط کافیست متن HTML مورد نظر خود را در تابع ()document.write قرار دهید. برای مثال به کد زیر توجه کنید : برای مشاهده نتیجه این مثال لینک زیر را کلیک کنید : نوشتن متنهای قالب بندی شده با HTML توسط جاوا اسکرپت اگر بخواهیم متنی که با استفاده از جاوا اسکرپت متنی را بنویسیم که در صفحه در چند سطر نمایش داده شود به راحتی می توانیم با وارد کردم نکته : نباید بدون استفاده از عملگر های مربوطه مقدار تابع بالا را در بیش از یک سطر بنویسید. در صورتی که متن مورد نظر خود را به این گونه در چند سطر بنویسید تابع کار نمی کند و احتمالاً با پیغام خطا مواجه می شوید. اگر کد خود را به صورت زیر بنویسید با خطا مواجه خواهید شد : برای اینکه با خطا مواجه نشوید و کد شما کار حود را انجام دهد باید آنرا به صورت زیر بنویسید : آیا مایلید یکی از آن کادر هایی که ناگهان ظاهر می شوند و معلوم نیست از کجا آمده اند را به صفحه خود اضافه کنید؟ بسیار خوب بیایید با کادر هشدار شروع کنیم که به بیننده چیزهایی را که شما می خواهید می گوید. این فرمان هشدار است: حالا برای استفاده از آن ما باید آنرا در یک فرمان دیگر قرار دهیم. بیایید آنرا در یک فرمان آشنا مثل فرمان onMouseover استفاده کنیم. اسکرپت مقابل باعث ظاهر شدن یک کادر هشدار وقتی که ما نشانگر ماوس خود را روی لینک به وجود آمده قرار می دهیم می شود. مثلاً در لینکی که نمی خواهیم بیننده کلیک کند: آنرا امتحان کنید. فقط ماوس خود را روی آن قرار دهید: ماوس خود را روی این لینک قرار دهید در ابنجا به ارائه توضیحاتی در مورد دستورات جاوا اسکرپت استفاده شده در کد بالا می پردازیم : بسیار خوب، یک روش دیگر هم وجود دارد که بیشتر باعث گیج شده بیننده می شود. آن هم کادر هشدار به محض باز شدن پنجره است. شما با این روش می توانید مطالبی را که می خواهید به بیننده خود بگویید قبل از باز شدن صفحه به او نشان دهید. برای ساختن این نوع کادر هشدار فرمان هشدار را بین فرمان بالا یک کادر محاوره ای را وقتی که بیننده صفحه شما را باز می کند نشان می دهد. وقتی که OK را کلیک کنید بارگذاری صفحه ادامه پیدا می کند. آیا می خواهید آنرا امتحان کنید؟ لینک زیر را کلیک کنید و به صفحه آزمایشی که ما برای این فرمان ساخته ایم بروید: !پیام هشدار به محض باز شدن صفحه! آیا می خواهید چند گام جلو تر برویم؟ چندین فرمان هشدار را در تگ SCRIPT قرار دهیم تا چندین کادر هشدار پشت سر هم به محض باز شدن صفحه نمایش داده شوند و البته برای هر پیام باید دکمه OK را کلیک کنیم تا به پیام بعدی برویم. خودتان این را امتحان کنید : !چندین پیام هشدار به محض باز شدن صفحه! این هم کدی که مسئول این پیامها است: شما می توانید برای ظاهر شدن کادر هشدار از دکمه ها هم استفاده کنید. فقط کد را در جایی که می خواهید دکمه نشان داده شود قرار دهید. در این حالت شما نیازی به تگهای )
در جاوا اسکرپت برای جمع، تفریق، مقایسه و بسیاری از عملیات دیگر از عملگرها استفاده می کنیم. عملگرها به چند دسته تقسیم می شوند : عملگرهای محاسباتی، مقایسه ای، جایگزینی، منطقی، رشته ای، و شرطی. در ادامه به ارائه توضیحاتی برای هر نوع از این عملگرها خواهیم پرداخت. از این نوع عملگرها برای انجام عملیات ریاضی نظیر جمع و ضرب استفاده می شود. می توانید این عملگرها را در اینجا مشاهده کنید ( در مثال زیر متغیر x را برابر 8 و متغیر y را برابر 4 در نظر بگیرید ) : از عملگرهای افزایش و کاهش به ترتیب برای افزودن 1 به مقدار قبلی و کم کردن 1 از مقدار قبلی استفاده می شود. این عملگرها ترکیبی از عملگرهای دیگر هستند و به همین دلیل آنها را عملگرهای ترکیبی هم می نامند. می توانید این عملگرها را در جدول زیر مشاهده کنید ( در مثال زیر متغیر x را برابر 8 و متغیر y را برابر 4 در نظر بگیرید ) : از این عملگرها برای مقایسه دو مقدار استفاده می شود که شامل عملگرهای زیر هستند. در جدول زیر مقادیر x و y و z را مطابق زیر در نظر بگیرید و توجه داشته باشید که مقدار متغیرهای x و y عددی و مقدار متغیر z از نوع رشته ای است : تفاوت عملگر تساوی با عملگر همانی در این است که در عملگر تساوی نوع متغیر ها در نظر گرفته نمی شود و اگر مقدار متغیرها با هم برابر باشد حتی اگر از یک نوع هم نباشند نتیجه True خواهد بود. ولی در عملگر همانی باید متغیرها مقداری مساوی داشته باشند و از یک نوع هم باشند تا نتیجه True باشد. این عملگرها برای انجام عملیات منطقی بر روی دو عبارت به کار می روند ( در مثال زیر متغیر x را برابر 8 و متغیر y را برابر 4 در نظر بگیرید ) : از این عملگر برای چسباندن دو رشته به هم استفاده می شود. مثلاً برای اتصال دو متغیر از نوع رشته از این عملگر استفاده می شود. در مثال بالا مقدار متغیر c این است : 'طراحی وببا جاوا اسکرپت' در نتیجه کد بالا مقدار متغیر c به این صورت خواهد بود : 'طراحی وب با جاوا اسکرپت' در جاوا اسکرپت نوعی عملگر وجود دارد که بسته به شرایط مقداری را به یک متغیر تخصیص می دهد به این عملگر عملگر شرطی می گویند. ساختار این عملگر به صورت زیر است : این عملگر در صورتی که شرط برقرار باشد مقدار اول را به متغیر می دهد و در صورت برقرار نبودن شرط مقدار دوم را به متغیر تخصیص می دهد. به مثال زیر توجه کنید : در این مثال اگر متغیر age بزرگتر از 18 باشد مقدار 'بزرگسال' به متغیر age_group تخصیص داده می شود و در صورتی که متغیر age کوچکتر از 18 باشد مقدار 'زیر سن بلوغ' به عنوان مقدار متغیر age_group قرار می گیرد. به طور کلی به سه طریق می توانیم از جاوا اسکرپت در یک صفحه استفاده کنیم: به یاد داشته باشید که می توانید از همه روشهای بالا به طور همزمان برای وارد کردن جاوا اسکرپت در صفحه استفاده کنید. در دو روش اول کدهای جاوا اسکرپت به طور مستقیم وارد صفحه HTML می شوند. برای وارد کردن جاوا اسکرپت در این دو روش از تگ script استفاده می شود. تمامی کدهای جاوا اسکرپتی که می خواهید به طور مستقیم وارد صفحه کنید باید در تگ script قرار داشته باشند وگرنه مرورگر به جای به کار بردن آنها را به صورت متن در صفحه نمایش می دهد. معمولاً کدهای جاوا اسکرپت با ساختار زیر وارد صفحه می شوند : در تگ بالا برای مشخص کردن نوع موتور اسکرپتی که مرورگر باید برای تفسیر کردن کد استفاده کند از دو شناسه language و type استفاده می کنیم. در هنگام باز شدن یک صفحه وب عناصر موجود در بخش در اینجا یک مثال از استفاده از جاوا اسکرپت در برای مشاهده صفحه ساخته شده با کد بالا اینجا را کلیک کنید. این امکان وجود دارد که کدهای جاوا اسکرپت را در قسمت برای مشاهده صفحه مربوط به کد بالا اینجا را کلیک کنید گاهی اوقات ممکن است بخواهید از یک سری از کدهای جاوا اسکرپت برای چندین صفحه استفاده کنید و نمی خواهید همه آنها را به صورت جداگانه در هر صفحه بنویسید. در این مواقع می توانید کدهای مورد نظر خود را در یک فایل متنی وارد کنید و آنرا با پسوند js. ذخیره کنید. در هر صفحه ای که بخواهید از این فایل استفاده کنید کافی است آنرا در آن صفحه فرا خوانی کنید. ( به یاد داشته باشید که در این فایلهای خارجی نباید از تگهای برای مشاهده صفحه ای که فایل ذخیره شده ما را فرا خوانی می کند اینجا را کلیک کنید. الا بردن سرعت اینترنت امروزه از اهمیت بالایی برخوردار است اما متاسفانه امروز در ایران بیش از 90 درصد مردم هنوز از Dialup با سرعت بسیار کم بهره می برند و اکثرا از راههای افزایش سرعت اینترنت خود آگاهی ندارند. امروز می خواهیم نرم افزار BeFaster را به شما عزیزان معرفی کنیم که شما را یاری خواهد داد تا از حداکثر سرعت ممکن نت خود بهره ببرید. این نرم افزار معجزه نمی کند؛ بلکه یک ابزار قدرتمند است که با بهینه سازی نحوه اتصال شما به اینترنت سرعت دریافت و ارسال اطلاعات شما را افزایش خواهد داد. این نرم افزار که یک نوع Speed Up می باشد تنها محدود به یک نوع ارتباط Dialup نمی باشد و شما می توانید در تمام اتصالات همانند Dial-up modem, Lan, Wireless, Cable Modem, xDSL, ISDN, T1, DirecPc , Cable/DSL از این نرم افزار بهره ببرید و برای افزایش سرعت اینترنت خود اقدام کنید و از اینترنتی سریعتر لذت ببرید. دانلود رایگان نرم افزار افزایش سرعت اینترنت (حجم : 3.9 مگابایت) اکثر کاربران اینترنت با نرم افزار پیغام رسان یاهو Yahoo! Messenger Final به نام یاهو مسنجر آشنا هستند و بیشتر ما از آن برای شرکت در کنفرانس ها، ارتباط با دوستان، شرکت در چت روم ها، مکالمات و بسیاری موارد دیگر استفاده می کنیم و امکاناتی همچون گفتگو با دوستان آنلاین ، گذاشتن پیغام برای دوستان لیست خود، مطلع سازی از ایمیل های جدید، پشتیبانی از فایروال های گوناگون، قابلیت ذخیره سازی و گرفتن پرینت از گفتگو ها، همچنین ارائه سرویس های PC-PC, PC-Phone و Phone-to-PC،اشتراک گذاری فایل و تصاویر، اتاق های مختلف چت، نمایش وبکم و بسیاری امکانات دیگر را نام برد.
(حجم : 16.31 مگابایت) اگر در محیط منزل یا کار خود با بیش از یک کامپیوتر سر و کار دارید.احتمالا به این فکر افتاده اید آن ها را به هم متصل کنید و یک شبکه ی کوچک راه بیاندازید.می تونید چاپگرتان را به اشتراک بگذارید یا این که با یکی از آن ها به اینترنت وصل شوید و بقیه را نیز به اینترنت وصل کنیدو ... pdfنوع فایل برای دانلود اینجا کلیک کنید. حجم فایل:367 کیلو بایت سرعت کامپیوتر که کم میشه دلایل زیادی داره که تو این پست این عوامل رو بررسی می کنیم تا بتو نید اونها رو پیدا کنید و رفع شون کنید. pdfنوع فایل برای دانلود اینجا کلیک کنید. حجم فایل:78 کیلو بایت تو این پست براتون اموزش متحرک سازی متون در وبلاگ رو گذاشتم .با استفاده از کدها در وبلاگ می تونید زیبایی به وبلاگتون ببخشید . E-book نوع فایل برای دانلود اینجا کلیک کنید. حجم فایل:430 کیلو بایت رمز:www.4uweb.loxblog.com این برنامه شبه ساز مراحل نصب ویندوزاکس پی است که به شما دوستان کمک می کنه خودتون ویندوز اکس پی رو نصب کنید. برای دانلود فایل اینجا کلیک کنید. حجم فایل:960 کیلو بایت امروز قصد دارم نرم افزار Shock Desktop 3D که برای سیستم عامل ویندوز ویستا و ایکس پی می باشد را به دوستان معرفی کنم . این نرم افزار رایگان به شکلی بسیار جالب دسکتاپ و کلیه آیکون ها موجود بروی دسکتاپ را به صورت سه بعدی در می آورد ( تصویر زیر تصویر دسکتاپ کامپیوتر من می باشد که با استفاده از این نرم افزار سه بعدی شده است ) . به علت های مختلف ممکن است برخی از فایلهای ویندوز ( مخصوصا رجیستری ) خراب و یا پاک شوند و همین امر باعث کند شدن سیستم می شود . وقتی که کارکرد ویندوز کند شد اجرای بسیاری از برنامه ها در ویندوز دچار مشکل می شود و در واقع استفاده از سیستم به نحو مطلوب امکان پذیر نمی باشد . در این زمان بسیاری از کاربران ویندوز خود را دوباره نصب می کند که کار معقول و درستی می باشد اما یک روش دیگری نیز وجود دارد که بدون احتیاج به نصب مجدد ویندوز و در کوتاه ترین زمان ممکن شما می توانید فایل های خراب و معیوب ویندوز xp خود را ترمیم کنید و در واقع در این روش کل فایل های ویندوز چک می شود و اگر فایل خرابی پیدا شد آن فایل خراب به کمک CD نصب ویندوز با فایل سالم جایگزین می شود . ویندوز xp به شما این امکان را می دهد که بتوانید با استفاده از عکس های موجود درپوشه My Pictures برای خود اسلاید تهیه کنید و آنرا به عنوان محافظ صفحه نمایش ( Screen Saver ) قرار دهید . برای انجام این کار ابتدا عکس های مورد نظر خود را در پوشه My Pictures قرار دهید سپس بروی دسکتاپ (Desktop ) ویندوز کلیک راست کنید و از منوی حاصل گزینه Properties را انتخاب کنید.بعد از باز شدن پنجره Display Properties بروی برگه Screen Saver کلیک کنید سپس در این برگه از منوی باز شوی Screen Saver گزینه My Pictures Slideshow را انتخاب کنید .همچنین می توانید با کلیک بروی گزینه setting مدت زمان نمایش هرتصویر و اندازه آن ها راتعیین کنید.اکنون با کلیک بروی دکمه ok می توانید عکس های درون پوشه My Pictures را به صورت اسلاید در محافظ صفحه نمایش مشاهده کنید.
|