2

Hadi Ahmadi Learning Java Script
‫دَلران پی سی‬
‫‪Hadi Ahmadi‬‬ ‫‪Learning Java Script‬‬
‫با سپاس‬
‫از تمام عسیساوی کٍ با اوتقادَا ي راَىمایی َای خًد‬
‫محرکی برای وًشته يیرایش ديم شدود‪.‬‬
‫استفادٌ از ایه مىبع با ذکر صلًات بر‬
‫(ص)‬
‫حممد و آل حممد‬
‫رایگان می باشد‪.‬‬
‫ضوا هی تَاًیذ‪:‬‬
‫ایي کتاب را تِ صَرت رایگاى دریافت کٌیذ‪ .‬‬
‫تِ صَرت رایگاى تا دٍستاًتاى تِ اضتزاك تگذاریذ‪.‬‬
‫راي داًلَد در سایت‪ٍ/‬تالگ خَد قزار دّیذ ‪ .‬‬
‫ضوا اجاسُ ًذاریذ‪:‬‬
‫هطالة ایي کتاب را تِ اسن خَد کپی ٍ هٌتطز کٌیذ ‪ .‬‬
‫اس ایي کتاب استفادُ تجاري کٌیذ‪ .‬‬
‫در هحتَاي ایي کتاب دست تثزیذ‪ .‬‬
‫در داخل صفحات ایي کتاب آرم یا لَگَي خَد را قزار دّیذ‪ .‬‬
‫در آخز تا تَجِ تِ سحوات تسیار سیادی کِ در ًگارش ایي کتاب کطیذُ ضذُ است‪ ,‬تِ ًام خَد‬
‫سدى ایي هٌثغ کاری تِ دٍر اس ػذل ٍ اًصاف خَاّذ تَد‪.‬‬
‫ٍیژگی ّای ٍیزایص دٍم‬
‫‪ ‬تزطزف کزدى اضتثاّات اهالیی ٍ ًگارضی ٍیزایص اٍل‪.‬‬

‫‪ ‬ساختار دادى تِ هتي کتاب ٍ سلسلِ هزاتثی کزدى هطالة‪.‬‬
‫‪ ‬تَجِ ٍیژُ تِ ضکیل تَدى ٍ سیثایی ًگارش‪.‬‬
‫‪ ‬اضافِ کزدى فصَل هختلفی کِ در ٍیزایص اٍل کوتز تِ آًْا تَجِ ضذُ تَد‪.‬‬
‫‪ ‬تسط دادى هطالة هَجَد در ٍیزایص قثل ٍ دستِ تٌذي کزدى آًْا در تخص ّاي هزتثط‪.‬‬
‫‪ ‬اضافِ کزدى فصَلی کِ در دیگز هٌاتع آهَسضی جاٍا اسکزیپت کوتز تذاًْا تْا دادُ‬
‫هی ضَد اس جولِ ‪ :‬اضافِ کزدى یک فصل تا عٌَاى هذل ضی گزاي سٌذ )‪ , (DOM‬اضافِ‬
‫کزدى فصَل هزتَط تِ فزین ّا ٍ فزم ّا ٍ غیزُ ‪.‬‬
‫هثال هحَر تَدى کتاب ‪ ,‬تِ طَري کِ در ّز فصل تیص اس تیست هثال هتٌَع آٍردُ ضذُ‬ ‫‪‬‬
‫است کِ ّویي اهز تاعث سَْلت در فزایٌذ یادگیزي ٍ در دراس هذت تِ خاطز سپزدى‬
‫هطالة ٍ ّوچٌیي درك کارتزدي تَدى هطالة هی گزدد‪.‬‬
‫تَجِ‬
‫هطالعِ ایي کتاب تزاي افزاد هثتذي کِ ّیچ آضٌایی تا تزًاهِ ًَیسی جاٍا اسکزیپت ًذارًذ ٍ‬
‫ّوچٌیي افزادي کِ تا سطح هتَسط تا ایي ستاى آضٌایی دارًذ تَصیِ هی ضَد‪.‬‬
‫صفحَ‬ ‫فِزست هطالب‬
‫‪1‬‬ ‫هقذهَ‬
‫‪2‬‬ ‫فصل اّل ‪ :‬شزّع کار با جاّ اسکزیپت‬
‫‪3‬‬ ‫آشٌایی با جاّا اسکزیپت ّ هفِْم اسکزیپت ًْیسی‬

‫‪3‬‬ ‫آشٌایی با چگًْگی استفادٍ اس فزاهیي جاّا اسکزیپت‬
‫‪3‬‬ ‫وارد کزدى کذُای جاوا اسکزیپت در قسوت <‪ <HEAD‬صفحَ‬
‫‪4‬‬ ‫وارد کزدى کذُای جاوا اسکزیپت در بخص <‪ <BODY‬صفحَ‬
‫‪5‬‬ ‫استفادٍ اس کذُای جاوا اسکزیپت هوجود در یَ فایل خارجی‬
‫‪7‬‬ ‫تْضیحات جاّا اسکزیپت‬
‫‪8‬‬ ‫توضیحات چٌذ خطی جاوا اسکزیپت‬
‫‪8‬‬ ‫استفادٍ اس کاهٌت ُا بزای جلوگیزی اس اجزای کذُای جاوا اسکزیپت‬
‫‪9‬‬ ‫استفادٍ اس کاهٌت در آخز یک خط‬
‫‪11‬‬ ‫فصل دّم ‪ :‬هتغیزُا در جاّا اسکزیپت‬
‫‪12‬‬ ‫آشٌایی با هفاُین هتغییز ُا ّدادٍ‬

‫‪12‬‬ ‫ًحٍْ تؼزیف هتغییز در جاّا اسکزیپت‬
‫‪21‬‬ ‫هقذاردُی بَ هتغییزُا ‪:‬‬
‫‪13‬‬ ‫اًْاع دادٍ ُای اصلی در جاّا اسکزیت ‪:‬‬
‫‪23‬‬ ‫‪UNDEFINED‬‬
‫‪23‬‬ ‫‪BOOLEAN‬‬
‫‪23‬‬ ‫‪NULL‬‬
‫‪23‬‬ ‫‪CHARACTER‬‬
‫‪23‬‬ ‫‪NUMBER‬‬
‫‪24‬‬ ‫‪FLOAT‬‬
‫‪24‬‬ ‫‪STRING‬‬
‫‪25‬‬ ‫قواعذ ًام گذاری هتغییز ُا‬
‫‪26‬‬ ‫آضٌایی با کلوات رسرو ضذٍ‬
‫‪26‬‬ ‫هتغییز ُای هحلی و سزاسزی‬
‫‪26‬‬ ‫سهاى حیات هتغیزُاي جاوااسکزیپت‬
‫‪21‬‬ ‫چگوًگی صذا کزدى یک هتغیز‬
‫‪11‬‬ ‫ثابت ُا‬
‫‪11‬‬ ‫تبذیل اًْاع در جاّا اسکزیپت‬
‫‪29‬‬ ‫تبذیل بَ رضتَ‬
‫‪12‬‬ ‫تبذیل بَ عذد‬

‫‪21‬‬ ‫استفادٍ اس ‪ TYPE CASTING‬بزای تبذیل اًْاع‬
‫‪22‬‬ ‫فصل سْم ‪ :‬تْابغ‬
‫‪22‬‬ ‫استفادٍ اس تْابغ در جاّا اسکزیپت‬

‫‪15‬‬ ‫چزا توابع هورد استفادٍ قزار هی گیزًذ‪:‬‬
‫‪15‬‬ ‫ساختار توابع ‪:‬‬
‫‪16‬‬ ‫قزاردادى کذُا در دروى تابع ‪:‬‬
‫‪11‬‬ ‫ًام گذاری توابع ‪:‬‬
‫‪11‬‬ ‫اضافَ کزدى پاراهتز بَ توابع ‪:‬‬
‫‪19‬‬ ‫اضافَ کزدى دستور ‪ RETURN‬بَ تابع ‪:‬‬
‫‪32‬‬ ‫صذا سدى یک تابع توسط تابعی دیگز ‪:‬‬
‫‪32‬‬ ‫فصل چِارم‪ :‬ػولگزُا‬
‫‪33‬‬ ‫هؼزفی ػولگزُای هْرد استفادٍ در ‪JAVASCRIPT‬‬

‫‪36‬‬ ‫عولگزُای هحاسباتی‬
‫‪31‬‬ ‫عولگزُای جایگشیٌی‬
‫‪31‬‬ ‫عولگزُای هقایسَ ای‬
‫‪38‬‬ ‫عولگزُای هٌطقی‬
‫‪38‬‬ ‫عولگز رضتَ ای‬
‫‪22‬‬ ‫فصل پٌجن‪ :‬حلقَ ُا‬
‫‪22‬‬ ‫هؼزفی دستْر شزطی ‪ ّ IF...ELSE‬کاربزدُای هختلف آى‬

‫‪45‬‬ ‫دستور ضزطی ‪IF‬‬
‫‪46‬‬ ‫دستور ضزطی ‪IF...ELSE‬‬
‫‪41‬‬ ‫استفادٍ اس دستور ‪( IF..ELSE IF...ELSE‬دستورات ضزطی تو در تو)‬
‫‪48‬‬ ‫دستور ‪SWITCH‬‬
‫‪52‬‬ ‫ًحوٍ استفادٍ اس حلقَ ُای ‪FOR‬‬
‫‪52‬‬ ‫حلقَ ‪FOR‬‬
‫‪51‬‬ ‫ًحوٍ استفادٍ اس حلقَ ُای ‪WHILE‬‬
‫‪53‬‬ ‫حلقَ ‪DO...WHILE‬‬
‫‪54‬‬ ‫آهوسش کار با دستور ‪FOR...IN‬‬
‫‪23‬‬ ‫فصل ششن ‪ :‬رّیذادُا‬
27 ‫رّیذادُا‬
51 THE ABORT EVENT (ONABORT)
21 ‫رّیذادُای هزبْط بَ هاّص‬
58 THE CLICK EVENT (ONCLICK)
59 THE DOUBLECLICK EVENT (ONDBCLICK)
59 THE MOUSEOVER EVENT (ONMOUSEOVER)
62 THE MOUSEOUT EVENT (ONMOUSEOUT)
62 THE MOUSEDOWN EVENT (ONMOUSEDOWN)
62 THE MOUSEUP EVENT (ONMOUSEUP)
62 THE MOUSEMOVE EVENT (ONMOUSEMOVE)
33 ‫رّیذادُای صفحَ کلیذ‬
63 THE KEYDOWN EVENT (ONKEYDOWN)
63 THE KEYPRESS EVENT (ONKEYPRESS)
63 THE KEYUP EVENT (ONKEYUP)
32 : ‫رّیذادُای هزبْط بَ فزم‬
65 THE FOCUS EVENT (ONFOCUS)
65 THE BLUR EVENT (ONBLUR)
66 THE CHANGE EVENT (ONCHANGE)
66 THE SUBMIT EVENT (ONSUBMIT)
66 THE RESET EVENT (ONRESET)
61 THE SELECT EVENT (ONSELECT)
31 ‫رّیذادُای پٌجزٍ هزّرگز‬
69 THE LOAD EVENT (ONLOAD)
12 THE UNLOAD EVENT (ONUNLOAD)
12 THE RESIZE EVENT(ONRESIZE)
12 THE SCROLL EVENT(ONSCROLL)
73 ‫ اشیا‬: ‫فصل ُفتن‬
72 ‫بزًاهَ ًْیسی شیءگزا‬

72 )OBJECT( ‫اشیاء‬
14 ‫اضیاء در جاوا اسکزیپت‬
15 ‫ساختار اضیا‬
11 OBJECT INITIALIZER ‫اسفادٍ اس روش‬
82 FOR – IN LOOP ‫دستور‬
82 THE WITH STATEMENT ‫دستور‬
11 ‫اشیا اس پیش تؼزیف شذٍ در جاّا اسکزیپت‬
82 )‫(اضیا ُذایت گز‬THE NAVIGATOR OBJECT
11 PROPERTIES
13 ‫هتذُا‬
84 THE HISTORY OBJET
17 DOM : ‫فصل ُشتن‬
11 DOM‫هذل شی گزاي سٌذ ؛‬

19 ‫استفادٍ اس ّیژگی ُای هذل شی گزای سٌذ‬
91 THE COLOR PROPERTIES
91 THE ANCHORS PROPERTY (ARRAY)
2
93 THE COOKIE PROPERTY
91 THE DOMAIN PROPERTY
91 THE FORMNAME PROPERTY
98 THE LASTMODIFIED PROPERTY
98 THE LAYERS PROPERTY (ARRAY)
98 THE ALL PROPERTY
99 THE LINKS PROPERTY (ARRAY)
99 THE TITLE PROPERTY
99 THE URL PROPERTY
222 THE URLUNENCODED PROPERTY
199 DOM ‫استفادٍ اس هتذُای‬
221 GETELEMENTBYID() ‫هتذ‬
221 GETELEMENTBYNAME() ‫هتذ‬
223 THE GETELEMENTSBYCLASSNAME() ‫هتذ‬
223 GETELEMENTSBYTAGNAME() ‫هتذ‬
224 CLOSE() ‫ و‬OPEN() ‫هتذُای‬
192 DOM ‫خْاص گزٍ ُا در‬
226 DOM ‫هتذُای هزبوط بَ گزٍ ُا در‬
191 DOM ‫درآهذی بز تکٌیک ُای پیشزفتَ در‬
222 DOM STYLE METHODS
223 CUSTOM TOOLTIPS
224 COLLAPSIBLE SECTIONS
225 INNERTEXT AND INNERHTML
226 OUTERTEXT AND OUTERHTML
129 ٍ‫ اشیاء پٌجز‬: ‫فصل ًِن‬
121 PROPERTIES_‫خصْصیات‬
211 THE CLOSED PROPERTY

211 INNERHEIGHT PROPERTY
211 INNERWIDTH PROPERTY
213 THE LENGTH PROPERTY
213 THE LOCATION PROPERTY
213 THE NAME PROPERTY
214 THE OPENER PROPERTY
214 THE PARENT PROPERTY
214 THE SELF PROPERTY
122 ‫هتذُا‬
215 THE ALERT() METHOD
215 THE CONFIRM() METHOD
216 THE FIND() METHOD
211 THE HOME() METHOD
211 THE PRINT() METHOD
211 THE PROMPT() METHOD
219 THE OPEN() METHOD
231 THE CLOSE() METHOD
231 THE MOVEBY() METHOD
233 THE MOVETO() METHOD
233 THE RESIZEBY() METHOD
234 THE RESIZETO() METHOD
234 THE SETINTERVAL() METHOD
235 THE CLEARINTERVAL() METHOD
236 THE SETTIMEOUT() METHOD
236 THE CLEARTIMEOUT() METHOD
131 َ‫ آرای‬: ‫فصل دُن‬
131 َ‫ًاهگذاری یک آرای‬

131 َ‫تؼزیف یک آرای‬
131 َ‫دستزسی بَ اجشای آرای‬
129 َ‫دیگز راٍ ُای تؼزیف آرای‬
122 َ‫ّیژگی ُا ّ هتذُای آرای‬
241 THE CONSTRUCTOR
243 THE LENGTH
243 THE PROTOTYPE
122 َ‫هتذُای آرای‬
245 THE CONCAT() METHOD

246 THE JOIN() METHOD
241 THE POP() METHOD
241 THE PUSH() METHOD
248 THE REVERSE() METHOD
248 THE SHIFT() METHOD
249 THE SLICE() METHOD
249 THE SPLICE() METHOD
252 THE SORT() METHOD
252 THE TOSTRING METHOD
121 ‫هتذُای بیشتز‬
122 ‫ساخت اجشای آرایَ با استفادٍ اس حلقَ ُا‬
122 )ASSOCIATIVE ARRAYS(‫آرایَ ُای شزکت پذیز‬
254 ‫تعزیف‬
255 ‫دستزسی بَ آرایَ ُای اًجوٌی‬
127 ‫اشیاء ریاضی‬: ‫فصل یاسدُن‬
121 PROPERTIES
258 ‫استفادٍ اس ویژگی ُا‬
121 METHODS
262 ‫هتذُای اصلی‬
262 ‫هتذُای دو پاراهتزی‬
263 ‫دیگز هتذُا‬
132 ‫اشیای ػذدی‬
265 ‫ویژگی ُا‬
137 ‫اشیای سهاى‬
261 ‫ویژگی ُا‬
215 ‫دیگز هتذُا‬
171 ‫ رشتَ ُای هتٌی‬: ‫فصل دّاسدُن‬
171 THE STRING OBJECT

119 ‫ساخت لیتزال هتٌی‬
119 ‫ّیژگی ُای شی هتٌی‬
282 THE CONSTRUCTOR PROPERTY
282 THE LENGTH PROPERTY

281 THE PROTOTYPE PROPERTY
112 ‫هتذُای شی هتٌی‬
283 THE BIG() METHOD
284 THE BLINK() METHOD
284 THE ANCHOR() METHOD
285 THE FONTCOLOR() METHOD
286 THE FONTSIZE() METHOD
281 THE LINK() METHOD
289 THE CHARAT() METHOD
292 THE CONCAT() METHOD
292 THE FROMCHARCODE() METHOD
293 THE LASTINDEXOF() METHOD
293 THE REPLACE() METHOD
294 THE SLICE() METHOD
294 THE SPLIT() METHOD
295 THE SUBSTR() METHOD
295 THE SUBSTRING() METHOD
295 THE TOSTRING() METHOD
296 THE TOLOWERCASE() METHOD
296 THE TOUPPERCASE() METHOD
111 )REGEXP OBJECT( ‫شیء ػبارات هٌظن‬
298 ‫ چیست‬REGEXP
299 ADDING FLAGS
299 : FLAG I
122 TEST)( ‫هتذ‬
122 EXEC)( ‫هتذ‬
124 THE REPLACE() METHOD
125 THE MATCH() METHOD
125 THE SEARCH() METHOD
291 ‫ فزم در جاّا اسکزیپت‬: ‫فصل سیشدُن‬
291 ‫دستزسی بَ فزم ُا‬

129 FORM ARRAY ‫استفادٍ اس‬
122 FORM NAMES ‫استفادٍ اس‬
121 ID ‫استفادٍ اس‬
213 PROPERTIES
213 THE ACTION PROPERTY

212 THE ELEMENTS PROPERTY (ARRAY)
124 THE CHECKED PROPERTY
126 THE DEFAULTCHECKED PROPERTY
126 THE DEFAULTVALUE PROPERTY
121 THE FORM PROPERTY
121 THE OPTIONS PROPERTY (ARRAY)
128 THE TYPE PROPERTY
128 THE VALUE PROPERTY
128 THE FOCUS() METHOD
129 THE BLUR() METHOD
129 THE METHOD PROPERTY
112 THE NAME PROPERTY
112 THE TARGET PROPERTY
221 METHODS
221 THE RESET() METHOD
221 THE SUBMIT() METHOD
222 ‫اطویٌاى اس قابلیت دستزسی در فزم ُا‬
111 ٍ‫استفادٍ اس اجشا و بزچسب ُای آهاد‬
222 ‫ فزین در جاّا اسکزیپت‬: ‫فصل چِاردُن‬
227 FRAME OPTIONS

221 ‫دستزسی بَ فزین ُا‬
221 THE FRAMES ARRAY
132 ‫استفادٍ اس ًام فزین ُا‬
232 ‫ػْض کزدى فزین تکی‬
233 ًَ‫ػْض کزدى فزین ُای چٌذگا‬
237 ‫هتغیزُای سزاسزی در فزین ُا‬
222 ‫سخي پایاًی‬
‫هقذهِ‬
‫وشبثی و‪ ٝ‬دیً ـ‪ ٚ‬ؼاـیؽ ‪ٚ‬یفایً ؼ‪ ْٚ‬وشبثی اوز ثب ‪ٕٞ‬یٗ ػ‪ٛٙ‬اٖ و‪ ٝ‬ؼـ سبثىشبٖ ‪ٍ٘ ,.4-‬بـي ‪ ٚ‬ـا‪ٞ‬ی‬
‫ای‪ٙ‬شف٘ز ٌؽ) ؼـ اثشؽا لّؽ ثف ٘‪ٌٛ‬شٗ وشبثی ٔدكا اق وشبة ا‪ َٚ‬ث‪ٛ‬ؼ ‪ِٚ‬ی ثب ٔ‪ٛ‬ـؼ س‪ٛ‬خ‪ ٝ‬لفاـ ٌففشٗ ‪ٚ‬یفایً ا‪َٚ‬‬
‫ایٗ وشبة سّٕیٓ ث‪ ٝ‬ثىٗ ‪ٌ ٚ‬ىشفي آٖ ٕ٘‪ٛ‬ؼْ ‪ ٚ‬ضبَ ثؼؽ اق ٌؿٌز ز‪ٙ‬ؽ ٔب‪ ٜ‬وبـ سؽ‪ٚ‬یٗ آٖ ـا ث‪ ٝ‬دبیبٖ‬
‫ـوب٘ؽْ) ایٗ ‪ٚ‬یفایً و‪ ٝ‬فمٗ ؼـ ػ‪ٛٙ‬اٖ ثب ‪ٚ‬یفایً ا‪ٍٔ َٚ‬شفن اوز ث‪ٛ٘ ٝ‬ػی وشبثی ؼیٍف اوز ثب وبغشبـی‬
‫سبق‪ ٜ‬سف ‪ ٚ‬ثب ـػبیز وّىّ‪ٔ ٝ‬فاسجی و‪ ٝ‬ؼـ ٔ‪ٙ‬بثغ آٔ‪ٛ‬قٌی السیٗ خب‪ٚ‬ا اوىفیذز ٔ‪ٛ‬خ‪ٛ‬ؼ اوز ‪ ٚ‬ث‪ ٝ‬ؼالیُ قیف‬
‫سّٕیٓ ث‪ ٝ‬ا٘شٍبـ آٖ ٌففشٓ‪5‬‬
‫‪ -1‬وثًدن یک مىثع جامع کٍ تیشتر سرفصل َای جايا اسکریپت را شامل شًد‪.‬‬
‫‪ -2‬تعذد مىاتع فارسی کٍ تٍ دلیل وذاشته ساختار ي سلسلٍ مراتة مىاسة تیشتر تاعث سردرگمی خًاوىذٌ می‬
‫شًد‪.‬‬
‫‪ -3‬التیه تًدن مىاتع جامع مًجًد کٍ تری کساوی کٍ تٍ ایه زتان تسلط وذاروذ فرایىذ یادگیری را سخت ي کسل‬
‫کىىذٌ می کىىذ‪.‬‬
‫‪ -4‬ي ‪. . .‬‬
‫أیؽ اوز و‪ ٝ‬ثب ا٘شٍبـ ایٗ وشبة ٌبٔی و‪ٛ‬زه ؼـ آٔ‪ٛ‬قي ‪ٌ ٚ‬ىشفي ثف٘بٔ‪ٛ٘ ٝ‬یىی ‪ٚ‬ة ثفؼاٌش‪ ٝ‬ثبٌٓ)‬
‫ثب سٍىف‬
‫‪ٞ‬بؼی اضٕؽی‬
‫ٌ‪ٟ‬فی‪ٛ‬ـ ‪,.4/‬‬
‫‪HadiAhmadi105@gmail.com‬‬
‫‪HTTP://www.DLP.lxb.ir‬‬
‫‪1‬‬ ‫دَلران پی سی‬

‫فصل اٍل ‪ :‬ضزٍع کار تا جاٍ اسکزیپت‬

‫آضٌایی تا جاٍا اسکزیپت ٍ هفَْم اسکزیپت ًَیسی‬
‫خب‪ٚ‬ا اوىفیذز قثب٘ی اوز و‪ ٝ‬ؼـ ِفطبر ‪ HTML‬وبـثفؼ ؼاـؼ ‪ ٚ‬لبثّیز ‪ٞ‬بی ثىیبـی اق لجیُ ‪5‬الكایً‬
‫ویفیز ٘فاضی ِفطبر‪،‬و‪ٙ‬شفَ ِفطبر‪ ،‬و‪ٙ‬شفَ ٔف‪ٚ‬ـٌف ثبقؼیؽ و‪ٙٙ‬ؽ‪،ٜ‬وبغز ‪ ٚ‬اوشفبؼ‪ ٜ‬اق و‪ٛ‬وی ‪ٞ‬ب ‪ٚ‬‬
‫ثىیبـی زیك ‪ٞ‬بی ؼیٍف) خب‪ٚ‬ا اوىفیذز یه قثبٖ ثف٘بٔ‪ٛ٘ ٝ‬یىی اوىفیذشی اوز و‪ ٝ‬وؽ ‪ٞ‬بی آٖ ثىیبـ ٌجی‪ٝ‬‬
‫‪ #‬اوز)قثبٖ خب‪ٚ‬ا اوىفیذز ث‪ ٝ‬ضف‪ٚ‬ف ثكـي ‪ ٚ‬و‪ٛ‬زه ضىبن اوز ‪ ٚ‬یه قثبٖ ثف٘بٔ‪ٛ٘ ٝ‬یىی‬ ‫‪C‬‬ ‫ث‪ ٝ‬قثبٖ ‪$‬‬
‫ٌیٍفا ٔی ثبٌؽ) ث‪ ٝ‬ایٗ ٔؼ‪ٙ‬ب و‪ٞ ٝ‬ف ػ‪ّٙ‬ف ؼـ ِفط‪ٚ ٝ‬ة ـا ث‪ ٝ‬ؼیؽ یه ٌی ٔی ثی‪ٙ‬ؽ ‪ ٚ‬ثب آٖ ـفشبـ ٔی و‪ٙ‬ؽ)‬
‫اق آ٘دبیی و‪ ٝ‬ؼوش‪ٛ‬ـار خب‪ٚ‬ا اوىفیذز ٔب٘‪ٙ‬ؽ ؼوش‪ٛ‬ـار ‪٘ ، HTML‬یبق ث‪ٔ ٝ‬طیٗ غبِی ثفای ٘‪ٌٛ‬شٗ‬
‫٘ؽاـؼ ‪ ٚ‬ثفای ٘‪ٌٛ‬شٗ ؼوش‪ٛ‬ـار آٖ ٔی س‪ٛ‬اٖ اق ‪ٞ‬ف ‪ٚ‬یفایً ٌف ٔش‪ٙ‬ی اوشفبؼ‪ ٜ‬وفؼ) أب ٘فْ افكاـ ‪ٞ‬بی قیبؼی ‪ٓٞ‬‬
‫‪ٚ‬خ‪ٛ‬ؼ ؼاـؼ و‪ ٝ‬ثفای ٘‪ٌٛ‬شٗ وؽ‪ٞ‬بی ‪ Java Script‬أىب٘بسی ـا ؼـ اغشیبـ ٔب لفاـ ٔی ؼ‪ٙٞ‬ؽ)ٔب٘‪ٙ‬ؽ ـٍ٘ی وفؼٖ‬
‫ؼوش‪ٛ‬ـار ‪ ٚ‬دیؽا وفؼٖ غ‪ٙ‬ب‪ٞ‬ب ‪… ٚ‬اق خّٕ‪ ٝ‬ایٗ ٘فْ افكاـ‪ٞ‬ب ٔیش‪ٛ‬اٖ ‪٘ dreamweaver‬بْ ثفؼ)‬
‫آضٌایی تا چگًَگی استفادُ اس فزاهیي جاٍا اسکزیپت‬
‫ث‪ٛ٘ ٝ‬ـ وّی ث‪ ٝ‬ز‪ٟ‬بـ ٘فیك ٔی س‪ٛ‬اٖ اق خب‪ٚ‬ا اوىفیذز ؼـ او‪ٙ‬بؼ ‪ HTML‬اوشمبؼ‪ ٜ‬وفؼ‬
‫‪ٚ‬اـؼ وفؼٖ وؽ‪ٞ‬بی خب‪ٚ‬ا اوىفیذز ؼـ لىٕز <‪ِ <head‬فط‪ٝ‬‬ ‫‪(,‬‬
‫‪ٚ‬اـؼ وفؼٖ وؽ‪ٞ‬بی خب‪ٚ‬ا اوىفیذز ؼـ ثػً <‪ِ <body‬فط‪ٝ‬‬ ‫‪(-‬‬
‫اوشفبؼ‪ ٜ‬اق وؽ‪ٞ‬بی خب‪ٚ‬ا اوىفیذز ٔ‪ٛ‬خ‪ٛ‬ؼ ؼـ ی‪ ٝ‬فبیُ غبـخی‬ ‫‪(.‬‬
‫اوشفبؼ‪ ٜ‬اق وؽ‪ٞ‬بی خب‪ٚ‬ا اوىفیذز ؼـ ؼـ‪ ٖٚ‬ثفزىت ‪ٞ‬بی ‪$ HTML‬اوىفیذز ٘‪ٛ‬یىی ‪#Inline‬‬ ‫‪(/‬‬
‫٘ىش‪ٌٕ 5ٝ‬ب ٔی س‪ٛ‬ا٘یؽ اق ‪ ٕٝٞ‬ـ‪ٚ‬ي ‪ٞ‬بی ثبال ث‪ٛ٘ ٝ‬ـ ‪ٕٞ‬كٔبٖ ثفای ‪ٚ‬اـؼ وفؼٖ خب‪ٚ‬ا اوىفیذز ؼـ ِفط‪ٝ‬‬
‫اوشفبؼ‪ ٜ‬و‪ٙ‬یؽ )‬
‫ٍارد کزدى کذّای جاٍا اسکزیپت در قسوت <‪ >head‬صفحِ‬

‫ثفای ٘‪ٌٛ‬شٗ وؽ‪ٞ‬بی خب‪ٚ‬ا اوىفیذز ؼـ لىٕز <‪ٌٕ <head‬ب ثبیؽ وؽ‪ٞ‬ب ـا ؼـخبی ٔ‪ٙ‬بوت ‪ٔ ٚ‬یبٖ‬
‫ثفزىت ٌف‪ٚ‬ع <‪ ٚ <script‬ثفزىت دبیبٖ <‪ </script‬ث‪ٛٙ‬یىؽ)‬
‫٘ىش‪ 5 ٝ‬وؽ‪ٞ‬بیی و‪ٔ ٝ‬ی غ‪ٛ‬ا‪ٞ‬یؽ ثب ـ‪ٚ‬یؽاؼ غبِی اخفا ٌ‪٘ٛ‬ؽ ـا ؼـ ایٗ لىٕز ٔی ٘‪ٛ‬یىیؽ)‬

<html>
<head>
<title>untitled document</title>
<script type=”text/javascript”>
‫دستورات جاوا اسکزیپت‬
</script>
</head>
<body>
</body>
</html>
5 ,(, َ‫ٔثب‬
<html>
<head>
<title>untitled document</title>
document.write(“hello world”)
</script>
</head>
<body>
</body>
</html>
)‫ؽ ٌؽ‬ٞ‫ا‬ٛ‫ غ‬ٜ‫ٔیص ؼاؼ‬ٛ‫َ ثؼؽی س‬ّٛ‫ ؼـ ف‬document.write ‫ـ‬ٛ‫ـؼ ؼوش‬ٛٔ ‫ ؼـ‬5 ٝ‫٘ىش‬
ِ‫> صفح‬body< ‫ٍارد کزدى کذّای جاٍا اسکزیپت در تخص‬

ٖ‫ ٔیب‬ٚ ‫بوت‬ٙٔ ‫ب ـا ؼـخبی‬ٞ‫< ٌٕب ثبیؽ وؽ‬body< ‫ا اوىفیذز ؼـ لىٕز‬ٚ‫بی خب‬ٞ‫ٌشٗ وؽ‬ٛ٘ ‫ثفای‬
)‫یىؽ‬ٛٙ‫< ث‬/body< ٖ‫ ثفزىت دبیب‬ٚ <body< ‫ع‬ٚ‫ثفزىت ٌف‬
)‫یىیؽ‬ٛ٘ ‫٘ؽ ـا ؼـ ایٗ لىٕز ٔی‬ٌٛ ‫ اخفا‬ٝ‫یؽ ثب ثبـٌكاـی ِفط‬ٞ‫ا‬ٛ‫ ٔیػ‬ٝ‫بیی و‬ٞ‫وؽ‬
4 ‫دَلران پی سی‬
‫>‪<html‬‬
‫<‪>head‬‬
‫<‪>title>my page</title‬‬
‫<‪>/head‬‬
‫<‪>body‬‬
‫>”‪<script type=”text/javascript‬‬
‫دستورات جاوااسکزیپت‬
‫<‪>/script‬‬
‫>‪</body‬‬
‫<‪>html‬‬
‫ٔثبَ ‪5 ,(-‬‬
‫>‪<head‬‬
‫>‪<title>my page</title‬‬
‫<‪>/head‬‬
‫<‪>body‬‬
‫)”‪Alert(“hello world‬‬
‫<‪>/script‬‬
‫>‪</body‬‬
‫<‪>html‬‬
‫٘ىش‪ 5 ٝ‬ؼـ ٔ‪ٛ‬ـؼ ؼوش‪ٛ‬ـ ‪ alert‬ؼـ فّ‪ َٛ‬ثؼؽ سٕیص ؼاؼ‪ ٜ‬غ‪ٛ‬ا‪ٞ‬ؽ ٌؽ)‬
‫استفادُ اس کذّای جاٍا اسکزیپت هَجَد در یِ فایل خارجی‬

‫ثفای اوشفبؼ‪ ٜ‬اق ایٗ ـ‪ٚ‬ي ٌٕب ٔی ثبیىز ؼوش‪ٛ‬ـار غ‪ٛ‬ؼ ـا ؼـ یه فبیُ ٔش‪ٙ‬ی ث‪ٛٙ‬یىیؽ ‪ ٚ‬فبیُ ـا ثب‬
‫ففٔز ‪ . js‬ؾغیف و‪ٙ‬یؽ ‪ ٚ‬ثؼؽ فبیُ ـا ث‪ٚ ٝ‬ویّ‪ ٝ‬وؽ قیف و‪ ٝ‬ؼـ لىٕز <‪ٔ <head‬ی ٘‪ٛ‬یىیؽ ث‪ ٝ‬و‪ٙ‬ؽ غ‪ٛ‬ؼ‬
‫ٔشُّ و‪ٙ‬یؽ)‬
‫ٔثبَ ‪5,(.‬‬
‫اثشؽا ٘‪ٛ‬ر دؽ غ‪ٛ‬ؼ ـا ثبق و‪ٙ‬یؽ ‪ ٚ‬وذه ؼوش‪ٛ‬ـار قیف ـا ؼـ آٖ ‪ٚ‬اـؼ و‪ٙ‬یؽ ‪5‬‬
‫;)”‪Document.write(“hello wold‬‬

jsfile1.js َ‫ـ ٔثب‬ٛٙ‫یؽ ث‬ٙ‫ و‬ٜ‫ ؾغیف‬.js ‫٘ؽ‬ٛ‫ دى‬ٚ ٜ‫ا‬ٛ‫وذه فبیُ ـا ثب اوٓ ؼِػ‬
5‫یؽ‬ٙ‫ و‬ٝ‫ؼ أبف‬ٛ‫ غ‬html ‫ؽ‬ٙ‫ و‬ٝ‫ـ قیف آٖ ـا ث‬ٛ‫ اق ؼوش‬ٜ‫وذه ثب اوشفبؼ‬
<html>
<head>
<title>my page name</title>
<script type=”text/javascript” src=”jsfile1.js></script>
</head>
<body>
</body>
</html>
)‫ ا٘ؽ‬ٜ‫ ٌؽ‬ٜ‫ِؽـ ؾغیف‬ٛ‫ ؼـ یه ف‬jsfile1.js ُ‫ فبی‬ٚ html ُ‫ فبی‬ٝ‫ و‬ٜ‫ؼ‬ٛ‫ ؼـ ٔثبَ ثبال ففْ ثفایٗ ث‬5 , ٝ‫٘ىش‬
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ی اوشفبؼ‬ٞ‫ وؽ ثبال ثفای آؼـن ؼ‬ٝ‫ؼ‬ٙ‫ ؼـ ل‬src ‫ اق‬5 - ٝ‫٘ىش‬
#Inline ‫یىی‬ٛ٘ ‫اوىفیذز‬$ HTML ‫بی‬ٞ ‫ٖ ثفزىت‬ٚ‫ا اوىفیذز ؼـ ؼـ‬ٚ‫بی خب‬ٞ‫ اق وؽ‬ٜ‫اوشفبؼ‬
5,(/ َ‫ٔثب‬
>html<
>head<
>title<my page</title>
</head>
<body>
<input type=”button” value=”ok” onclick=alert”(„hello world‟)”
/>
</body>
>/html>
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ ٕ٘بیً ؼاؼ‬hello world ٖٕٕٛٔ ‫ٍؽاـی ثب‬ٞ ْ‫ دیب‬ok ٕٝ‫ی ؼو‬ٚ‫ثب وّیه ثف ـ‬
‫٘ىبر ٔ‪ ٟٓ‬ؼـ ٘‪ٌٛ‬شٗ وؽ‪ٞ‬بی خب‪ٚ‬ا اوىفیذز‬
‫‪ (,‬خب‪ٚ‬ا اوىفیذز ث‪ ٝ‬ثكـٌی ‪ ٚ‬و‪ٛ‬زىی ضف‪ٚ‬ف ضىبن اوز‬
‫٘‪ٌٛ‬شٗ وبـوشف” ; ” ویٕیى‪ ِٖٛٛ‬ؼـ ا٘ش‪ٟ‬بی ؼوش‪ٛ‬ـ اخجبـی ٘یىز أب ؼـ ٔ‪ٛ‬الؼی و‪ٌٕ ٝ‬ب ز‪ٙ‬ؽ ؼوش‪ٛ‬ـ‬ ‫‪(-‬‬
‫ـا ؼـ یه غٗ ٔی ٘‪ٛ‬یىیؽ ٘‪ٌٛ‬شٗ وٕیىبِ‪ ٖٛ‬اخجبـی اوز سب دبیبٖ ‪ٞ‬ف ؼوش‪ٛ‬ـ ٍٔػُ ٌ‪ٛ‬ؼ‬
‫ثفای ؼـج س‪ٔٛ‬یطبر یه غ‪ٙ‬ی اق** ؼـ اثشؽای آٖ غٗ‬ ‫‪(.‬‬
‫ثفای ؼـج س‪ٔٛ‬یطبر ز‪ٙ‬ؽ غ‪ٙ‬ی ؼـاثشؽای آٖ *‪ ٚ %‬ؼـا٘ش‪ٟ‬بی آٖ‪ *%‬اوشفبؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ)‬ ‫‪(/‬‬
‫ث‪ ٝ‬وبـثفؼٖ فبِّ‪ ٝ‬غبِی ؼـ وؽ‪ٞ‬ب اق و‪ٛ‬ی ٔف‪ٚ‬ـٌف ٘بؼیؽ ٌففش‪ٔ ٝ‬ی ٌ‪ٛ‬ؼ)‬ ‫‪(0‬‬
‫تَضیحات جاٍا اسکزیپت‬
‫وبٔ‪ٙ‬ش‪ٟ‬ب ٔی س‪ٛ‬ا٘‪ٙ‬ؽ یه س‪ٔٛ‬یص ـا ث‪ ٝ‬خب‪ٚ‬ا اوىفیذز أبف‪ ٝ‬و‪ٙٙ‬ؽ ‪ ٚ‬یب آٖ ـا غ‪ٛ‬ا٘ب سف و‪ٙٙ‬ؽ) وبٔ‪ٙ‬ش‪ٟ‬ب ‪ٞ‬یسٍب‪ٜ‬‬
‫اخفا ٕ٘یٍ‪٘ٛ‬ؽ ‪ ٚ‬ثیٍشفیٗ اوشفبؼ‪ ٜ‬آٖ ثفای غ‪ٛ‬ؼ ثف٘بٔ‪ٛ٘ ٝ‬یه اوز زفاو‪ ٝ‬ثف٘بٔ‪ٛ٘ ٝ‬یه ٔیش‪ٛ‬ا٘ؽ ثب افك‪ٚ‬ؼٖ‬
‫س‪ٔٛ‬یطبر ث‪ ٝ‬وؽ غ‪ٛ‬ا٘بیی ‪ ٚ‬ؼـن آٖ ـا ثفای غ‪ٛ‬ؼ ‪ ٚ‬وبیف ثف٘بٔ‪ٛ٘ ٝ‬یىبر ثیٍشف و‪ٙ‬ؽ!‬
‫س‪ٔٛ‬یطبر یه غ‪ٙ‬ی ثب ** ٌف‪ٚ‬ع ٔی ٌ‪٘ٛ‬ؽ )‬
‫ٔثبَ ‪5,(0‬‬
‫ایٗ ٔثبَ اق وبٔ‪ٙ‬ش‪ٟ‬بی یه غ‪ٙ‬ی ثفای س‪ٔٛ‬یص وؽ‪ٞ‬ب اوشفبؼ‪ ٜ‬وفؼ‪ ٜ‬اوز)‬
‫‪//this will write a header‬‬
‫;)”>‪document.write(“<h1>this is a header</h1‬‬
‫‪//this will write two paragraphs‬‬
‫;)”>‪document.write(“<h1>this is a paragraph</h1‬‬
‫;)”>‪document.write(“<h1>this is a another paragraph </h1‬‬
‫>‪</script‬‬

‫تَضیحات چٌذ خطی جاٍا اسکزیپت‬

)‫٘ؽ‬ٌٛ ‫ سٕبْ ٔی‬%* ‫ ثب‬ٚ ٜ‫ع ٌؽ‬ٚ‫* ٌف‬% ‫ا اوىفیذز ثب‬ٚ‫ی خب‬ٙ‫ؽ غ‬ٙ‫ٔیطبر ز‬ٛ‫س‬
5,(1 َ‫ٔثب‬
)ٜ‫ وفؼ‬ٜ‫ب اوشفبؼ‬ٞ‫ٔیص وؽ‬ٛ‫ی ثفای س‬ٙ‫ؽ غ‬ٙ‫بی ز‬ٟ‫ش‬ٙٔ‫ایٗ ٔثبَ اق وب‬
/*
the code below will write
one header and two paragraphs
*/
document.write(“<h1>this is a header</h1>”);
document.write(“<h1>this is a paragraph</h1>”);
document.write(“<h1>this is a another paragraph </h1>”);
</script>
‫استفادُ اس کاهٌت ّا تزای جلَگیزی اس اجزای کذّای جاٍا اسکزیپت‬

‫یؽ سغییفاسی ـا ؼـ‬ٞ‫ا‬ٛ‫ ثف ایٗ ٌبیؽ ٌٕب ٔی غ‬ٜٚ‫ؼ ػال‬ٚ‫ وبـ ٔی ـ‬ٝ‫ ث‬ٝٔ‫ایٗ وبـ ثفای اٌىبَ ٌیفی اق ثف٘ب‬
)‫ آٖ ـا اق ؼوشفن وبـثفاٖ غبـج وفؼیؽ‬ٜ‫سب‬ٛ‫ ثفای ٔؽسی و‬ٚ ‫یؽ‬ٞ‫ب ا٘دبْ ؼ‬ٞ‫ی ایٗ لىٕز اق وؽ‬ٚ‫ ثف ـ‬ٜ‫ؽ‬ٙ‫آی‬
5,(2 َ‫ٔثب‬
// document.write(“<h1>this is a another paragraph
</h1>”);
</script>
5,(3 َ‫ٔثب‬
)‫ؽ‬ٙ‫ٌیفی ٔی و‬ّٛ‫ی خ‬ٙ‫ؽ غ‬ٙ‫ اق اخفای یه وؽ ز‬ٝ‫ز اوز و‬ٙٔ‫ایٗ ٔثبِی اق وب‬
/*
document.write(“<h1>this is a another paragraph </h1>”);
*/
</script>
‫استفادُ اس کاهٌت در آخز یک خط‬
ٚ ‫ٔیطبر ثیٍشف‬ٛ‫ب ثفای س‬ٟ‫ش‬ٙٔ‫ ؼـ آغف یه غٗ لفاـ ؼاـؼ ' ایٗ وب‬ٝ‫ز اوز و‬ٙٔ‫ ای اق یه وب‬ٕٝ٘ٛ٘ ٗ‫ای‬
)‫٘ؽ‬ٚ‫ ثىبـ ٔی ـ‬ٝٔ‫بی ثف٘ب‬ٞ‫ا٘بسف ٌؽٖ وؽ‬ٛ‫غ‬
5,(4 َ‫ٔثب‬
document.write(“hello”) // this will write “hello”
document.write(“dolly”) // this will write “dolly”
</script>
‫فصل دٍم ‪ :‬هتغیزّا در جاٍا اسکزیپت‬

‫آضٌایی تا هفاّین هتغییز ّا ٍدادُ‬
‫ٔشغییف‪ٞ‬ب ٔىب٘ی ؼـ ضبفظ‪ٞ ٝ‬ىش‪ٙ‬ؽ و‪ ٝ‬ثفای ٍ٘‪ٟ‬ؽاـی ‪ ٚ‬ؾغیف‪ٔ ٜ‬مبؼیف ا٘‪ٛ‬اع ٔػشّف ؼاؼ‪ٞ ٜ‬ب ٔ‪ٛ‬ـؼ اوشفبؼ‪ٜ‬‬
‫لفاـ ٔی ٌیف٘ؽ)‬
‫ٔشغییف ‪ٞ‬ب ا٘‪ٛ‬اع ٔػشّفی ؼاـ٘ؽ ‪ ٚ‬ؼـ اوثف قثب٘‪ٟ‬بی ثف٘بٔ‪ٛ٘ ٝ‬یىی ثبیؽ ‪ٞ‬ف ٘‪ٛ‬ع ؼاؼ‪ ٜ‬ـا ؼـ ٔشغییف آٖ ؼاؼ‪ٜ‬‬
‫اوشفبؼ‪ ٜ‬و‪ٙ‬یؽ ‪ ٚ‬لجُ اق سؼفیف ٔشغییف ثبیؽ ٘‪ٛ‬ع ٔشمییف ـا ٍٔػُ و‪ٙ‬یؽ أب ؼـ خب‪ٚ‬ا اوىفیذز ٌٕب ٘یبقی‬
‫٘ؽاـیؽ ٘‪ٛ‬ع ٔشمییف ـا ٍٔػُ و‪ٙ‬یؽ ثؼؽ اق ‪ٚ‬ـ‪ٚ‬ؼ ؼاؼ‪ ٜ‬غ‪ٛ‬ؼ خب‪ٚ‬ا اوىفیذز ٘‪ٛ‬ع ٔشغییف ـا ٍٔػُ ٔی و‪ٙ‬ؽ)‬
‫ًحَُ تؼزیف هتغییز در جاٍا اسکزیپت‬
‫ؼـ خب‪ٚ‬ا اوىفیذز ثفای سؼفیف ٔشغییف اق وّٕ‪ ٝ‬وّیؽی ‪ var‬و‪ٔ ٝ‬ػفف ( ‪ ) variable‬ث‪ٔ ٝ‬ؼ‪ٙ‬ی ٔشغییف‬
‫اوشفبؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ ‪ ٚ‬ثؼؽ اق ایٗ وّٕ‪٘ ٝ‬بٔی و‪ ٝ‬ثفای ٔشغییف ؼـ ٘ظف ٔی ٌیفیؽ ‪ ٚ‬وبـ سٍػیُ ٘‪ٛ‬ع ٔشغییف ث‪ٝ‬‬
‫ػ‪ٟ‬ؽ‪ٔ ٜ‬فىف خب‪ٚ‬ا اوىفیذز اوز)‬
‫;‪Var variablename‬‬
‫ٔثبَ ‪5-(,‬‬
‫;‪Var I‬‬
‫٘ىش‪ 5 ٝ‬اوشفبؼ‪ ٜ‬اق وّٕ‪ٔ var ٝ‬ف‪ٚ‬ـی ٘یىز ‪ ٚ‬ث‪ ٝ‬غ‪ٛ‬ا٘ب سف ٌؽٖ وؽ‪ٞ‬ب وٕه ٔی و‪ٙ‬ؽ)‬
‫هقذاردّی تِ هتغییزّا ‪:‬‬
‫;‪Var variblename = variablevalue‬‬
‫ٔثبَ ‪5-(-‬‬
‫;‪Var I = 10‬‬
‫;‪Var j = 12‬‬

‫اًَاع دادُ ّای اصلی در جاٍا اسکزیت ‪:‬‬
‫‪undefined‬‬
‫ٔشغیفی اوز و‪ ٝ‬سؼفیف ٔی ٌ‪ٛ‬ؼ ‪ِٚ‬ی ٔمؽاـؼ‪ٞ‬ی ا‪ِٚ‬ی‪ٕ٘ ٝ‬ی ٌ‪ٛ‬ؼ)‬
‫ٔثبَ ‪5-(.‬‬
‫;‪var test‬‬
‫‪Boolean‬‬
‫ایٗ ٘‪ٛ‬ع ٔی س‪ٛ‬ا٘ؽ ٔفبؼیف ٌف٘ی ـا ؼـ غ‪ٛ‬ؼ ؾغیف‪ ٜ‬و‪ٙ‬ؽ ٔب٘‪ٙ‬ؽ‪ true , false 5‬و‪ ٝ‬ؼـ ػّٕیبس‪ٟ‬بی ٌف٘ی‬
‫وبـثفؼ ؼاـؼ)‬
‫‪null‬‬
‫٘‪ َٛ‬ثؽیٗ ٔؼ‪ٙ‬بوز و‪ٔ ٝ‬شغییفٔفث‪ٞ ٝ٘ٛ‬ر ٔمؽاـی ٘ؽاـؼ) ثؽیٗ ٔؼ‪ٙ‬ب و‪ِ ٝ‬فف ‪ ٚ‬یب فٕبی غبِی ٘یىز '‬
‫ثّى‪ ٝ‬ؼـ ضمیمز ‪ٞ‬یر اوز)‬
‫ٔثبَ ‪5-(/‬‬
‫;‪var variablename = null‬‬
‫‪Character‬‬
‫ایٗ ٘‪ٛ‬ع فمٗ یه وبـوشف ـا ؼـ غ‪ٛ‬ؼ ؾغیف‪ٔ ٜ‬ی و‪ٙٙ‬ؽ ٔب٘‪ٙ‬ؽ‪…”E”,”X”'”&”'″/“ 5‬‬
‫‪number‬‬
‫ثفای ؾغیف‪ٔ ٜ‬فبؼیف ػؽؼ ِطیص ٔ‪ٛ‬ـؼ اوشفبؼ‪ ٜ‬لفاـ ٔی ٌیفؼ ٔب٘‪ٙ‬ؽ ‪…ٚ(30ٚ ,0 ٚ ,-. 5‬‬
‫هثال ‪:1-5‬‬
‫;‪Var variablename = number‬‬

5-(1 َ‫ٔثب‬
var paycheck=1200;
var phonebill=29.99;
var savings=0;
var sparetime=-24.5;
Float
…ٚ +٫34 ٚ -٫., ٚ .٫,/ 5 ‫ؽ‬ٙ٘‫ؽاـی اػؽاؼ اػٍبـی ٔب‬ٍٟ٘ ‫ع ثفای‬ٛ٘ ٗ‫ای‬
String
… ٚ ”hello world“ ٚ ”‫ “والْ ؼ٘یب‬5 ‫ؽ‬ٙ٘‫ؽ ٔب‬ٙٙ‫ ٔی و‬ٜ‫ؼ ؾغیف‬ٛ‫ ای ـا ؼـ غ‬ٝ‫ع ـٌش‬ٛ٘ ‫ع‬ٛ٘ ٗ‫ای‬
5-(2 َ‫ٔثب‬
Var variablename = “string text;
5-(2 َ‫ٔثب‬
var mycar="Corvette";
var oldcar="Big Brown Station Wagon";
var mycomputer="Pentium 3, 500 MHz, 128MB RAM";
var jibberish="what? cool! I am @ home 4 now. (cool, right?)";
‫قَاػذ ًام گذاری هتغییز ّا‬

‫ؼـ ٘بْ ٌؿاـی ٔشغییف ‪ٞ‬ب ثبیؽ ٘ىبر قیف ـا ـػبیز و‪ٙ‬یؽ‪5‬‬
‫‪٘ (,‬بْ ٔشغییف ٕ٘ی س‪ٛ‬ا٘ؽ ثب ـلٓ ٌف‪ٚ‬ع ٌ‪ٛ‬ؼ‬
‫‪٘ (-‬بْ ٔشغییف ٕ٘ی س‪ٛ‬ا٘ؽ ٌبُٔ فبِّ‪ ٚ ٝ‬یب ٘م‪ٌ ٝٙ‬ؿاـی ثبٌؽ‬
‫‪٘ (.‬بْ ٔشغییف ٔی س‪ٛ‬ا٘ؽ ثب ضف‪ٚ‬ف ‪ ٚ‬ػالٔز “_” ٌف‪ٚ‬ع ٌ‪ٛ‬ؼ‬
‫‪ (/‬اق وّٕبر ـقـ‪ٌ ٚ‬ؽ‪ٕ٘ ٜ‬ی س‪ٛ‬اٖ اوشفبؼ‪ ٜ‬وفؼ‬
‫‪ (0‬خب‪ٚ‬ا اوىفیذز ث‪ ٝ‬ثكـٌی ‪ ٚ‬و‪ٛ‬زىی ضف‪ٚ‬ف ضىبن اوز ث‪ ٝ‬ػ‪ٛٙ‬اٖ ٔثبَ ‪ url :‬ثب ‪ Url‬ثب ‪ URL‬یىی‬
‫٘یىز ‪ٔ ٚ‬ی س‪ٛ‬اٖ ٘بْ و‪ٔ ٝ‬شغییف خؽا اق ‪ ٓٞ‬ثبٌؽ)‬
‫ٔثبَ ‪5-(3‬‬
‫ٕ٘‪ٞ ٝ٘ٛ‬بیی ٘بْ ‪ٞ‬بی غیف‪ٔ ٜ‬دبق‪5‬‬
‫‪#paycheck‬‬
‫‪1paycheck‬‬
‫‪pay check‬‬
‫‪pay_check 2‬‬
‫‪_pay check‬‬
‫ٔثبَ ‪5-(4‬‬
‫ٕ٘‪ٞ ٝ٘ٛ‬بیی اق ٘بْ ‪ٞ‬بی ٔدبق ‪5‬‬
‫‪paycheck‬‬
‫‪_paycheck‬‬
‫‪pay2check‬‬
‫‪pay_check‬‬
‫‪pay_245‬‬

‫آضٌایی تا کلوات رسرٍ ضذُ‬

‫ؼـ سٕبٔی قثبٖ ‪ٞ‬بی ثف٘بٔ‪ٛ٘ ٝ‬یىی وّٕبسی ‪ٚ‬خ‪ٛ‬ؼ ؼاـؼ و‪ٛٔ ٝ‬ـؼ اوشفبؼ‪ ٜ‬غ‪ٛ‬ؼ وبٔذبیّف ‪ٔ ٚ‬فىف آٖ قثبٖ ٔی‬
‫ثبٌؽ ‪ ٚ‬اق فجُ سؼفیف ٌؽ‪ٞ ٜ‬ىش‪ٙ‬ؽ ‪ ٚ‬ایٗ أف ؼـ قثبٖ خب‪ٚ‬ا اوىفیذز ٘جك ٔىشث‪ٙ‬ی ٘ج‪ٛ‬ؼ‪ٌٕ ٚ ٜ‬ب ٕ٘ی س‪ٛ‬ا٘یؽ اق‬
‫ایٗ وّٕبر ؼـ ٘بْ ٌكاـی ٔشغییف ‪ٞ‬ب ‪ ٚ‬س‪ٛ‬اثغ اوشفبؼ‪ ٜ‬و‪ٙ‬یؽ)‬
‫‪abstract‬‬ ‫‪delete‬‬ ‫‪Goto‬‬ ‫‪Null‬‬ ‫‪Throws‬‬

‫‪As‬‬ ‫‪Do‬‬ ‫‪If‬‬ ‫‪Pakage‬‬ ‫‪Transient‬‬
‫‪Boolean‬‬ ‫‪Double‬‬ ‫‪Implements‬‬ ‫‪Pivate‬‬ ‫‪Try‬‬
‫‪Break‬‬ ‫‪Else‬‬ ‫‪Import‬‬ ‫‪Protected‬‬ ‫‪True‬‬
‫‪Byte‬‬ ‫‪Enum‬‬ ‫‪In‬‬ ‫‪Public‬‬ ‫‪typeof‬‬
‫‪Case‬‬ ‫‪Export‬‬ ‫‪Instanceof‬‬ ‫‪Return‬‬ ‫‪Use‬‬
‫‪Catch‬‬ ‫‪Extends‬‬ ‫‪Int‬‬ ‫‪Short‬‬ ‫‪Var‬‬
‫‪Char‬‬ ‫‪False‬‬ ‫‪Interface‬‬ ‫‪Static‬‬ ‫‪Void‬‬
‫‪Class‬‬ ‫‪Final‬‬ ‫‪Is‬‬ ‫‪Super‬‬ ‫‪Volatile‬‬
‫‪Const‬‬ ‫‪Finally‬‬ ‫‪Long‬‬ ‫‪Switch‬‬ ‫‪While‬‬
‫‪Continue‬‬ ‫‪Float‬‬ ‫‪Namespace‬‬ ‫‪Synchronized‬‬ ‫‪With‬‬
‫‪Debugger‬‬ ‫‪For‬‬ ‫‪Native‬‬ ‫‪This‬‬
‫‪default‬‬ ‫‪Function‬‬ ‫‪New‬‬ ‫‪Throw‬‬
‫هتغییز ّای هحلی ٍ سزاسزی‬

‫ٔشغییفی و‪ ٝ‬ؼـ ؼاغُ یه سبثغ خب‪ٚ‬ا اوىفیذز سؼفیف ٌ‪ٛ‬ؼ ٔطّی (‪ )Local‬اوز ‪ٔ ٚ‬فؽاـ آٖ لفٗ ؼـ‬
‫ؼـ‪ ٖٚ‬آٖ سبثغ ؼـ ؼوشفن اوز ؼـ اِ‪ٙ‬الش ٔی ٌ‪ٛ‬ییٓ سبثغ ‪ٔ scope‬طّی ؼاـؼ)‬
‫ًکتِ‪ٔ :‬شغییف ‪ٞ‬بی ٔطّی ثؼؽ اق غف‪ٚ‬ج اق سبثغ اقثیٗ ٔی ـ‪ٚ‬ؼ)‬
‫ٔشغییفی و‪ ٝ‬ؼـ ثیف‪ ٖٚ‬س‪ٛ‬اثغ سؼفیف ٌ‪ٛ‬ؼ ٔشغییف وفاوفی (‪ٔ )Global‬ی ثبٌ‪ٙ‬ؽ ‪ ٚ‬سٕبْ اوىفیذش‪ٟ‬ب ‪ ٚ‬س‪ٛ‬اثغ‬
‫ؼـ‪ِ ٖٚ‬فط‪ ٝ‬ث‪ ٝ‬آٖ ؼوشفوی ؼاـ٘ؽ)‬
‫٘ىش‪ٔ 5ٝ‬شغییف ٔطّی ثؼؽ اق ثىش‪ٌ ٝ‬ؽٖ ِفط‪ ٝ‬اق ثیٗ ٔی ـ‪ٚ‬ؼ)‬
‫سهاى حیات هتغیزّای جاٍااسکزیپت‬
‫اٌف ٌٕب ٔشغیفی ـا سؼفیف و‪ٙ‬یؽ ‪ ٚ‬اق وّٕ‪ ”var“ ٝ‬ؼـ یه سبثغ اوشفبؼ‪ ٜ‬و‪ٙ‬یؽ آٖ ٔشغیف فمٗ ؼاغُ ‪ٕٞ‬بٖ‬
‫سبثغ ؼـ ؼوشفن اوز) ‪ٚ‬لشی ٌٕب اق یه سبثغ غبـج ٌ‪ٛ‬یؽ آٖ ٔشغیف اق ثیٗ ٔی ـ‪ٚ‬ؼ) ایٗ ٔشغیف‪ٞ‬ب ٔشغیف‪ٞ‬بی‬
‫ٔطّی ٘بٔیؽ‪ٔ ٜ‬یٍ‪٘ٛ‬ؽ) ٌٕب ٔی س‪ٛ‬ا٘یؽ ٔشغیف‪ٞ‬بی ٔطّی ‪٘ ٓٞ‬بٔی ـا ؼـ س‪ٛ‬اثغ ٔػشّف اوشفبؼ‪ ٜ‬و‪ٙ‬یؽ قیفا ایٗ‬
‫ٔشغیف‪ٞ‬ب فمٗ ؼـ ‪ٕٞ‬بٖ س‪ٛ‬اثؼی و‪ ٝ‬سؼفیف ٌؽ‪ ٜ‬ا٘ؽ لبثُ ٌ‪ٙ‬بوبیی ‪ٞ‬ىش‪ٙ‬ؽ)‬

‫اٌف ٌٕب ٔشغیفی ـا غبـج یه سبثغ سؼفیف و‪ٙ‬یؽ آٖ ٔشغیف ؼـ وُ ِفط‪ ٝ‬سبٖ ؼـ ؼوشفن غ‪ٛ‬ا‪ٞ‬ؽ ث‪ٛ‬ؼ) ایٗ‬
‫ٔشغیف‪ٞ‬ب قٔب٘ی و‪ ٝ‬سؼفیف ٔی ٌ‪٘ٛ‬ؽ ٌف‪ٚ‬ع ٌؽ‪ٚ ٚ ٜ‬لشی و‪ِ ٝ‬فط‪ ٝ‬ـا ٔی ث‪ٙ‬ؽیؽ دبیبٖ ٔی یبث‪ٙ‬ؽ)‬
‫چگًَگی صذا کزدى یک هتغیز‬
‫ؼـ ل‪ٙ‬ؼ‪ ٝ‬وؽ قیف ٌٕب ٘ط‪ِ ٜٛ‬ؽا وفؼٖ یه ٔشغیف ث‪ٚ ٝ‬ویّ‪ ٝ‬سبثغ ‪ document.write‬ـا غ‪ٛ‬ا‪ٞ‬یؽ‬
‫آٔ‪ٛ‬غز)‬
‫ٔثبَ ‪5-(,+‬‬
‫>"‪<script language="JavaScript‬‬
‫;"‪var mycar="Corvette‬‬
‫;)‪document.write(mycar‬‬
‫ٌٕب ٔی‪ٛ‬ا٘یؽ ل‪ٙ‬ؼ‪ ٝ‬وؽ ثبال ـا ث‪ِٛ ٝ‬ـس‪ٟ‬بیی و‪ ٝ‬ؼـ ٔجبضث لجُ ٌفش‪ٌ ٝ‬ؽ ؼـ و‪ٙ‬ؽ ‪ html‬غ‪ٛ‬ؼ ثىبـ ثفؼ‪ٚ ٜ‬‬
‫اخفا ٕ٘بییؽ)‬
‫‪ ٚ‬أب ٘فق وبـ آٖ‪5‬‬
‫فبـؽ اق سٍ‪ٟ‬بی ‪ script‬ؼـ اثشؽا ٔب ٔمؽاـ ‪ corvette‬ـا ث‪ٔ ٝ‬شغیف ‪٘ mycar‬ىجز ٔیؽ‪ٞ‬یٓ ' وذه ث‪ٝ‬‬
‫‪ٚ‬ویّ‪ ٝ‬سبثغ )(‪ٔ document.write‬شغیف ‪ mycar‬ـا ففاغ‪ٛ‬ا٘ی ٔی و‪ٙ‬یٓ و‪ ٝ‬ؼـ اُِ ٔمؽاـ آٖ یؼ‪ٙ‬ی‬
‫‪ corvette‬ـا ثفای ٔب ٕ٘بیً ٔی ؼ‪ٞ‬ؽ)‬
‫ٔثبَ ‪5-(,,‬‬
‫>"‪<script type="text/javascript‬‬
‫;"‪var mycar="Corvette‬‬
‫;)‪document.write("I like driving my "+mycar‬‬
‫٘شید‪5 ٝ‬‬
‫‪I like driving my Corvette.‬‬

‫ ٔمؽاـٔشغیف‬ٚ I like driving my ‫ لىٕز‬ٚ‫٘ؽ ؼاؼٖ ؼ‬ٛ‫" ثفای دی‬+" ‫ اق ػٍّٕف‬ٜ‫ ٔثبَ ثبال اوشفبؼ‬ٝ‫ب ٘ىش‬ٟٙ‫س‬
)‫ؽ ٌؽ‬ٞ‫ا‬ٛ‫ غ‬ٜ‫ٔیص ؼاؼ‬ٛ‫ـؼ آٖ س‬ٛٔ ‫ ؼـ ٔجبضث ثؼؽ ؼـ‬ٝ‫ ٔی ثبٌؽ و‬corvette ‫ی‬ٙ‫ یؼ‬mycar
5-(,- َ‫ٔثب‬
<script type="text/javascript">
document.write("I like driving my "+mycar+" every day!");
</script>
5 ٝ‫٘شید‬
I like driving my Corvette every day!
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ـر ٕ٘بیً ؼاؼ‬ِٛ ٖ‫ٕب‬ٞ ٝ‫سیٍٗ" ٔی آیؽ ؼلیمب ث‬ٛ‫ػالٔز" و‬ٚ‫ ثجٗ ؼ‬ٝ‫ زیكی و‬ٝ‫یؽ و‬ٙ‫ؼلز و‬
5 ‫یؽ‬ٙ‫ و‬ٝ‫خ‬ٛ‫ع س‬ٛٔٛٔ ٗ‫ ثب ای‬ٝٙ‫ ٔثبَ قیف ؼـ ـاث‬ٝ‫ث‬
5-(,. َ‫ٔثب‬
document.write("I like driving my +mycar+ every day!");
</script>
5ٝ‫٘شید‬
I like driving my +mycar+ every day!
‫ثاتت ّا‬
‫ب ؼـ ایٗ اوز‬ٞ ‫ب ثب ٔشغییف‬ٞ ‫ر ثبثز‬ٚ‫ؽ)سفب‬ٙٙ‫ سؼفیف ٔی و‬Const ‫ وّیؽی‬ّٕٝ‫ اق و‬ٜ‫ب ـا ثب اوشفبؼ‬ٞ ‫ثبثز‬
‫اٖ ایٗ ٔمؽاـ ـا سغییف‬ٛ‫ ؼـخبیی ؼیٍف ٕ٘ی س‬ٚ #‫یه ٔفؽاـ ثبثز‬$ ‫ؽ فمٗ یه ٔمؽاـ ثٍیف٘ؽ‬ٙ٘‫ا‬ٛ‫ب ٔی س‬ٞ ‫ ثبثز‬ٝ‫و‬
‫ؼاؼ )یفای ٔثبَ ؼـ یه ثف٘بٔ‪ ٝ‬ثفای ثؽوز آ‪ٚ‬ـؼٖ ٔىبضز ؼایف‪ ٜ‬ث‪ ٝ‬ػؽؼ ‪٘ .٫,/‬یبق ؼاـیٓ ‪ ٚ‬ایٗ ػؽؼ ‪ٕٛٞ‬اـ‪ٜ‬‬
‫ثبثز اوز ‪ ٚ‬ؼـ ٘‪ َٛ‬ثف٘بٔ‪ٔ ٝ‬مؽاـ ‪ p‬فبثُ سغییف ٘یىز)‬
‫ٔثبَ ‪5-(,/‬‬
‫;‪const p = 3.14‬‬
‫تثذیل اًَاع در جاٍا اسکزیپت‬
‫خب‪ٚ‬ا اوىفیذز ٘یك ٔب٘‪ٙ‬ؽ اوثف قثب٘‪ٟ‬بی ثف٘بٔ‪ٛ٘ ٝ‬یىی اق لبثّیز سجؽیُ ا٘‪ٛ‬اع ثفغ‪ٛ‬ـؼاـ اوز ‪ ٚ‬ـ‪ٌٟٚ‬بی‬
‫وبؼ‪ ٜ‬ای ـا ثفای اوشفبؼ‪ ٜ‬اق ایٗ لبثّیز ففا‪ ٓٞ‬آ‪ٚ‬ـؼ‪ ٜ‬اوز)‬
‫تثذیل تِ رضتِ‬
‫و‪ٛ٘ ٝ‬ع ؼاؼ‪ٔ boolean , number & string ٜ‬شؽی ث‪٘ ٝ‬بْ ) (‪ .tostring‬ثفای سجؽیُ ث‪ ٝ‬ـٌش‪ٝ‬‬
‫ؼاـ٘ؽ)‬
‫ایٗ ٔشؽ ثفای ٔشغیف‪ٞ‬بی اق ٘‪ٛ‬ع ‪ boolean‬یىی اق ٔمبیف ـٌش‪ ٝ‬ای ‪ true‬یب ‪ false‬ـا ثىش‪ ٝ‬ث‪ٔ ٝ‬مؽاـ ٔشغیف‬
‫ثفٔی ٌفؼا٘ؽ‪5‬‬
‫ٔثبَ ‪5-(,0‬‬
‫;‪var bFound = true‬‬

‫;))(‪alert(bFound.toString‬‬ ‫”‪//outputs “true‬‬
‫ایٗ ٔشؽ ثفای ٔشغیف‪ٞ‬بی اق ٘‪ٛ‬ع ‪ number‬ـٌش‪ ٝ‬ای ضب‪ٚ‬ی آٖ ػؽؼ ـا ثف ٔی ٌفؼا٘ؽ‪5‬‬
‫ٔثبَ ‪5-(,1‬‬
‫;‪var iNum1 = 12‬‬

‫;‪var fNum2 = 17.0‬‬
‫;))(‪alert(iNum1.toString‬‬ ‫”‪//outputs “12‬‬
‫;))(‪alert(fNum2.toString‬‬ ‫”‪//outputs “17‬‬

‫تثذیل تِ ػذد‬
‫خب‪ٚ‬ااوىفیذز ؼ‪ٔ ٚ‬شؽ ثفای سجؽیُ ا٘‪ٛ‬اع غیف ػؽؼی ث‪ ٝ‬ػؽؼی ففا‪ ٓٞ‬وفؼ‪ ٜ‬اوز‪:‬‬
‫) (‪parseInt‬‬
‫) (‪parseFloat‬‬
‫ایٗ ٔشؽ ‪ٞ‬ب فمٗ ثف ـ‪ٚ‬ی ـٌش‪ٞ ٝ‬بی ضب‪ٚ‬ی ػؽؼ وبـ ٔی و‪ٙٙ‬ؽ ‪ ٚ‬ثف ـ‪ٚ‬ی ثمی‪ ٝ‬ا٘‪ٛ‬اع ٔمؽاـ ‪ NaN‬ـا ثفٔی‬
‫ٌفؼا٘‪ٙ‬ؽ)‬
‫هتذ ) (‪parseInt‬‬
‫اق ا‪ِٚ‬یٗ وبـاوشف ـٌش‪ٌ ٝ‬ف‪ٚ‬ع ٔی و‪ٙ‬ؽ اٌف ػؽؼ ث‪ٛ‬ؼ آٖ ـا ثف ٔی ٌفؼا٘ؽ ؼـ غیف ایٗ ِ‪ٛ‬ـر ٔمؽاـ‬
‫‪ NaN‬ـا ثفٔی ٌفؼا٘ؽ ایٗ ـ‪٘ٚ‬ؽ سب آغفیٗ وبـاوشف اؼأ‪ ٝ‬دیؽا ٔیى‪ٙ‬ؽ سب ای‪ٙ‬ى‪ ٝ‬ث‪ ٝ‬وبـاوشفی غیف ػؽؼی ثفوؽ ‪.‬‬
‫ث‪ ٝ‬ػ‪ٛٙ‬اٖ ٔثبَ ایٗ ٔشؽ ػجبـر "‪”123red‬ـا ث‪ِٛ ٝ‬ـر ‪ 123‬ثفٔی ٌفؼا٘ؽ)‬
‫ٔثبَ ‪5-(,2‬‬
‫;)”‪var iNum1 = parseInt(“1234blue‬‬ ‫‪//returns 1234‬‬

‫;)"‪var iNum3 = parseInt("22.5‬‬ ‫‪//returns 22‬‬
‫;)"‪var iNum4 = parseInt("blue‬‬ ‫‪//returns NaN‬‬
‫هتذ )(‪parseFloat‬‬
‫ٔثُ ٔشؽ )(‪ parseInt‬ػُٕ وفؼ‪ ٚ ٜ‬اق ا‪ِٚ‬یٗ وبـاوشف ٌف‪ٚ‬ع ث‪ ٝ‬خىز ‪ ٚ‬خ‪ٔ ٛ‬ی و‪ٙ‬ؽ اِجش‪ ٝ‬ؼـ ایٗ ٔشؽ ا‪ٚ‬ایٗ‬
‫وبـاوشف ٘م‪ ٝٙ‬ضىبة ٕ٘ی ٌ‪ٛ‬ؼ ‪ ٚ‬آٖ ـا ث‪ٕٞ ٝ‬بٖ ِ‪ٛ‬ـر ثفٔی ٌفؼا٘ؽ)‬
‫اٌف ؼ‪ ٚ‬وبـاوشف ٘م‪ ٝٙ‬ؼـ ـٌش‪ٚ ٝ‬خ‪ٛ‬ؼ ؼاٌش‪ ٝ‬ثبٌ‪ٙ‬ؽ ؼ‪ٔٚ‬یٗ ٘م‪ ٝٙ‬ث‪ ٝ‬ػ‪ٛٙ‬اٖ وبـاوشف ثی اـقي ٌ‪ٙ‬بغش‪ٔ ٝ‬ی ٌ‪ٛ‬ؼ ‪ٚ‬‬
‫ػّٕیبر سجؽیُ ٔش‪ٛ‬لف ٔی ٌ‪ٛ‬ؼ‬
‫ٔثبَ ‪:-( ,3‬‬
‫;)”‪var fNum1 = parseFloat(“1234blue‬‬ ‫‪//returns 1234.0‬‬

‫;)”‪var fNum3 = parseFloat(“22.5‬‬ ‫‪//returns 22.5‬‬
‫;)”‪var fNum4 = parseFloat(“22.34.5‬‬ ‫‪//returns 22.34‬‬

‫;)”‪var fNum6 = parseFloat(“blue‬‬ ‫‪//returns NaN‬‬
‫استفادُ اس ‪ Type Casting‬تزای تثذیل اًَاع‬
‫ؼـ خب‪ٚ‬ااوىفیذز أىبٖ اوشفبؼ‪ ٜ‬اق ـ‪ٌٚ‬ی ٔ‪ٛ‬و‪ ْٛ‬ث‪ Type Casting ٝ‬ثفای سجؽیُ ا٘‪ٛ‬اع ‪ٚ‬خ‪ٛ‬ؼ ؼاـؼ) و‪ٛ٘ ٝ‬ع‬
‫‪ type casting‬ؼـ خب‪ٚ‬ااوىفیذز ‪ٚ‬خ‪ٛ‬ؼ ؼاـؼ‪:‬‬
‫)( ‪ Boolean‬‬
‫)( ‪ Number‬‬
‫)( ‪ String‬‬
‫سبثغ )(‪ Boolean‬قٔب٘ی ٔمؽاـ ‪ true‬ـا ثف ٔی ٌفؼا٘ؽ و‪ ٝ‬دبـأشف ؼـیبفشی اي‪ ،‬ـٌش‪ ٝ‬ای ٌبُٔ ضؽالُ‬
‫یه وبـوشف‪ ،‬یه ػؽؼ غیف اق ِفف ‪ ٚ‬یب یه ٌی ثبٌؽ ‪ٔ.‬مؽاـ‪ false‬ـا ٘یك قٔب٘ی ثف ٔی ٌفؼا٘ؽ و‪ ٝ‬دبـأشف‬
‫ؼـیبفشی اي ـٌش‪ ٝ‬ای س‪ٟ‬ی‪ ،‬ػؽؼ ِفف یب یىی اق ٔمبؼیف ‪ null ٚ undefined‬ثبٌؽ‪5‬‬
‫ٔثبَ ‪5-(,4‬‬
‫‪var b1‬‬ ‫;)”“(‪= Boolean‬‬ ‫‪//false – empty‬‬

‫‪string‬‬
‫‪var b2‬‬ ‫;)”‪= Boolean(“hi‬‬ ‫‪//true – non-empty‬‬
‫‪string‬‬
‫‪var b3‬‬ ‫;)‪= Boolean(100‬‬ ‫‪//true – non-zero‬‬
‫‪number‬‬
‫‪var b4‬‬ ‫;)‪= Boolean(null‬‬ ‫‪//false - null‬‬
‫‪var b5‬‬ ‫;)‪= Boolean(0‬‬ ‫‪//false - zero‬‬
‫‪var b6‬‬ ‫;))(‪= Boolean(new Object‬‬ ‫‪//true – object‬‬
‫سبثغ )(‪ Number‬وبـی ٌجی‪ parseFloat() ٚ parseInt() ٝ‬ـا ا٘دبْ ٔی ؼ‪ٞ‬ؽ أب سفب‪ٚ‬ر ‪ٞ‬بیی ‪ٓٞ‬‬
‫ؼاـؼ‪.‬‬
‫اٌف ث‪ ٝ‬یبؼ ؼاٌش‪ ٝ‬ثبٌیؽ ٔشؽ‪ٞ‬بی )(‪ parseFloat() ٚ parseInt‬آـٌ‪ٔٛ‬بٖ ؼـیبفشی ـا فمٗ سب ا‪ِٚ‬یٗ‬
‫وبـاوشف ثی اـقي ثف ٔی ٌفؼا٘ؽ ٔثال ـٌش‪ ” 4.5.6 “ ٝ‬ث‪ 4.5 ٝ‬سجؽیُ غ‪ٛ‬ا‪ٙٞ‬ؽ وفؼ‪ .‬أب وبـثفؼ ٔشؽ‬
‫)(‪ Number‬ثفای ایٗ ـٌش‪ٔ ٝ‬مؽاـ ‪ NaN‬ـا ثفٔی ٌفؼا٘ؽ قیفا ایٗ ـٌش‪ ٝ‬ؼـ وُ‪ ،‬اق ٘ظف ٔشؽ )(‪Number‬‬
‫أىبٖ سجؽیُ ث‪ ٝ‬یه ػؽؼ ـا ٘ؽاـؼ‪.‬‬

‫ اق یىی اق‬ٜ‫ ثفای اوشفبؼ‬،‫ؼ‬ٛ‫ غ‬Number() ‫ ثبٌؽ ٔشؽ‬ٝ‫ یه ػؽؼ ـا ؼاٌش‬ٝ‫ ای أىبٖ سجؽیُ ث‬ٝ‫اٌف ـٌش‬
‫ ثفای‬Number() ‫ؼـ ٔثبَ قیف ضبُِ اخفای سبثغ‬. ‫ سّٕیٓ ٔی ٌیفؼ‬parseFloat() ‫ یب‬parseInt() ‫اثغ‬ٛ‫س‬
:‫ؽ‬ٞ‫ب ـا ٍ٘بٖ ٔی ؼ‬ٞ ٜ‫اع ؼاؼ‬ٛ٘‫ا‬
5-(-+ َ‫ٔثب‬
Number(false) 0
Number(true) 1
Number(undefined) NaN
Number(null) 0
Number(“5.5”) 5.5
Number(“56”) 56
Number(“5.6.7”) NaN
Number(new Object()) NaN
Number(100) 100
:‫ ثف ٔی ٌفؼا٘ؽ‬ٝ‫اٖ ـٌش‬ٛٙ‫ ػ‬ٝ‫ ٔی ٌیفؼ ث‬ٝ‫ٕبٖ زیكی ـا و‬ٞ ٝ‫ اوز و‬String() ٓٞ ‫ سفیٗ سبثغ‬ٜ‫وبؼ‬
5-(-, َ‫ٔثب‬
var s1 = String(null); // ”null”
‫ تَاتغ‬: ‫فصل سَم‬
‫استفادُ اس تَاتغ در جاٍا اسکزیپت‬
‫یه سبثغ یه اوىفیذز دبی‪ ٝ‬اوز ؼـ ؼـ‪ ٖٚ‬اوىفیذز ثكـٌشف)و‪ٚ ٝ‬ظیف‪ ٝ‬آٖ ا٘دبْ وبـ یب ٔدٕ‪ٛ‬ػ‪ ٝ‬ای اق‬
‫وبـ‪ٞ‬ب اوز و‪ ٝ‬ث‪ ٝ‬آٖ ٔط‪ٔ َٛ‬ی ٌ‪ٛ‬ؼ ثفای ٔثبَ ٕٔىٗ اوز ‪ٚ‬ظیف‪ٌٛ٘ ٝ‬شٗ یه غٗ ؼـ ٔف‪ٚ‬ـٌف یب ٔطبوج‪ٝ‬‬
‫یه ففٔ‪ ٚ َٛ‬یب غیف‪ ٜ‬ـا ؼاٌش‪ ٝ‬ثبٌؽ و‪ ٝ‬ؼـ ٘‪ٟ‬بیز ٘شید‪ ٝ‬ـا ث‪ ٝ‬اوىفیذز اِّی ثف ٔی ٌفؼا٘ؽ)‬
‫سبثغ ٔدٕ‪ٛ‬ػ‪ ٝ‬ؼوش‪ٛ‬ـاسی اوز و‪ ٝ‬س‪ٟٙ‬ب ؼـ ِ‪ٛ‬ـر ـظ ؼاؼٖ یه ـ‪ٚ‬یؽاؼ ‪ ٚ‬یب اق ٘فیك ففاغ‪ٛ‬ا٘ی اخفا ٔی‬
‫ٌ‪٘ٛ‬ؽ) ٌٕب ٔی س‪ٛ‬ا٘یؽ ‪ٞ‬ف سبثغ ـا اق ‪ٞ‬ف خبیی ؼـ ِفط‪ ٝ‬ففاغ‪ٛ‬ا٘ی و‪ٙ‬یؽ ‪$‬یب ضشی اق ِفط‪ٞ ٝ‬بی ؼیٍف ؼـ‬
‫ِ‪ٛ‬ـسی و‪ ٝ‬س‪ٛ‬اثغ ـا ؼـ یه فبیُ ‪ )js‬غبـخی ؾغیف‪ ٜ‬وفؼ‪ ٜ‬ثبٌیؽ)‪#‬‬
‫چزا تَاتغ هَرد استفادُ قزار هی گیزًذ‪:‬‬
‫اِّی سفیٗ ؼِیُ ثفای اوشفبؼ‪ ٜ‬اق س‪ٛ‬اثغ' ا٘ؼ‪ٙ‬بف دؿیفی ‪ ٚ‬لؽـسی اوز و‪ ٝ‬ؼـ ٘‪ٌٛ‬شٗ وؽ‪ٞ‬ب ث‪ ٝ‬ثف٘بٔ‪ٛ٘ ٝ‬یه‬
‫ٔی ؼ‪ٞ‬ؽ سب ثش‪ٛ‬ا٘ؽ وؽ‪ٞ‬ب ‪ ٚ‬ثف٘بٔ‪ ٝ‬غ‪ٛ‬ؼ ـا ث‪ٟ‬شف ٔؽیفیز و‪ٙ‬ؽ ‪ٕٞ ٚ‬س‪ٙ‬یٗ غ‪ٙ‬بیبثی ـا ث‪ٟ‬شف ‪ ٚ‬وفیؼشف ا٘دبْ ؼ‪ٞ‬ؽ)‬
‫ساختار تَاتغ ‪:‬‬
‫ؼـ غٗ ا‪ َٚ‬اق وبغشبـ یه سبثغ ٌٕب ثبیؽ یه اوٓ ثفای آٖ ا٘شػبة وفؼ‪ ٚ ٜ‬آٖ ـا ث‪ ٝ‬ثف٘بٔ‪ ٝ‬غ‪ٛ‬ؼ ثٍ‪ٙ‬بوب٘یؽ‬
‫ٔب٘‪ٙ‬ؽ ‪5‬‬
‫{)(‪function functionname‬‬
‫}‬
‫ٔثبَ ‪5.(,‬‬
‫{)(‪function reallycool‬‬
‫}‬

: ‫قزاردادى کذّا در درٍى تاتغ‬
function functionname(){
javascript code here
}
5.(- َ‫ٔثب‬
function reallycool(){
a = 5; var b =3;
var c = 8; }
5.(. َ‫ٔثب‬
<head>
<title>Untitled Document</title>
function dismsg()
{
alert("hello");
}
</script>
</head>
<body>
<form>
<input type="button" value="test" onclick="dismsg()" />
</form>
</body>
</html>
‫لشی اخفا ٔی‬ٚ dismsg)( ‫ؼ) سبثغ‬ٌٛ ‫ؽ اخفا ٕ٘ی‬ٙ‫ وّیه و‬ٕٝ‫ی ؼو‬ٚ‫ وبـثف ـ‬ٝ‫ى‬ٙ‫ـ لجُ اق ای‬ٛ‫ایٗ ؼوش‬
)‫ؽ‬ٙ‫ وّیه و‬ٕٝ‫ی ؼو‬ٚ‫ وبـثف ـ‬ٝ‫ؼ و‬ٌٛ
‫ًام گذاری تَاتغ ‪:‬‬
‫ثفای ٘بْ ٌؿاـی س‪ٛ‬اثغ ثبیؽ اق ؼوش‪ٛ‬ـار ‪ ٚ‬ل‪ٛ‬ا٘ی‪ٙ‬ی دیف‪ٚ‬ی و‪ٙ‬یؽ اق خّٕ‪ ٝ‬ای‪ٙ‬ى‪5 ٝ‬‬
‫وؼی و‪ٙ‬یؽ ٘بْ سبثغ ثب وبـی و‪ ٝ‬ا٘دبْ ٔی ؼ‪ٞ‬ؽ ‪ٕٞ‬ػ‪ٛ‬ا٘ی ‪ٕٞ ٚ‬ب‪ٍٙٞ‬ی ؼاٌش‪ ٝ‬ثبٌؽ)‬ ‫‪‬‬
‫٘بْ س‪ٛ‬اثغ ضشٕب ثبیؽ ثب ضف‪ٚ‬ف ‪ ٚ‬یب ػالٔز"_" آغبق ٌ‪ٛ‬ؼ)‬ ‫‪‬‬
‫٘بْ س‪ٛ‬اثغ ٕ٘ی س‪ٛ‬ا٘ؽ ٌبُٔ ‪ٞ‬فٌ‪ ٝ٘ٛ‬فٕبی غبِی ثبٌؽ)‬ ‫‪‬‬
‫ٔثبَ ‪5.(/‬‬
‫سبثغ قیف ثفای زبح ‪ٕ٘ ٚ‬بیً یه ٔشٗ ٘‪ٌٛ‬ش‪ٌ ٝ‬ؽ‪ ٜ‬اوز ‪5‬‬
‫{ )(‪function print_strong_text‬‬
‫‪document.write("<strong>This is a strong‬‬
‫;)">‪statement!</strong‬‬
‫}‬
‫‪ٕٞ‬بٍ٘‪ ٝ٘ٛ‬و‪ٍٔ ٝ‬ب‪ٞ‬ؽ‪ٔ ٜ‬ی و‪ٙ‬یؽ ؼـ ٘‪ٌٛ‬شٗ ٘بْ سبثغ اق ‪ٞ‬ف و‪ ٝ‬ؼوش‪ٛ‬ـ ثبال دیف‪ٚ‬ی ‪ ٚ‬سجؼیز ٌؽ‪ ٜ‬اوز)‬
‫اضافِ کزدى پاراهتز تِ تَاتغ ‪:‬‬
‫دبـأشف‪ٞ‬ب اوشفبؼ‪ٔ ٜ‬ی ٌ‪٘ٛ‬ؽ سب ث‪ ٝ‬س‪ٛ‬اثغ ایٗ لبثّیز ـا ثؽ‪ٙٞ‬ؽ و‪ ٝ‬یه یب ز‪ٙ‬ؽ ٔمؽاـ ـا اق خبیی اق غبـج سبثغ‬
‫‪ٚ‬اـؼ و‪ٙٙ‬ؽ )‬
‫)‪function functionname(variable1,variable2‬‬
‫ٔثبَ ‪5.(0‬‬
‫{ )‪function reallycool(coolcar,coolplace‬‬
‫‪JavaScript code here‬‬
‫}‬

5.(1 َ‫ٔثب‬
function reallycool(coolcar,coolplace) {
document.write("My car is a "+coolcar+" and I drive it to
"+coolplace);
}
ٝ‫ و‬ٝ‫ ثبٌؽ آ٘س‬Las Vegas ‫ ثفاثف‬coolplace ‫ ٔمؽاـ‬Corvette ‫ ثفاثف ثب‬coolcar ‫ضبَ اٌف ٔمؽاـ‬
5‫ؼ‬ٛ‫ؽ ث‬ٞ‫ا‬ٛ‫ؼ غٗ قیف غ‬ٌٛ ‫ ٔی‬ٜ‫ـٌف ٌٕب ٕ٘بیً ؼاؼ‬ٚ‫ؼـ ٔف‬
My car is a Corvette and I drive it to Las Vegas
.(2 َ‫ٔثب‬
<head>
function test(a , b)
{
return a*b;
}
</script>
</head>
<body>
document.write(test(5,2));
</script>
</body>
</html>
ٗ‫ ؼـ غ‬ٚ ٓ‫ آٖ اغشّبَ ؼاؼی‬ٝ‫ ـا ث‬a,b ‫ ٔشغیف‬ٚ‫ ؼـ ؼاغُ دفا٘شك ؼ‬ٚ ٓ‫ؼـ ٔثبَ ثبال سبثغ سىز ـا لفاـ ؼاؼی‬
ٝ‫ ث‬body ‫ ٔی ثبٌؽ((( ؼـ لىٕز‬b ‫ ؼـ‬a ‫ـ ٔب ضبِّٕفة‬ٛ‫ظ‬ٙٔ ٝ‫ وفؼیٓ و‬ٜ‫ اوشفبؼ‬return ‫ـ‬ٛ‫ثؼؽ اق ؼوش‬
‫ ؼـ‬document.write ‫ـ‬ٛ‫وٗ ؼوش‬ٛ‫ س‬ٝ‫ ـا اغشّبَ ؼاؼیٓ و‬0 ‫ ٔمؽاـ‬b ‫ ٔشغیف‬ٝ‫ ث‬ٚ 3 ‫ ٔمؽاـ‬a ‫ٔشغیف‬
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫خی ٕ٘بیً ؼاؼ‬ٚ‫غف‬
: ‫ تِ تاتغ‬return ‫اضافِ کزدى دستَر‬

5 ٓ‫ی‬ٞ‫ ـا ٌفش ٔی ؼ‬return ‫ـ‬ٛ‫ اق ؼوش‬ٜ‫ اوشفبؼ‬ٜٛ‫ اق ٔثبَ قیف ٘ط‬ٜ‫ثب اوشفبؼ‬
5.(3 َ‫ٔثب‬
function get_added_text() {
var textpart1="This is ";
var textpart2="fun!";
var added_text=textpart1+textpart2;
return added_text;
}
5 ‫یؽ‬ٙ‫ ثفٔی ٌفؼا٘ؽ ـا ؼـ قیف ٔی ثی‬return ‫ـ‬ٛ‫ ؼوش‬ٝ‫ و‬ٝ‫آ٘س‬
This is fun!
) ‫یر زیكی ـا ثفٌفؼا٘یؽ‬ٞ ‫فزیكی یب‬ٞ return ‫ـ‬ٛ‫ اق ؼوش‬ٜ‫ا٘یؽ ثب اوشفبؼ‬ٛ‫ٌٕب ٔی س‬
5.(4 َ‫ٔثب‬
return "This is cool";

return 42;
return true;
return null;
return;
‫ا اوىفیذز‬ٚ‫ٍؽاـ خب‬ٞ ‫ اق یه سبثغ ثفای یه‬ٜ‫اوشفبؼ‬
5.(,+ َ‫ٔثب‬
function show_message() {
window.alert("This is an alert!");
}
show_message();
5.(,, َ‫ٔثب‬
<head>
function test()
{
return ("hello world");
}
</script>
</head>
<body>
document.write(test());
</script>
</body>
</html>
5.(,- َ‫ٔثب‬
function show_message() {
window.alert("This is an alert!");
}
window.alert("I am first, ha!");
window.alert("I am second, ha ha!");
show_message();
: ‫صذا سدى یک تاتغ تَسط تاتؼی دیگز‬

5 ٓ‫ثب یه ٔثبَ ایٗ ثطث ـا دی ٔی ٌیفی‬
5.(,. َ‫ٔثب‬
function update_alert(){
window.alert("Welcome! This site is updated daily!");}
function call_alert() {
update_alert();}
call_alert();
</script>
5.(,/ َ‫ٔثب‬
function update_alert() {
window.alert("Welcome! This site is updated daily!");
}
function section_alert() {
window.alert("Please visit the picture section!");
}
function links_alert() {
window.alert("Also, check out my links page!");
}
function get_messages() {
update_alert();
section_alert();
links_alert();
}
get_messages();
</script>
5.(,0 َ‫ٔثب‬
var mycar="Honda";
var paycheck=1200;
function new_car() {
mycar="Ferrari";
paycheck=3500;
window.alert("You need $"+paycheck+" to get a "+mycar);
}
new_car();
window.alert("You make $"+paycheck+" and have a "+mycar);
</script>
5.(,1 َ‫ٔثب‬
‫اثغ‬ٛ‫ اق س‬ٜ‫ ثب اوشفبؼ‬html ٝ‫وبغز یه ِفط‬
)‫ ٕ٘بییؽ‬ٜ‫ آٖ ـا ؾغیف‬ٚ ‫یؽ‬ٙ‫ ایدبؼ و‬html ٝ‫)اثشؽایه ِفط‬,
)‫ ٕ٘بییؽ‬ٜ‫ ؾغیف‬ٚ ‫ ایدبؼ‬test.js ْ‫ا اوىفیذز ثب ٘ب‬ٚ‫)وذه یه فبیُ خب‬-
‫ اق‬ٜ‫ اوشفبؼ‬ٜٛ‫َ لجُ ٘ط‬ّٛ‫یؽ)ؼـ ف‬ٞ‫ؼ ا٘دبْ ؼ‬ٛ‫ا اوىفیذز غ‬ٚ‫ فبیُ خب‬ٝ‫ؼ اـخبػی ث‬ٛ‫ غ‬html ُ‫ٖ فبی‬ٚ‫)ؼـ ؼـ‬.
)‫ اوز‬ٜ‫ ٌؽ‬ٜ‫ٔیص ؼاؼ‬ٛ‫ س‬html ُ‫بی اوىفیذز غبـخی ؼـ فبی‬ٞ ُ‫فبی‬
)‫یؽ‬ٙ‫اـؼ و‬ٚ ٖ‫بی قیف ـا ؼـ آ‬ٞ‫ وؽ‬ٚ ٜ‫یفایٍٍف ٔشٗ ثبق وفؼ‬ٚ ‫ اق یه‬ٜ‫ ـا ثب اوشفبؼ‬test.js ُ‫)فبی‬/
function car_cost(mycar,paycheck) {
window.alert("You have a "+mycar+" and make $"+paycheck);
}
function get_added_text() {
var textpart1="This project ";
var textpart2="is almost fun!";
var added_text=textpart1+textpart2;
return added_text;
}
car_cost("Mustang",1500);
var alert_text=get_added_text();
window.alert(alert_text);
)‫یؽ‬ٙ‫ و‬ٜ‫ا اوىفیذز غبـخی ـا ؾغیف‬ٚ‫)فبیُ خب‬0
ٜ‫ؽ‬ٞ‫ دیبْ قیف ـا ٍٔب‬ٚ‫یؽ ؼ‬ٙ‫ؼ ـا ثبق ٔی و‬ٛ‫ غ‬html ُ‫ ٌٕب فبی‬ٝ‫ قٔب٘ی و‬ٚ ُ‫ وفؼٖ فبی‬ٜ‫)ثؼؽ اق ؾغیف‬1
5 ‫ٔی ٕ٘بییؽ‬
You have a Mustang and make $1500

This project is almost fun!
5 ‫یؽ‬ٞ‫ـؼ ثفـوی لفاـ ؼ‬ٛٔ ‫ ٘شبیح ـا‬ٚ ‫یؽ‬ٙ‫ و‬ٜ‫ ؾغیف‬html ُ‫ وؽ قیف ـا ؼـ یه فبی‬ٝ‫ؼ‬ٙ‫ی ؼیٍف ل‬ٙ‫اٖ سٕفی‬ٛٙ‫ ػ‬ٝ‫ث‬
<body>
<h1>"Welcome to my Function Page," I said.</h1>
function get_added_text(textpart1,textpart2) {
var added_text=textpart1+" "+textpart2;
return added_text;
}
function print_text() {
var myfood=get_added_text("cheese","bread");
document.write(myfood);
}
var alert_text=get_added_text("soup","crackers");
window.alert(alert_text);
print_text();
</script>
<p style="color:red">I'm seeing red!</p>
</body
‫ ػولگزّا‬:‫فصل چْارم‬
‫هؼزفی ػولگزّای هَرد استفادُ در ‪JavaScript‬‬
‫ؼـ خب‪ٚ‬ا اوىفدز ثفای خٕغ‪ ،‬سففیك‪ٔ ،‬مبیى‪ ٚ ٝ‬ثىیبـی اق ػّٕیبر ؼیٍف اق ػٍّٕف‪ٞ‬ب اوشفبؼ‪ٔ ٜ‬ی و‪ٙ‬یٓ)‬
‫ػٍّٕف‪ٞ‬ب ث‪ ٝ‬ز‪ٙ‬ؽ ؼوش‪ ٝ‬سمىیٓ ٔی ٌ‪٘ٛ‬ؽ ‪ 5‬ػٍّٕف‪ٞ‬بی ٔطبوجبسی‪ٔ ،‬مبیى‪ ٝ‬ای‪ ،‬خبیٍكی‪ٙ‬ی‪ٙٙٔ ،‬می‪ ،‬ـٌش‪ ٝ‬ای‪ٚ ،‬‬
‫ٌف٘ی) ؼـ اؼأ‪ ٝ‬ث‪ ٝ‬اـائ‪ ٝ‬س‪ٔٛ‬یطبسی ثفای ‪ٞ‬ف ٘‪ٛ‬ع اق ایٗ ػٍّٕف‪ٞ‬ب غ‪ٛ‬ا‪ٞ‬یٓ دفؼاغز)‬
‫ػولگزّای هحاسثاتی‬
‫اق ایٗ ٘‪ٛ‬ع ػٍّٕف‪ٞ‬ب ثفای ا٘دبْ ػّٕیبر ـیبٔی ٘ظیف خٕغ ‪ٔ ٚ‬فة اوشفبؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ) ٔی س‪ٛ‬ا٘یؽ ایٗ‬
‫ػٍّٕف‪ٞ‬ب ـا ؼـ ای‪ٙ‬دب ٍٔب‪ٞ‬ؽ‪ ٜ‬و‪ٙ‬یؽ ‪ $‬ؼـ ٔثبَ قیف ٔشغیف ‪ x‬ـا ثفاثف ‪ٔ ٚ 3‬شغیف ‪ y‬ـا ثفاثف ‪ /‬ؼـ ٘ظف ثٍیفیؽ ‪5 #‬‬
‫٘شیدغ‬ ‫ٔثبَ‬ ‫ػٍّٕف‬ ‫٘بْ‬

‫‪12‬‬ ‫‪X + y‬‬ ‫‪+‬‬ ‫خٕغ‬
‫‪4‬‬ ‫‪X – y‬‬ ‫‪-‬‬ ‫سففیك‬
‫‪32‬‬ ‫‪X*y‬‬ ‫*‬ ‫ٔفة‬
‫‪2‬‬ ‫‪X / y‬‬ ‫‪/‬‬ ‫سمىیٓ‬
‫‪1‬‬ ‫‪X % y‬‬ ‫‪%‬‬ ‫ثبلیٕب٘ؽ‪ٜ‬‬
‫‪9‬‬ ‫‪X ++‬‬ ‫‪++‬‬ ‫افكایً‬
‫‪7‬‬ ‫‪X --‬‬ ‫‪--‬‬ ‫وب‪ًٞ‬‬
‫اق ػٍّٕف‪ٞ‬بی افكایً ‪ ٚ‬وب‪ ًٞ‬ث‪ ٝ‬سفسیت ثفای افك‪ٚ‬ؼٖ ‪ ,‬ث‪ٔ ٝ‬مؽاـ لجّی ‪ ٚ‬وٓ وفؼٖ ‪ ,‬اق ٔمؽاـ لجّی‬
‫اوشفبؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ)‬

‫ػولگزّای جایگشیٌی‬
‫ایٗ ػٍّٕف‪ٞ‬ب سفویجی اق ػٍّٕف‪ٞ‬بی ؼیٍف ‪ٞ‬ىش‪ٙ‬ؽ ‪ ٚ‬ث‪ٕٞ ٝ‬یٗ ؼِیُ آ٘‪ٟ‬ب ـا ػٍّٕف‪ٞ‬بی سفویجی ‪ٔ ٓٞ‬ی‬
‫٘بٔ‪ٙ‬ؽ) ٔی س‪ٛ‬ا٘یؽ ایٗ ػٍّٕف‪ٞ‬ب ـا ؼـ خؽ‪ َٚ‬قیف ٍٔب‪ٞ‬ؽ‪ ٜ‬و‪ٙ‬یؽ ‪ $‬ؼـ ٔثبَ قیف ٔشغیف ‪ x‬ـا ثفاثف ‪ٔ ٚ 3‬شغیف ‪ y‬ـا‬
‫ثفاثف ‪ /‬ؼـ ٘ظف ثٍیفیؽ ‪5 #‬‬
‫ػجبـر ٔؼبؼَ‬ ‫ٔثبَ‬ ‫ػٍّٕف‬ ‫٘بْ‬

‫‪X = 8‬‬ ‫‪X = 8‬‬ ‫=‬ ‫ا٘شىبة‬
‫‪X = x+y‬‬ ‫‪X += y‬‬ ‫=‪+‬‬ ‫ا٘شىبة خٕغ‬
‫‪X = x-y‬‬ ‫‪X -= y‬‬ ‫=‪-‬‬ ‫ا٘شىبة سففیك‬
‫‪X= x*y‬‬ ‫‪X *= y‬‬ ‫=*‬ ‫ا٘شىبة ٔفة‬
‫‪X = x/y‬‬ ‫‪X /= y‬‬ ‫=‪/‬‬ ‫ا٘شىبة سمىیٓ‬
‫‪X = x%y‬‬ ‫‪X %= y‬‬ ‫=‪%‬‬ ‫ا٘شىبة ثبلیٕب٘ؽ‪ٜ‬‬
‫ػولگزّای هقایسِ ای‬
‫اق ایٗ ػٍّٕف‪ٞ‬ب ثفای ٔمبیى‪ ٝ‬ؼ‪ٔ ٚ‬مؽاـ اوشفبؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ و‪ٌ ٝ‬بُٔ ػٍّٕف‪ٞ‬بی قیف ‪ٞ‬ىش‪ٙ‬ؽ)‬
‫‪x‬‬ ‫ؼـ خؽ‪ َٚ‬قیف ٔمبؼیف ‪ z ٚ y ٚx‬ـا ٔ‪ٙ‬بثك قیف ؼـ ٘ظف ثٍیفیؽ ‪ ٚ‬س‪ٛ‬خ‪ ٝ‬ؼاٌش‪ ٝ‬ثبٌیؽ و‪ٔ ٝ‬مؽاـ ٔشغیف‪ٞ‬بی‬
‫‪ y ٚ‬ػؽؼی ‪ٔ ٚ‬مؽاـ ٔشغیف ‪ z‬اق ٘‪ٛ‬ع ـٌش‪ ٝ‬ای اوز ‪5‬‬
‫;‪x = 4; y = 8‬‬ ‫; "‪z = "4‬‬
‫٘شید‪ٝ‬‬ ‫ٔثبَ‬ ‫ػٍّٕف‬ ‫٘بْ‬

‫‪true‬‬ ‫‪x == z‬‬ ‫==‬ ‫سىب‪ٚ‬ی‬
‫‪false‬‬ ‫‪x === z‬‬ ‫===‬ ‫‪ٕٞ‬ب٘ی‬
‫‪true‬‬ ‫‪x != z‬‬ ‫=!‬ ‫٘بٔىب‪ٚ‬ی‬
‫‪false‬‬ ‫‪x > y‬‬ ‫<‬ ‫ثكـٌشف اق‬
‫‪true‬‬ ‫‪x < y‬‬ ‫>‬ ‫و‪ٛ‬زىشف اق‬
‫‪true‬‬ ‫‪x >= y‬‬ ‫=<‬ ‫ثكـٌشف یب ٔىب‪ٚ‬ی‬
‫‪true‬‬ ‫‪x <= y‬‬ ‫=>‬ ‫و‪ٛ‬زىشف یب ٔىب‪ٚ‬ی‬

‫سفب‪ٚ‬ر ػٍّٕف سىب‪ٚ‬ی ثب ػٍّٕف ‪ٕٞ‬ب٘ی ؼـ ایٗ اوز و‪ ٝ‬ؼـ ػٍّٕف سىب‪ٚ‬ی ٘‪ٛ‬ع ٔشغیف ‪ٞ‬ب ؼـ ٘ظف ٌففش‪ٕ٘ ٝ‬ی‬
‫ٌ‪ٛ‬ؼ ‪ ٚ‬اٌف ٔمؽاـ ٔشغیف‪ٞ‬ب ثب ‪ ٓٞ‬ثفاثف ثبٌؽ ضشی اٌف اق یه ٘‪ٛ‬ع ‪٘ ٓٞ‬جبٌ‪ٙ‬ؽ ٘شید‪ True ٝ‬غ‪ٛ‬ا‪ٞ‬ؽ ث‪ٛ‬ؼ) ‪ِٚ‬ی ؼـ‬
‫ػٍّٕف ‪ٕٞ‬ب٘ی ثبیؽ ٔشغیف‪ٞ‬ب ٔمؽاـی ٔىب‪ٚ‬ی ؼاٌش‪ ٝ‬ثبٌ‪ٙ‬ؽ ‪ ٚ‬اق یه ٘‪ٛ‬ع ‪ ٓٞ‬ثبٌ‪ٙ‬ؽ سب ٘شید‪ True ٝ‬ثبٌؽ)‬
‫ػولگزّای هٌطقی‬
‫ایٗ ػٍّٕف‪ٞ‬ب ثفای ا٘دبْ ػّٕیبر ٔ‪ٙٙ‬می ثف ـ‪ٚ‬ی ؼ‪ ٚ‬ػجبـر ث‪ ٝ‬وبـ ٔی ـ‪٘ٚ‬ؽ ‪ $‬ؼـ ٔثبَ قیف ٔشغیف ‪ x‬ـا ثفاثف‬
‫‪ٔ ٚ 3‬شغیف ‪ y‬ـا ثفاثف ‪ /‬ؼـ ٘ظف ثٍیفیؽ ‪5 #‬‬
‫٘شید‪ٝ‬‬ ‫ٔثبَ‬ ‫ػٍّٕف‬ ‫٘بْ‬

‫‪true‬‬ ‫)‪!( x == y‬‬ ‫!‬ ‫٘میٓ‬
‫‪false‬‬ ‫)‪!(y == 3‬‬
‫‪true‬‬ ‫)‪(x=4 && y=8‬‬ ‫&&‬ ‫‪ٚ‬‬
‫‪false‬‬ ‫) ‪(x=4 && y=8‬‬
‫‪true‬‬ ‫) ‪(x=4 || y=8‬‬ ‫||‬ ‫یب‬
‫‪false‬‬ ‫)‪(x>4 || y>8‬‬
‫ػولگز رضتِ ای‬
‫اق ایٗ ػٍّٕف ثفای زىجب٘ؽٖ ؼ‪ ٚ‬ـٌش‪ ٝ‬ث‪ ٓٞ ٝ‬اوشفبؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ) ٔثالً ثفای اسّبَ ؼ‪ٔ ٚ‬شغیف اق ٘‪ٛ‬ع ـٌش‪ ٝ‬اق‬
‫ایٗ ػٍّٕف اوشفبؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ)‬
‫ٔثبَ‬ ‫ػٍّٕف‬ ‫٘بْ‬

‫;”‪a = “design web‬‬
‫‪b = “with java‬‬
‫&‬ ‫ػّٕ‪٘ٛ‬ؽ ـٌش‪ ٝ‬ای‬
‫;”‪script‬‬
‫;‪c = a + b‬‬
‫ؼـ ٔثبَ ثبال ٔمؽاـ ٔشغیف ‪ c‬ایٗ اوز ‪5‬‬
‫‪design webwith java script‬‬
‫ثفای ایدب فبِّ‪ ٝ‬ثیٗ وّٕ‪ٚ ٝ‬ة ‪ ٚ‬وّٕ‪ ٝ‬ثب ٔی س‪ٛ‬ا٘یٓ یه فبِّ‪ ٝ‬غبِی ث‪ ٝ‬یىی اق ٔشغیف‪ٞ‬بی ‪ a‬یب ‪ b‬أبف‪ٝ‬‬
‫و‪ٙ‬یٓ یب ثب اوشفبؼ‪ ٜ‬اق ػّٕ‪٘ٛ‬ؽ ـٌش‪ ٝ‬ای یه فٕبی غبِی ث‪ٔ ٝ‬شغیف ‪ c‬أبف‪ ٝ‬و‪ٙ‬یٓ ‪5‬‬

a = “design web ”; a = “design web”;

b = “with java script”; b = “with java script”;
c = a+b; c = a+ “ “+b;
5 ‫ؼ‬ٛ‫ؽ ث‬ٞ‫ا‬ٛ‫ـر غ‬ِٛ ٗ‫ ای‬ٝ‫ ث‬c ‫ وؽ ثبال ٔمؽاـ ٔشغیف‬ٝ‫ؼـ ٘شید‬
design web with java script
5 ‫ب‬ٞ‫ ثىبـٌیفی ػٍّٕف‬ٝٙ‫ع ؼـ قٔی‬ٛٙ‫بی ٔش‬ٞ َ‫ٔثب‬
5‫یؽ‬ٙ‫بی قیف أشطبٖ و‬ٍٟ‫ا٘یؽ ثب لفاـ ؼاؼٖ ؼـثیٗ س‬ٛ‫٘ؽ ـا ٔی س‬ٌٛ ‫ ٔی‬ٜ‫ـؼ‬ٚ‫ ؼـ قیف آ‬ٝ‫بیی و‬ِٟ‫سٕبٔی ٔثب‬
<script type="text/script>
‫هحل قزار گیزی کذُا‬
</script>
The Addition Operator (+)

5/(, َ‫ٔثب‬
var thesum=4+7;
window.alert(thesum);
var num1=4;
5/(- َ‫ٔثب‬
var thesum=num1+7;
5/(. َ‫ٔثب‬
var num1=4;
var num2=7;
var thesum=num1+num2;
5/(/ َ‫ٔثب‬
var num1=4.73;
var num2=7;
5/(0 َ‫ٔثب‬
var num1=4;
var num2="7";
‫ ػٍّٕف خٕغ‬ٝ‫ ؼـ ٘شید‬ٚ ٓ‫ ای‬ٜ‫اـؼ وفؼ‬ٚ ٝ‫اٖ یه ـٌش‬ٛٙ‫ ػ‬ٝ‫ ـا ث‬7 ‫ اوز قیفا ٔب‬47 ‫اة ٔثبَ آغف‬ٛ‫ خ‬5 ٝ‫٘ىش‬
)‫ؽ‬ٙ‫ٓ اِطبق ٔی و‬ٞ ٝ‫ب ـا ث‬ٟ٘‫ب آ‬ٟٙ‫س‬
The Subtraction Operator (–)

5/(1 َ‫ٔثب‬
var theresult=10-3;
window.alert(theresult);
1
5/(2 َ‫ٔثب‬
var num1=10;
var num2=3;
var theresult=num1-num2;
The Multiplication Operator (*)

5/(3 َ‫ٔثب‬
var num1=4;
var num2=5;
var thetotal=num1*num2;
window.alert(thetotal);
The Division Operator (/)

5/(4 َ‫ٔثب‬
var num1=10;
var num2=2;
var theresult=num1/num2;
5/(,+ َ‫ٔثب‬
var num1=3;
var num2=4;
5/(,, َ‫ٔثب‬
var num1=10;
var num2=0;
)‫ اوز‬ٜ‫ ػؽؼ ثف ِفف سمىیٓ ٌؽ‬ٝ‫ؼ زفا و‬ٌٛ ‫بیز ٔی‬ٟ٘ ‫اة ثی‬ٛ‫ؼـ ٔثبَ ثبال خ‬
The Modulus Operator (%)

5/(,- َ‫ٔثب‬
var num1=11;
var num2=2;
var theresult=num1%num2;
The Increment Operator (++)

5/(,. َ‫ٔثب‬
var num1=2;
var theresult=++num1;
The Increment Operator After the Operand

5/(,/ َ‫ٔثب‬
var num1=2;
var theresult=num1++;
5/(,0 َ‫ٔثب‬
num1=2;
result= ++num1;
alert("num1= "+num1+" result= "+result);
num1=2;
result= num1++;
alert("num1= "+num1+" result= "+result);
</script>
The Decrement Operator (– –)

5/(,1 َ‫ٔثب‬
var num1=2;
var theresult=--num1;
5/(,2 َ‫ٔثب‬
var num1=2;
var theresult=num1--;
‫ حلقِ ّا‬:‫فصل پٌجن‬
‫هؼزفی دستَر ضزطی ‪ ٍ if...else‬کارتزدّای هختلف آى‬
‫اق ؼوش‪ٛ‬ـار ٌف٘ی ثفای ا٘دبْ ؼوش‪ٛ‬ـاسی ث‪ٌ ٝ‬فٖ ثفلفاـی یه ـاث‪ ٝٙ‬ؼیٍف اوشفبؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ) ؼـ ٘فاضی‬
‫ِفطبر ‪ٚ‬ة ثىیبـ دیً ٔی آیؽ و‪ٔ ٝ‬ی غ‪ٛ‬ا‪ٞ‬یٓ ؼـ ٌفایٗ غبِی ِفط‪ ٝ‬یه ـفشبـ ٍٔػُ ؼاٌش‪ ٝ‬ثبٌؽ ‪ٚ‬‬
‫ؼـ ٔ‪ٛ‬اـؼ ؼیٍف ـفشبـ ِفط‪ ٝ‬سفب‪ٚ‬ر ؼاٌش‪ ٝ‬ثبٌؽ) ؼـ ایٗ ٔ‪ٛ‬الغ ٔی س‪ٛ‬ا٘یٓ اق ؼوش‪ٛ‬ـ ٌف٘ی ‪ if‬اوشفبؼ‪ ٜ‬و‪ٙ‬یٓ) ثب‬
‫ایٗ ؼوش‪ٛ‬ـ ٍٔػُ ٔی و‪ٙ‬یٓ اٌف ٌفٖ غبِی ثفلفاـ ث‪ٛ‬ؼ یه ػُٕ غبَ ا٘دبْ ٌ‪ٛ‬ؼ) وبغشبـ ایٗ ؼوش‪ٛ‬ـ ث‪ٝ‬‬
‫ٌىُ قیف اوز ‪5‬‬
‫دستَر ضزطی ‪if‬‬
‫)‪if(condition‬‬
‫{‬
‫دستوری کَ در صورت درستی ضزط اجزا هی ضود در ایٌجا قزار هی گیزد‬
‫}‬
‫ث‪ ٝ‬یه ٔثبَ ثفای ؼوش‪ٛ‬ـ ‪ if‬س‪ٛ‬خ‪ ٝ‬و‪ٙ‬یؽ ‪5‬‬
‫ٔثبَ ‪50(,‬‬
‫)"اگز ایي پیام را تاییذ کٌیذ دستور ضزطی اجزا هی گزدد‪var test = confirm(".‬‬
‫{)‪if (test==true‬‬
‫)"ضوا دکوَ هورد ًظز را کلیک کزدیذ و ایي پیام بَ ًوایص درآهذ"(‪alert‬‬
‫}‬
‫ثفای ای‪ٙ‬ى‪ ٝ‬وؽ ثبال ـا آقٔبیً و‪ٙ‬یؽ ِی‪ٙ‬ه قیف ـا وّی و‪ٙ‬یؽ ‪ ٚ‬ؼـ دیبٔی و‪ٕ٘ ٝ‬بیً ؼاؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ ؼوٕ‪ٝ‬‬
‫‪ OK‬ـا وّیه و‪ٙ‬یؽ) اٌف ؼوٕ‪ Cancel ٝ‬ـا وّیه و‪ٙ‬یؽ ٌفٖ ثبال ثفلفا ٕ٘ی ٌ‪ٛ‬ؼ ‪ ٚ‬ثؽ‪ ٖٚ‬اخفا ٌؽٖ ؼوش‪ٛ‬ـ‬
‫ٌف٘ی ِفط‪ٔ ٝ‬ثبَ ثبق ٔی ٌ‪ٛ‬ؼ)‬

‫دستَر ضزطی ‪if...else‬‬
‫ثفغی ٔ‪ٛ‬الغ ٕٔىٗ اوز ثػ‪ٛ‬ا‪ٞ‬یٓ ؼوش‪ٛ‬ـ ٌف٘ی یه ٌفٖ ـا زه و‪ٙ‬ؽ سب ؼـ ِ‪ٛ‬ـر ثفلفاـ ث‪ٛ‬ؼٖ آٖ‬
‫ٌفٖ یه ففٔبٖ غبَ ـا اخفا و‪ٙ‬ؽ ‪ ٚ‬ؼـ ِ‪ٛ‬ـسی و‪ٌ ٝ‬فٖ ثفلبـ ٘ج‪ٛ‬ؼ یه ففٔبٖ ؼیٍف ـا ث‪ ٝ‬اخفا ؼـ آ‪ٚ‬ـؼ) ؼـ‬
‫ایٗ ٔ‪ٛ‬اـؼ ٔی س‪ٛ‬ا٘یٓ اق ؼوش‪ٛ‬ـ ‪ if‬ث‪ٕٞ ٝ‬فا‪ else ٜ‬اوشفبؼ‪ ٜ‬و‪ٙ‬یٓ) وبغشبـ ایٗ ؼوش‪ٛ‬ـ ث‪ٌ ٝ‬ىُ قیف اوز ‪5‬‬
‫{)‪if(condition‬‬
‫}دستوراتی کَ در صورت درستی ضزط اجزا هی ضوًذ‬
‫{‪else‬‬
‫}دستوراتی کَ در صورت عذم بزقزاری ضزط اجزا هی ضوًذ‬
‫ؼـ وؽ ثبال اثشؽا ٌفٖ ثفـوی ٔی ٌ‪ٛ‬ؼ ‪ ٚ‬ؼـ ِ‪ٛ‬ـر ثفلفاـی آٖ ؼوش‪ٛ‬ـار ٔفث‪ ٝ٘ٛ‬اخفا ٔی ٌ‪٘ٛ‬ؽ ‪ِٚ‬ی ؼـ‬
‫ِ‪ٛ‬ـسی و‪ٌ ٝ‬فٖ ثفلفاـ ٘جبٌؽ ؼوش‪ٛ‬ـار ٔفث‪ ٖٛ‬ث‪ ٝ‬لىٕز ‪ else‬اخفا ٔی ٌ‪ٛ‬ؼ)‬
‫ٔثبَ ‪50(-‬‬
‫;)'‪var yourmark = prompt('enter a number between 0 to 20‬‬
‫{)‪if (yourmark>10‬‬
‫;)'‪alert('your number great than 10‬‬
‫}‬
‫{‪else‬‬
‫;)'‪alert('your number not great than 10‬‬
‫}‬
‫ثفای ٍٔب‪ٞ‬ؽ‪٘ ٜ‬شید‪ٔ ٝ‬ثبَ ثبال آٖ ـا أشطبٖ و‪ٙ‬یؽ ‪ ٚ‬ؼـ وبؼـی و‪ٕ٘ ٝ‬بیً ؼاؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ یه ػؽؼ اق ‪ +‬سب‬
‫‪ٚ ,+‬اـؼ و‪ٙ‬یؽ ‪ ٚ‬ؼوٕ‪ OK ٝ‬ـا وّیه و‪ٙ‬یؽ)‬

‫استفادُ اس دستَر ‪( if..else if...else‬دستَرات ضزطی تَ در تَ)‬
‫ٕٔىٗ اوز ؼـ ٘ظف ؼاٌش‪ ٝ‬ثبٌیٓ سب ؼـ ِ‪ٛ‬ـر ثفلفاـی یه ٌفٖ یه ؼوش‪ٛ‬ـ غبَ اخفا ٌ‪ٛ‬ؼ ‪ ٚ‬ؼـ‬
‫ِ‪ٛ‬ـسی و‪ٌ ٝ‬فٖ ثفلفاـ ٘ج‪ٛ‬ؼ ٌفٖ ؼیٍفی ثفـوی ٌ‪ٛ‬ؼ ‪ ٚ‬ؼوش‪ٛ‬ـ ٔفث‪ ٖٛ‬ث‪ ٝ‬آٖ اخفا ٌ‪ٛ‬ؼ ‪ ٚ‬ؼـ ِ‪ٛ‬ـسی و‪ٞ ٝ‬یر‬
‫یه اق ٌف٘‪ٟ‬بی لجُ ثفلفاـ ٘ج‪ٛ‬ؼ ؼوش‪ٛ‬ـ ؼیٍفی اخفا ٌ‪ٛ‬ؼ) ؼـ ایٗ ٔ‪ٛ‬الغ ٔی س‪ٛ‬ا٘یٓ اق ؼوش‪ٛ‬ـ ‪ else if‬ؼـ‬
‫ؼوش‪ٛ‬ـ ‪ if...else‬لجّی اوشفبؼ‪ ٜ‬و‪ٙ‬یؽ) ث‪ِٛ ٝ‬ـر قیف ‪5‬‬
‫{)‪if (condition 1‬‬

‫دستوراتی کَ در صورت درستی ضزط اول اجزا هی ضوًذ‬
‫}‬
‫{)‪else if (condition 2‬‬
‫دستوراتی کَ در صورت درستی ضزط دوم اجزا هی ضوًذ‬
‫}‬
‫{‪slse‬‬
‫دستوراتی کَ سهاًی کَ ُیچکذام اس ضزوط درست ًباضٌذ اجزا هی ضوًذ‬
‫}‬
‫ؼـ ایٗ ـ‪ٚ‬ي ٔطؽ‪ٚ‬ؼیشی اق ٘ظف سؼؽاؼ ٌف٘‪ٟ‬ب ‪ٚ‬خ‪ٛ‬ؼ ٘ؽاـؼ ‪ٔ ٚ‬ی س‪ٛ‬ا٘یٓ ث‪ ٝ‬سؼؽاؼ ٘بٔطؽ‪ٚ‬ؼ اق ؼوش‪ٛ‬ـ ‪else if‬‬
‫اوشفبؼ‪ ٜ‬و‪ٙ‬یٓ ‪ِٚ‬ی ؼـ ٔ‪ٛ‬اـؼی و‪ ٝ‬سؼؽاؼ ایٗ ٌف٘‪ٟ‬ب غیّی قیبؼ ٔی ٌ‪ٛ‬ؼ ث‪ٟ‬شف اوز ث‪ ٝ‬خبی ایٗ ـ‪ٚ‬ي اق‬
‫ؼوش‪ٛ‬ـ ‪ switch‬و‪ ٝ‬ثؼؽاً س‪ٔٛ‬یص ؼاؼ‪ ٜ‬غ‪ٛ‬ا‪ٞ‬ؽ ٌؽ اوشفبؼ‪ ٜ‬و‪ٙ‬یٓ)‬
‫ؼـ ای‪ٙ‬دب ٔثبَ لجُ ـا ثب وٕی سغییف ثفای ایٗ ـ‪ٚ‬ي اوشفبؼ‪ٔ ٜ‬ی و‪ٙ‬یٓ ‪5‬‬
‫ٔثبَ ‪50(.‬‬
‫;)'‪var yourmark = prompt('enter a number between 0 to 20‬‬
‫{)‪if (yourmark>0 && yourmark<20‬‬
‫;)'ضوارٍ وارد ضذٍ بیي ‪ 0‬تا ‪ 00‬است'(‪alert‬‬
‫}‬
‫{)‪else if(yourmark>20‬‬
‫;)'ضوارٍ وارد ضذٍ اس ‪ 00‬بشرگتز است'(‪alert‬‬
‫}‬
‫{‪else‬‬
‫)'عبارت وارد ضذٍ یا ‪ 0‬است اس بَ جای عذد اس حزف استفادٍ کزدٍ ایذ'(‪alert‬‬
‫}‬

‫دستور ‪switch‬‬
‫اٌف ثػ‪ٛ‬ا‪ٞ‬یٓ ثفای اوىفیذز ‪ٞ‬بی غ‪ٛ‬ؼ ٔىیف‪ٞ‬بی ثیٍشفی ؼـ ٘ظف ثٍیفیٓ یه ـا‪ٛٔ ٜ‬خ‪ٛ‬ؼ اوشفبؼ‪ ٜ‬اق‬
‫ؼوش‪ٛ‬ـار ‪ if‬س‪ ٛ‬ؼـ س‪ ٛ‬اوز) ایٗ ـ‪ٚ‬ي ؼـ ٔ‪ٛ‬اـؼ خكئی وبـاییؽاـؼ ‪ ٚ‬ؼـ ِ‪ٛ‬ـسی و‪ ٝ‬سؼؽاؼ ٌف٘‪ٟ‬ب قیبؼ ٌ‪ٛ‬ؼ ٔب ـا‬
‫ٔدج‪ٛ‬ـ ٔی و‪ٙ‬ؽ اق سؼؽاؼ قیبؼی ‪ else ٚ if‬ؼـ اوىفیذز غ‪ٛ‬ؼ اوشفبؼ‪ ٜ‬و‪ٙ‬یٓ و‪ ٝ‬ایٗ ٔىئّ‪ ٓٞ ٝ‬ثبػث ٘‪ٛ‬ال٘ی‬
‫ٌؽٖ ثف٘بٔ‪ ٚ ٝ‬اق ٘ففی أىبٖ اٌشجب‪ ٜ‬ـا ‪ ٓٞ‬ثبال ٔی ثفؼ)‬
‫ـا‪ ٜ‬ضُ ؼیٍف اوشفبؼ‪ ٜ‬اق ؼوش‪ٛ‬ـ ٌف٘ی ‪ switch‬اوز) ایٗ ؼوش‪ٛ‬ـ ـا ٔی س‪ٛ‬اٖ ؼـ ‪ٍٙٞ‬بٔی و‪ٔ ٝ‬ی غ‪ٛ‬ا‪ٞ‬یٓ‬
‫یه ٔشغیف ـا ثب ز‪ٙ‬ؽیٗ ٔمؽاـ ٔمبیى‪ ٝ‬و‪ٙ‬یٓ ‪ٔ ٚ‬مؽاـ ٔش‪ٙ‬بوت ثب آ٘فا دیؽا و‪ٙ‬یٓ وبـ ثفؼ ؼاـؼ)‬
‫ثفای ؼـن ث‪ٟ‬شف ث‪ٌ ٝ‬ىُ وّی ایٗ ـ‪ٚ‬ي س‪ٛ‬خ‪ ٝ‬و‪ٙ‬یؽ)‬
‫)‪switch(x‬‬
‫{‬
‫‪case 1 :‬‬ ‫;‪//if x=value(case1) it's run‬‬
‫;‪break‬‬
‫‪case 1 :‬‬ ‫;‪//if x=value(case2) it's run‬‬
‫;‪break‬‬
‫;‪default‬‬ ‫)‪//if x not equal to value(case1) or value(case2‬‬
‫ؼوش‪ٛ‬ـ ثبال ث‪ ٝ‬ایٗ ِ‪ٛ‬ـر ػُٕ ٔی و‪ٙ‬ؽ و‪ ٝ‬ؼـ اثشؽا ٔب یه ػجبـر ‪ x‬ـا ؼاـیٓ و‪ٔ ٝ‬شغیف ٔب ٔی ثبٌؽ و‪ٝ‬‬
‫یه ثبـ ثفـوی ٔی ٌ‪ٛ‬ؼ ‪ ٚ‬وذه ٔمؽاـ ایٗ ػجبـر ثب ‪ٞ‬ف وؽاْ اق ‪ٞ case‬ب ٔمبیى‪ٔ ٝ‬ی ٌ‪ٛ‬ؼ سب ثجی‪ٙ‬ؽ و‪ ٝ‬ثب‬
‫وؽاْ یه ثفاثف ٔی ثبٌؽ اٌف س‪ٙ‬بثمی ؼاٌش‪ ٝ‬ثبٌؽ ٔدٕ‪ٛ‬ػ‪ ٝ‬وؽ‪ٞ‬بی آٖ ‪ case‬اخفاء ٔی ٌ‪ٛ‬ؼ‬
‫‪:break‬‬
‫اق ‪ break‬ثفای ایٗ اوشفبؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ و‪ ٝ‬ؼـ ِ‪ٛ‬ـر ؼـوشی ‪ٞ‬ف وؽاْ اق ‪ٞ case‬ب ؼوش‪ٛ‬ـ ث‪ case ٝ‬ثؼؽی‬
‫٘ف‪ٚ‬ؼ ‪ ٚ‬اق ؼوش‪ٛ‬ـ غبـج ٌ‪ٛ‬ؼ‬
‫‪:default‬‬
‫ؼـ ِ‪ٛ‬ـسی و‪ٔ ٝ‬مؽاـ ٔشغیف ٔ‪ٛ‬ـؼ ٘ظف ثب ‪ٞ‬یسىؽاْ اق ‪ٞ case‬ب ثفاثف ٘ج‪ٛ‬ؼ وؽ لىٕز ‪ default‬اخفاء ٔی‬
‫ٌ‪ٛ‬ؼ اِجش‪ ٝ‬اوشفبؼ‪ ٜ‬اق ‪ default‬اغشیبـی اوز ٌٕب ٔی س‪ٛ‬ا٘یؽ اق آٖ ث‪ ٝ‬ضؽ ٘یبق اوشفبؼ‪ ٜ‬وفؼ‪ ٚ ٜ‬یب آٖ ـا ضؿف‬
‫و‪ٙ‬یؽ‬

‫ب‬ٞ ٖ‫ ٘یبق اق آ‬ٜ‫ ا٘ؽاـ‬ٝ‫ا٘یؽ ث‬ٛ‫ ٔی س‬ٚ ‫ؼیشی ٘ؽاـیؽ‬ٚ‫یر ٔطؽ‬ٞ case ‫ـار‬ٛ‫ اق ؼوش‬ٜ‫ٌٕب ؼـ اوشفبؼ‬5ِ‫ًکت‬
‫یؽ‬ٙ‫ و‬ٜ‫اوشفبؼ‬
‫ ثب‬ٚ ‫ ـا ؼـیبفز‬#ٝ‫فش‬ٞ ‫بی‬ٞ‫ق‬ٚ‫اق ـ‬$ ‫ق‬ٚ‫ف ـ‬ٞ ‫بظف ثب‬ٙ‫ ػؽؼ ٔش‬،getDay ٚ Date ‫اثغ‬ٛ‫ اق س‬ٜ‫ؼـ ٔثبَ قیف ثب اوشفبؼ‬
‫بی‬ٞ‫ق‬ٚ‫ ثف اوبن ـ‬ٝ‫یؽ و‬ٙ‫ ٔی و‬ٝ‫ ٔالضظ‬،ٓ‫ ای‬ٜ‫خی اـوبَ وفؼ‬ٚ‫ غف‬ٝ‫ب ـا ث‬ٞ )case( ‫اـؼ‬ٛٔ ‫ یىی اق‬،ٖ‫ آ‬ٝ‫ ث‬ٝ‫خ‬ٛ‫س‬
‫ ؼـ‬case ٚ switch ‫بٔیه اق‬ٙ‫ـر ؼای‬ِٛ ٝ‫اٖ ث‬ٛ‫ـر ٔی س‬ّٛٙ‫ ای‬ٝ‫ ث‬،‫ؼ‬ٛ‫ؽ ث‬ٞ‫ا‬ٛ‫خی ٔب ٘یك ٔشغیف غ‬ٚ‫ غف‬ٝ‫فش‬ٞ
)‫ وفؼ‬ٜ‫ا اوىفیذز اوشفبؼ‬ٚ‫خب‬
50(/ َ‫ٔثب‬
var date = new Date()
var today = date.getDay()
switch(today){
case 1 :
document.write("mon");
break;
case 2 :
document.write("tus");
break;
case 3 :
document.write("wen");
break;
case 4 :
document.write("tur");
break;
case 5 :
document.write("fri");
break;
case 6 :
document.write("sat");
break;
case 7 :
document.write("sun");
break;
default:
document.write("error")
}
</script>
‫سبثغ ‪ getDay ٚ date‬ؼـ ضبِز ػبؼی ثب ـ‪ٚ‬ق ‪ ٚ‬قٔبٖ ٔیالؼی وبـ ٔی و‪ٙٙ‬ؽ‪ِ ،‬ؿا ثف اوبن ای‪ٙ‬ى‪ ٝ‬یىٍ‪ٙ‬ج‪ٝ‬‬
‫ـ‪ٚ‬ق سؼ‪ٙ‬یُ ؼـ سم‪ٛ‬یٓ ٔیالؼی ٔطى‪ٛ‬ة ٔی ٌ‪ٛ‬ؼ ‪$‬ـ‪ٚ‬ق ‪ٞ‬فشٓ‪ٌ ،#‬ف‪ٚ‬ع ٌٕبـي ـ‪ٚ‬ق‪ٞ‬بی ‪ٞ‬فش‪ ٝ‬اق ؼ‪ٌٙٚ‬ج‪case $ ٝ‬‬
‫‪ #1‬غ‪ٛ‬ا‪ٞ‬ؽ ث‪ٛ‬ؼ)‬
‫اػؽاؼی و‪ ٝ‬ث‪ ٝ‬ػ‪ٛٙ‬اٖ ٔمبؼیف ث‪ٞ case ٝ‬ب ؼاؼ‪ٌ ٜ‬ؽ‪ ٜ‬ا٘ؽ‪ ،‬ؼـ ‪ٚ‬الغ ضبُِ ‪٘ ٚ‬شید‪ ٝ‬ثفٌفؼا٘ؽ‪ٌ ٜ‬ؽ‪ ٜ‬اق لىٕز‬
‫‪ ٚ date.getDay‬ثب س‪ٛ‬خ‪ ٝ‬ث‪ ٝ‬سبـیع س‪ٙ‬ظیٓ ٌؽ‪ ٜ‬ویىشٓ اوز و‪ ٝ‬ثیٗ ‪ ,‬سب ‪ 2‬ؼـ ٘‪ٛ‬وبٖ اوز)‬
‫ثب س‪ٛ‬خ‪ ٝ‬ث‪ ٝ‬سبـیع ویىشٓ ٌٕب‪ ،‬أف‪ٚ‬ق و‪ٌٙ ٝ‬ج‪ ٝ‬اوز!‬
‫اوشفبؼ‪ ٜ‬اق ضّم‪ٞ ٝ‬ب ‪5‬‬
‫ًحَُ استفادُ اس حلقِ ّای ‪FOR‬‬

‫ضّم‪ٞ ٝ‬ب ٔدٕ‪ٛ‬ػ‪ ٝ‬وؽ‪ٞ‬بیی ـا ثفای سؼؽاؼ غبِی یب سب قٔب٘ی و‪ ٝ‬یه ٌف٘ی ثفلفاـ ٌ‪ٛ‬ؼ اخفا ٔی و‪ٙٙ‬ؽ)‬
‫ٔؼٕ‪ٛ‬ال قٔب٘ی و‪ٌٕ ٝ‬ب وؽی ـا ٔی ٘‪ٛ‬یىیؽ‪٘ ،‬یبق ؼاـیؽ و‪ٔ ٝ‬دٕ‪ٛ‬ػ‪ ٝ‬وؽ‪ٞ‬بیی دٍز وف ‪ ٓٞ‬ز‪ٙ‬ؽ ثبـ اخفا‬
‫ٌ‪٘ٛ‬ؽ) ث‪ ٝ‬خبی ز‪ٙ‬ؽیٗ ثبـ أبف‪ ٝ‬وفؼٖ ایٗ ز‪ٙ‬ؽغٗ دٍز وف ‪ٔ ٓٞ‬ی س‪ٛ‬ا٘یؽ اق ؼوش‪ٛ‬ـار قیف اوشفبؼ‪ ٜ‬و‪ٙ‬یؽ)‬
‫ؼـ خب‪ٚ‬ااوىفیذز ؼ‪ٛ٘ ٚ‬ع ضّم‪ٔ ٝ‬شفب‪ٚ‬ر ‪ٚ‬خ‪ٛ‬ؼ ؼاـؼ‪5‬‬
‫‪ٔ 5for‬دٕ‪ٛ‬ػ‪ ٝ‬ؼوش‪ٛ‬ـار ث‪ ٝ‬سؼؽاؼ ٍٔػُ سىفاـ ٔی ٌ‪ٛ‬ؼ)‬
‫‪ٔ 5while‬دٕ‪ٛ‬ػ‪ ٝ‬ؼوش‪ٛ‬ـار سب سطمك یه ٌفٖ اؼأ‪ٔ ٝ‬ی یبثؽ)‬
‫حلقِ ‪For‬‬
‫ثفای ٌف‪ٚ‬ع اثشؽا وبغشبـ وّی ضّم‪ for ٝ‬ـا ٍ٘بٖ ٔی ؼ‪ٞ‬یٓ ‪5‬‬
‫)گام حزکت;ضزط حلقَ;هقذار اولیَ اًذیس حلقَ (‪for‬‬

‫;دستورات‬
‫}‬
‫ٔثبَ ‪50(0‬‬
‫{ )‪for (var count=1;count<11;count+=1‬‬
‫;)">‪document.write("I am part of a loop!<br /‬‬

‫}‬
‫ؼوش‪ٛ‬ـ ثبال ث‪ ٝ‬ا٘ؽاق‪ 10 ٜ‬ثبـ ػجبـر !‪ I am part of a loop‬ـا زبح ٔی و‪ٙ‬ؽ )‬
‫ٔثبَ قیف ضّم‪ ٝ‬ای ـا سؼفیف ٔی و‪ٙ‬ؽ و‪ ٝ‬اق ‪ٌ i=0‬ف‪ٚ‬ع ٌؽ‪ ٚ ،ٜ‬سب قٔب٘ی و‪ i ٝ‬و‪ٛ‬زىشف یب ٔىب‪ٚ‬ی ‪ 0‬ثبٌؽ اؼأ‪ٝ‬‬
‫ٔی یبثؽ) ‪ٞ‬ف ثبـ و‪ ٝ‬ضّم‪ ٝ‬اخفا ٔی ٌ‪ٛ‬ؼ ‪ i‬یه ‪ٚ‬اضؽ افكایً ٔی یبثؽ)‬
‫ٔثبَ ‪50(1‬‬
‫زفغیؽٖ ثیٗ سً ‪ٞ‬بی ‪ heading‬ؼـ ‪HTML‬‬
‫)‪for(i=1;i<7;i++‬‬
‫{‬
‫;)‪document.write("<h" + i +">this is heading" + i‬‬
‫;)">" ‪document.write("<h" + i +‬‬
‫}‬
‫ضّم‪ ٝ‬ی ‪ for‬ثبػث ٔی ٌ‪ٛ‬ؼ ٔمؽاـ ٔشغیف ‪ i‬سب و‪ٛ‬زىشف ‪ٔ ٚ‬ىب‪ٚ‬ی ‪ 6‬اؼأ‪ ٝ‬دیؽا و‪ٙ‬ؽ ‪ ٚ‬وذه ٔش‪ٛ‬لف ٌ‪ٛ‬ؼ‬
‫س‪ٛ‬وٗ ؼوش‪ٛ‬ـ ‪ document.write‬ا‪ٔ َٚ‬شٗ غ‪ٛ‬ؼ ـا ثّ‪ٛ‬ـر ػ‪ٛٙ‬اٖ ث‪ٛ‬خ‪ٛ‬ؼ آ‪ٚ‬ـؼیٓ و‪ ٝ‬ثبػثً سً‬
‫ػ‪ٛٙ‬ا٘ی اوز و‪ٚ ٝ‬اـؼ ٌؽ‪ ٚ ٜ‬س‪ٛ‬وٗ ‪ + i +‬ایٗ ؼوش‪ٛ‬ـ ‪ٞ‬ف ثبـ و‪ ٝ‬ضّم‪ ٝ‬سىفاـ ٔی ٌ‪ٛ‬ؼ ػ‪ٛٙ‬اٖ ٘یك سغییف دیؽا‬
‫ٔی و‪ٙ‬ؽ ‪ ٚ‬س‪ٛ‬وٗ ‪ٔ +i‬مؽاـ ٔشغیف ‪ i‬ـا ؼـ و‪ٙ‬بـ ٔشٗ غ‪ٛ‬ؼ و‪ ٝ‬ث‪ِٛ ٝ‬ـر ػ‪ٛٙ‬اٖ ؼـ آٔؽ‪ ٜ‬سىفاـ وفؼیٓ ‪ ٚ‬ؼـ‬
‫‪٘ document.write‬یك ایٗ سً ػ‪ٛٙ‬اٖ ـا ثىشیٓ‬
‫ًکتِ‪5‬سٕبٔی وؽ‪ٞ‬بیی و‪ ٝ‬ثیٗ ایٗ ؼ‪ ٚ‬ؼاثُ و‪ٛ‬ر ‪ٚ‬اـؼ ٌؽ‪ ٜ‬ا٘ؽ خؽا اق ‪ٔ & i‬ی ثبٌؽ‬
‫ًتیجِ‪:‬‬

‫ًحَُ استفادُ اس حلقِ ّای ‪while‬‬
‫ضّم‪ٞ ٝ‬ب ٔدٕ‪ٛ‬ػ‪ ٝ‬وؽ‪ٞ‬بیی ـا ثفای سؼؽاؼ غبِی یب سب قٔب٘ی و‪ ٝ‬یه ٌف٘ی ثفلفاـ ٌ‪ٛ‬ؼ اخفا ٔی و‪ٙٙ‬ؽ‬
‫ایٗ ضّم‪ٕٞ ٝ‬بٖ وبـایی ‪ for‬ـا ؼاـؼ ‪ ٚ‬اق ‪ٕٞ‬بٖ اخكا سٍىیُ ٌؽ‪ ٚ ٜ‬فمٗ ؼـ سفویت لفاـ ٌففشٗ اخكاء ففق‬
‫ؼاـؼ)‬
‫)هقذار پایاًی=<هتغیز( ‪while‬‬

‫{‬
‫دستورات بذًَ حلقَ‬
‫}‬
‫ًکتِ‪ :‬ث‪ ٝ‬خبی =< ٔی س‪ٛ‬اٖ اق ‪ٞ‬ف ػٍّٕف ٔمبیى‪ ٝ‬ای ؼیٍف اوشفبؼ‪ ٜ‬وفؼ)‬
‫ٔثبَ دبییٗ ‪ٕٞ‬ب٘‪ٙ‬ؽ ٔثبَ ‪ٞ‬بی ‪ٔ for‬ی ثبٌؽ ‪ ٚ‬سفویت لفاـ ٌففشٗ اخكاء ففق ؼاـؼ)‬
‫ٔثبَ ‪50(2‬‬
‫;‪var i = 0‬‬
‫)‪while(i <= 6‬‬
‫{‬
‫;)‪document.write("the number is :" + i‬‬
‫;)">‪document.write("<br /‬‬
‫;‪i++‬‬
‫}‬
‫ؼـ ٔثبَ ثبال ٔؽاـ ٔشغیف ‪ i‬ـا ‪ +‬لفاـ ؼاؼ‪ ٜ‬ایٓ ‪ ٚ‬ؼـ غٗ ثؼؽ ‪$‬ضّم‪ ٝ‬ی ‪ #while‬یه ٔشٗ ـا ث‪ِٛ ٝ‬ـر ـٌش‪ٝ‬‬
‫لفاـ ؼاؼ‪ ٜ‬ایٓ ‪ ٚ‬س‪ٛ‬وٗ ؼوش‪ٛ‬ـ ‪ & i‬ضّم‪ ٝ‬ـا سىفاـ وفؼیٓ سب ؼـ و‪ٙ‬بـ ‪ٞ‬ف ٔشٗ ٔب ٌٕبـ‪ ٜ‬ای ث‪ ٝ‬سفسیجی و‪ ٝ‬غ‪ٛ‬ؼٔبٖ‬
‫لفاـ ؼاؼ‪ ٜ‬ایٓ لفاـ ٌیفؼ ‪ ٚ‬ؼـ غٗ ثؼؽ ثب اوشفبؼ‪ ٜ‬اق سً <‪ HTML <br‬خٕالر غ‪ٛ‬ؼ ـا ؼـ قیف یىؽیٍف لفاـ‬
‫ؼاؼ‪ ٜ‬ایٓ ‪ ٚ‬ثؼؽ ؼوش‪ٛ‬ـ ‪ i++‬ـا لفاـ ؼاؼ‪ ٜ‬ایٓ ‪ ٚ‬وذه ؼوش‪ٛ‬ـ ـا ثىشیٓ)‬

‫حلقِ ‪do...while‬‬
‫ایٗ ضّم‪ ٝ‬یه سفب‪ٚ‬ر ثب ‪ while‬ؼاـؼ) ایٗ ضّم‪ ٝ‬اثشؽا ٔدٕ‪ٛ‬ػ‪ ٝ‬ؼوش‪ٛ‬ـار ـا یه ثبـ ا٘دبْ ٔی ؼ‪ٞ‬ؽ‪ٚ ،‬‬
‫وذه ضّم‪ ٝ‬ـا سب قٔب٘ی و‪ٌ ٝ‬فٖ ثفلفاـ ٌ‪ٛ‬ؼ سىفاـ ٔی و‪ٙ‬ؽ)‬
‫ؼـ ثؼٕی ٔ‪ٛ‬الغ ٔب ٘یبق ؼاـیٓ و‪ ٝ‬ضّم‪ ٝ‬ضؽالُ یىجبـ اخفا ٌ‪ٛ‬ؼ‪ ،‬ضشی اٌف ٌفٖ ثفلفاـ ٘جبٌؽ! قیفا‬
‫ؼوش‪ٛ‬ـار لجُ اق ثفـوی ٌفٖ اخفا ٔی ٌ‪٘ٛ‬ؽ)‬
‫ؼوش‪ٛ‬ـ‪5‬‬
‫{ ‪do‬‬
‫} دستورات بذًَ حلقَ‬
‫;)هقذار پایاًی=<هتغیز (‪while‬‬
‫ؼـ ٔثبَ قیف اق ‪ do...while‬اوشفبؼ‪ٔ ٜ‬ی و‪ٙ‬یٓ) ؼـ ایٗ ٘‪ٛ‬ع ضّم‪ٔ ،ٝ‬دٕ‪ٛ‬ػ‪ ٝ‬ؼوش‪ٛ‬ـار ضؽالُ یه ثبـ اخفا‬
‫ٔی ٌ‪ٛ‬ؼ ضشی اٌف ٌفٖ ٘بؼـوز ثبٌؽ‪ ،‬قیفا ؼوش‪ٛ‬ـار لجُ اق ثفـوی ٌفٖ اخفا ٔی ٌ‪٘ٛ‬ؽ)‬
‫ٔثبَ ‪50(3‬‬
‫;‪var i = 8‬‬
‫‪do‬‬
‫{‬
‫;)"‪alert("this is a test‬‬
‫;‪i++‬‬
‫}‬
‫;)‪while(i<=4‬‬
‫ؼـ ٔثبَ ثبال ‪ i=8‬اوز ‪ٌ ٚ‬فٖ ضّم‪ ٝ‬ایٗ اوز و‪ i ٝ‬و‪ٛ‬زىشف اق ‪ /‬ثبٌؽ‪ ،‬أب ثب ای‪ٙ‬ى‪ٌ ٝ‬فٖ ثفلفاـ ٘یىز‬
‫‪ِٚ‬ی اخفاء ٔی ٌ‪ٛ‬ؼ ز‪ ٖٛ‬ایٗ ٌفٖ ؼـ ا٘ش‪ٟ‬بی ضّم‪ ٝ‬ثفـوی ٔیٍ‪ٛ‬ؼ‪ ،‬ده ضّم‪ ٝ‬یىجبـ اخفا ٌؽ‪ ٚ ٜ‬دیبْ یه ثبـ‬
‫ٔیٍ‪ٛ‬ؼ‪.‬‬ ‫ٕ٘بیً ؼاؼ‪ٜ‬‬

‫آهَسش کار تا دستَر ‪for...in‬‬
‫ایٗ ؼوش‪ٛ‬ـ ثیٗ غّ‪ِٛ‬یز ‪ٞ‬بی یه ٌیء ٔی زفغؽ)‬
‫ایٗ ؼوش‪ٛ‬ـ ث‪ٙٔ ٝ‬ظ‪ٛ‬ـ ثؽوز آ‪ٚ‬ـؼٖ غّ‪ِٛ‬یبر ‪ ٚ‬یب ٔشؽ اٌیبء اوشفبؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ ؼـ ِ‪ٛ‬ـسی و‪ ٝ‬ثػ‪ٛ‬ا‪ٞ‬یٓ‬
‫غّ‪ِٛ‬یز ‪ٞ‬بی یه ٌی ء ـا ثؽوز آ‪ٚ‬ـیٓ اق ایٗ ـ‪ٚ‬ي اوشفبؼ‪ٔ ٜ‬ی و‪ٙ‬یٓ اِجش‪ ٝ‬ث‪ ٝ‬ایٗ ٘ىش‪ ٝ‬س‪ٛ‬خ‪ ٝ‬و‪ٙ‬یؽ و‪ٝ‬‬
‫ٔ‪ّٙ‬ت خّى‪ ٝ‬دیً ؼـ ٔ‪ٛ‬ـؼ ‪ for‬ثىیبـ وبـثفؼی سف اق ایٗ ٔ‪ّٙ‬ت ٔی ثبٌؽ‬
‫ؼوش‪ٛ‬ـ‪5‬‬
‫)‪for (variable in object‬‬

‫{‬
‫دستورات بذًَ حلقَ‬
‫}‬
‫٘ىش‪ 5ٝ‬ؼوش‪ٛ‬ـ ٔ‪ٛ‬خ‪ٛ‬ؼ ؼـ ثؽ٘‪ for...in ٝ‬ثفای ‪ٞ‬ف غّ‪ِٛ‬یز یه ثبـ اخفا ٔی ٌ‪ٛ‬ؼ)‬
‫ٔثبَ ‪50(4‬‬
‫زفغیؽٖ ثیٗ غّ‪ِٛ‬یز ‪ٞ‬بی یه ٌیء‪5‬‬
‫;}"‪var person={first:"welcome to",second:"your site‬‬
‫)‪for(x in person‬‬
‫{‬
‫;)" " ‪document.write(person[x] +‬‬
‫}‬
‫غف‪ٚ‬خی وؽ ثبال ث‪ِٛ ٝ‬ـر قیف غ‪ٛ‬ا‪ٞ‬ؽ ث‪ٛ‬ؼ‪5‬‬
‫‪welcome to your site‬‬

‫ رٍیذادّا‬: ‫فصل ضطن‬
‫رٍیذادّا‬
‫ـ‪ٚ‬یؽاؼ یه غبِیز اق دیً سؼفیف ٌؽ‪ ٜ‬ؼـ خب‪ٚ‬ا اوىفیذز اوز و‪ ٝ‬آٖ ـا ؼـ ِفطبر ‪ٚ‬ة غ‪ٛ‬ؼ ثىبـ ٔی‬
‫ثفیٓ)‬
‫وبـ ـا ثب یه ٔثبَ وبؼ‪ٌ ٜ‬ف‪ٚ‬ع ٔی و‪ٙ‬یٓ ‪5‬‬
‫ٔثبَ ‪51(,‬‬
‫>‪<body‬‬
‫>‪<form‬‬
‫"!‪<input type="button" value="Click Me‬‬
‫>‪onclick="window.alert('Hi!';" /‬‬
‫>‪</form‬‬
‫>‪</body‬‬
‫ٔثبَ ثبال ٌبُٔ یه ـ‪ٚ‬یؽاؼ ٔی ثبٌؽ و‪ ٝ‬ث‪ٔ ٝ‬طٓ فٍفؼٖ ؼوٕ‪ Click Me ٝ‬فؼبَ ٔی ٌ‪ٛ‬ؼ ‪ ٚ‬دیغبْ‬
‫!‪ Hi‬ـا ث‪ٕ٘ ٝ‬بیً ٔی ٌؿاـؼ)‬
‫ؼـ اؼأ‪ ٝ‬ث‪ٔ ٝ‬ؼففی ا٘‪ٛ‬اع ـ‪ٚ‬یؽاؼ‪ٞ‬ب ‪ٔ ٚ‬ثبِ‪ٟ‬بیی ؼـ ثبـ‪ٞ ٜ‬ف وؽاْ غ‪ٛ‬ا‪ٞ‬یٓ دفؼاغز )‬
‫)‪The Abort Event (onabort‬‬
‫ـ‪ٚ‬یؽاؼ ‪ onabort‬قٔب٘ی اسفبق ٔی افشؽ و‪ ٝ‬یه وبـثف ِ‪ٛ‬ؼ ٌؽٖ یه سّ‪ٛ‬یف ـا ؼـ ٘یٕ‪ ٝ‬ـا‪ٔ ٜ‬ش‪ٛ‬لف و‪ٙ‬ؽ)‬
‫ثفای ٔثبَ اٌف ٌٕب ثػ‪ٛ‬ا‪ٞ‬یؽ قٔب٘ی و‪ ٝ‬وبـثف ِ‪ٛ‬ؼ ٌؽٖ یه ػىه ـا ٔش‪ٛ‬لف ٔی و‪ٙ‬ؽ دیبٔی ـا ؼـیبفز‬
‫ٕ٘بیؽ ٔی س‪ٛ‬ا٘یؽ اق ؼوش‪ٛ‬ـ قیف اوشفبؼ‪ٕ٘ ٜ‬بییؽ‪5‬‬
‫ٔثبَ ‪51(-‬‬
‫"‪<img src="myimage.jpg" alt="my picture‬‬

‫‪onabort="window.alert('Why don\'t you want to see my‬‬
‫>‪picture?');" /‬‬

‫رٍیذادّای هزتَط تِ هاٍس‬
The Click Event (onclick)
)‫ؽ‬ٙ‫ وّیه و‬ٝ‫بی ِفط‬ٞ ٖ‫ی یىی اق إِب‬ٚ‫ وبـثف ـ‬ٝ‫ؽ و‬ٞ‫یؽاؼ قٔب٘ی ـظ ٔی ؼ‬ٚ‫ایٗ ـ‬
51(. َ‫ٔثب‬
<body>
<form>
<input type="button" value="Do not Click Here"
onclick="window.alert('I told you not to click me!');">
</form>
</body>
51(/ َ‫ٔثب‬
<body>
<a href="http://none" onclick="window.alert('Hey! You clicked
me!');">
Don't Click Me</a>
</body>
‫ه‬ٙ‫ ِی‬ٝ‫ؽ سب ث‬ٙ‫ـٌف سالي ٔی و‬ٚ‫ٍؽاـ ٔف‬ٞ ‫ؼ‬ٛ‫خ‬ٚ ‫ ثب‬ٝ‫ؼ ؼاـؼ ایٗ اوز و‬ٛ‫خ‬ٚ ‫ ؼـ وؽ ثبال‬ٝ‫ٍٔىّی و‬
‫ؼ ٌىُ ِطیص وؽ‬ٌٛ ‫“ ٔی‬Server not found” ْ‫ ٕ٘بیً ؼـ آٔؽٖ دیغب‬ٝ‫ ایٗ ثبػث ث‬ٚ ‫ؽ‬ٙ‫ؼوشیبثی دیؽا و‬
‫یؽ‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ـا ؼـ قیف ٍٔب‬
51(2 َ‫ٔثب‬
<body>
<a href="http://none"
onclick="window.alert('Hey! You clicked me!'); return false;">
Don't Click Me</a>
</body>
The Doubleclick Event (ondbclick)
)‫ؽ‬ٙ‫ ؼاثُ وّیه و‬ٝ‫بی ِفط‬ٞ ٖ‫ی یىی اق إِب‬ٚ‫ وبـثف ـ‬ٝ‫ؽ و‬ٞ‫یؽاؼ قٔب٘ی ـظ ٔی ؼ‬ٚ‫ایٗ ـ‬
51(3 َ‫ٔثب‬
5‫یؽاؼ اسفبق ٔی افشؽ‬ٚ‫ی ٔفثغ لفٔك ـً٘ ایٗ ـ‬ٚ‫ؼـ ٔثبَ قیف ثب ؼاثُ وّیه وفؼٖ ـ‬
<html>
<head>
<title>Mouse Events Example</title>
function handleEvent(oEvent) {
var oTextbox = document.getElementById("txt1");
oTextbox.value += "\n" + oEvent.type;
}
</script>
</head>
<body>
<p>Use your mouse to click and double click the red
square.</p>
<div style="width: 100px; height: 100px; background-color:
red"
ondblclick="handleEvent(event)" id="div1"></div>
<p><textarea id="txt1" rows="15" cols="50"></textarea></p>
</body>
</html>
The Mouseover Event (onmouseover)
‫ه‬ٙ‫ؽ یه ِی‬ٙ٘‫ ٔب‬ٝ‫بی ِفط‬ٟ٘‫ی یىی اق إِب‬ٚ‫ن ـا ـ‬ٚ‫ ٌف ٔب‬ٜ‫ وبـثف اٌبـ‬ٝ‫ؽ و‬ٞ‫یؽاؼ قٔب٘ی ـظ ٔی ؼ‬ٚ‫ایٗ ـ‬
5‫ؽ‬ٞ‫ضفوز ؼ‬
51(4 َ‫ٔثب‬
<a href="http://www.dlp.lxb.ir"
onmouseover="window.alert('I told you not to try to click
me!');">
Don't Try Clicking Me!</a>
The Mouseout Event (onmouseout)
‫ـؼ ٘ظف غبـج ٕ٘بیؽ‬ٛٔ ٜ‫ؼ‬ٚ‫ن ـا اق ٔطؽ‬ٚ‫ ٌف ٔب‬ٜ‫ وبـثف اٌبـ‬ٝ‫ؽ و‬ٞ‫یؽاؼ قٔب٘ی ـظ ٔی ؼ‬ٚ‫ایٗ ـ‬
51(2 َ‫ٔثب‬
5<a href="http://www.dlp.lxb.ir"
onmouseout="window.alert('What, you didn\'t like my link?');">
Click Me!</a>
The Mousedown Event (onmousedown)
)‫ؽ‬ٞ‫ـؼ ٘ظف ـظ ٔی ؼ‬ٛٔ ٜ‫ؼ‬ٚ‫وٗ وبثف ؼـ ٔطؽ‬ٛ‫ن س‬ٚ‫ٍبْ فٍفؼٖ وّیؽ ٔب‬ٙٞ ‫یؽاؼ ؼـ‬ٚ‫ایٗ ـ‬
51(3 َ‫ٔثب‬
‫ع‬ٛ‫ل‬ٚ ٝ‫یؽاؼ ث‬ٚ‫ـ وبُٔ آٖ ـ‬ٛ٘ ٝ‫ٍبْ دبییٗ ـفشٗ آٖ ث‬ٙٞ ‫ ؼـ‬ٚ ً٘‫ی ٔفثغ لفٔك ـ‬ٚ‫ؼـ ٔثبَ قیف ثب وّیه ثف ـ‬
)‫٘ؽؼ‬ٛ‫ٔی دی‬
<html>
<head>
}
</script>
</head>
<body>
square.</p>
red"
onmousedown="handleEvent(event)"
id="div1"></div>
</body>
</html>
The Mouseup Event (onmouseup)
)‫ؽ‬ٞ‫ـؼ ٘ظف ـظ ٔی ؼ‬ٛٔ ٜ‫ؼ‬ٚ‫وٗ وبثف ؼـ ٔطؽ‬ٛ‫ س‬ٜ‫ ٌؽ‬ٜ‫ن فٍفؼ‬ٚ‫ب وفؼٖ وّیؽ ٔب‬ٞ‫ٍبْ ـ‬ٙٞ ‫یؽاؼ ؼـ‬ٚ‫ایٗ ـ‬
51(4َ‫ٔثب‬
‫ع ٔی‬ٛ‫ل‬ٚ ٝ‫یؽاؼ ث‬ٚ‫ـ وبُٔ ـ‬ٛ٘ ٝ‫ٍبْ ثبال ـفشٗ آٖ ث‬ٙٞ ‫ ؼـ‬ٚ ً٘‫ی ٔفثغ لفٔك ـ‬ٚ‫ؼـ ٔثبَ قیف ثب وّیه ثف ـ‬
)‫٘ؽؼ‬ٛ‫دی‬
<html>
<head>
}
</script>
</head>
<body>
square.</p>
red"
onmouseup="handleEvent(event)"
id="div1"></div>
</body>
</html>
The Mousemove Event (onmousemove)
)‫٘ؽؼ‬ٛ‫ع ٔی دی‬ٛ‫ل‬ٚ ٝ‫ـؼ ٘ظف ث‬ٛٔ ٜ‫ؼ‬ٚ‫ن ؼـ ٔطؽ‬ٚ‫ـؼٖ ٍ٘بٍ٘ف ٔب‬ٚ‫ ضفوز ؼـ آ‬ٝ‫ٍبْ ث‬ٙٞ ‫یؽاؼ ؼـ‬ٚ‫ایٗ ـ‬
)‫٘ؽؼ‬ٛ‫ع ٔی دی‬ٛ‫ل‬ٚ ٝ‫یؽاؼ ث‬ٚ‫یُ لفٔك ـً٘ ـ‬ٙ‫ ٔىش‬ٜ‫ؼ‬ٚ‫ ٔطٓ ضفوز ؼـ ٔطؽ‬ٝ‫ؼـ ٔثبَ ث‬
51(,+ َ‫ٔثب‬
<html>
<head>

}
</script>
</head>
<body>
square.</p>
<div style="width:427px; height: 30px; background-color: red"
onmousemove="handleEvent(event)"
id="div1"></div>
</body>
</html>
‫رٍیذادّای صفحِ کلیذ‬
The Keydown Event (onkeydown)
) ‫ؽ‬ٞ‫ وّیؽ ـا فٍبـ ؼ‬ٝ‫بی ِفط‬ٞ‫ وبـثف یىی اق وّیؽ‬ٝ‫ؽ و‬ٞ‫قٔب٘ی ـظ ٔی ؼ‬
51(,, َ‫ٔثب‬
<body>
<input value="onkeydown" type="text"
onkeydown="alert('onkeydown')" />
</body>
The Keypress Event (onkeypress)
‫ی آٖ ـا سبیخ‬ٚ‫ف ـ‬ٙ‫ وبـاو‬ٚ ٚ ٜ‫ وّیؽ ـا فٍبـ ؼاؼ‬ٝ‫بی ِفط‬ٞ‫ وبـثف یىی اق وّیؽ‬ٝ‫ؽ و‬ٞ‫قٔب٘ی ـظ ٔی ؼ‬
)‫ٕ٘بیؽ‬
51(,- َ‫ٔثب‬
<body>
<input value="onkeypress" type="text" onkeypress="alert('
onkeypress')" />
</body>
The Keyup Event (onkeyup)
)‫ؽ‬ٙ‫ب و‬ٞ‫ ـا ـ‬ٜ‫ ٌؽ‬ٜ‫ وبـثف وّیؽ فٍبـ ؼاؼ‬ٝ‫ؽ و‬ٞ‫قٔب٘ی ـظ ٔی ؼ‬

51(,. َ‫ٔثب‬
<body>
<input value="onkeyup" type="text" onkeyup="alert('onkeyup')"
/>
</body>
‫ثفای ؼـن ث‪ٟ‬شف ـ‪ٚ‬یؽاؼ‪ٞ‬بی ٔفث‪ ٖٛ‬ث‪ِ ٝ‬فط‪ ٝ‬وّیؽ فبیُ ‪html‬ی ـا و‪ ٝ‬ؼـ ٔ‪ٛ‬ـؼ ایٗ ٔجطث اوز ‪ٕٔ ٚ‬یٕ‪ٝ‬‬
‫وشبة ٔی ثبٌؽ ـا ٔ‪ٛ‬ـؼ ثفـوی لفاـ ؼ‪ٞ‬یؽ)‬

‫رٍیذادّای هزتَط تِ فزم ‪:‬‬
‫ایٗ ـ‪ٚ‬یؽاؼ‪ٞ‬ب ٔفث‪ ٖٛ‬ث‪ ٝ‬ػّٕیبسی اوز و‪ ٝ‬وبـثف ثف ـ‪ٚ‬ی اخكای ففْ ا٘دبْ ٔی ؼ‪ٞ‬ؽ) اِجش‪ٕٔ ٝ‬ىٗ اوز‬
‫ثؼٕی اق ایٗ ـ‪ٚ‬یؽاؼ‪ٞ‬ب ثف ـ‪ٚ‬ی ٔشٗ ‪ٞ‬بی ػبؼی ؼـ ِفط‪ُ ٝ‬ن ػىه اِؼُٕ ٍ٘بٖ ؼ‪ٙٞ‬ؽ أب ثیٍشفیٗ وبـثفؼ ـا‬
‫ؼـ ففْ ‪ٞ‬ب ؼاـ٘ؽ)‬
‫)‪The Focus Event (onfocus‬‬
‫قٔب٘ی اسفبق ٔی افشؽ و‪ ٝ‬وبـثف ثػ‪ٛ‬ا‪ٞ‬ؽ ـ‪ٚ‬ی یىی اق اخكای ففْ یب د‪ٙ‬دف‪ٔ ٜ‬شٕفوك ٌ‪ٛ‬ؼ ‪ ٚ‬دیبٔی ـا ٕ٘بیً‬
‫ٔی ؼ‪ٞ‬ؽ یب ػىه اِؼّٕی ـا ٍ٘بٖ ٔی ؼ‪ٞ‬ؽ)‬
‫ٔ‪ٙ‬ظ‪ٛ‬ـ اق ٔشٕفوك ٌؽٖ ایٗ اوز و‪ ٝ‬ث‪ٛٙ‬ـ ٔثبَ ثفای ٘‪ٌٛ‬شٗ ـ‪ٚ‬ی یه ‪ text box‬وّیه و‪ٙ‬ؽ )‬
‫ٔثبَ ‪51(,/‬‬
‫>‪<form‬‬
‫‪Enter Your Name:‬‬
‫‪<input type="text" onfocus="window.alert('Don\'t forget to‬‬
‫>‪capitalize!');" /‬‬
‫>‪</form‬‬
‫)‪The Blur Event (onblur‬‬
‫ایٗ ـ‪ٚ‬یؽاؼ ثفػىه ـ‪ٚ‬یؽاؼ ‪ focus‬اوز ‪ٍٙٞ ٚ‬بٔی ـظ ٔی ؼ‪ٞ‬ؽ و‪ ٝ‬س‪ٛ‬وٗ ٔ‪ٛ‬ن ‪ ٚ‬یب ؼوٕ‪ tab ٝ‬ویج‪ٛ‬ـؼ ثف‬
‫ـ‪ٚ‬ی یىی اق اخكای ففْ سٕفوك غ‪ٛ‬ؼ ـا اق ؼوز ثؽ‪ٞ‬ؽ)‬
‫ٔثبَ ‪51(,0‬‬
‫>‪<form‬‬
‫>‪Give this box focus:<br /‬‬
‫";)'!‪<input type="text" onblur="window.alert('Hey! Come back‬‬
‫>‪/><br /‬‬
‫>‪then give this box focus to blur the first one:<br /‬‬
‫>‪<input type="text" /‬‬
‫>‪</form‬‬

The Change Event (onchange)
)‫ی‬ٙ‫ؽ سغییف ٔشٗ ؼـ وبؼـ ٔش‬ٙ٘‫ؽ' ٔب‬ٞ‫ وبـثف یىی اق اخكای ففْ ـا سغییف ؼ‬ٝ‫ؽ و‬ٞ‫یؽاؼ قٔب٘ی ـظ ٔی ؼ‬ٚ‫ایٗ ـ‬
51(,1 َ‫ٔثب‬
<form>
Are you cool?<br />
<select onchange="window.alert('Why did you change that?');">
<option selected="selected">Yes</option>
<option>No</option>
<option>Undecided</option>
</select>
</form>
The Submit Event (onsubmit)
)‫ؽ‬ٞ‫ ـا فٍبـ ؼ‬submit ٕٝ‫ وبـثف ؼـ یه ففْ ؼو‬ٝ‫ؽ و‬ٞ‫ٍبٔی ـظ ٔی ؼ‬ٙٞ ٗ‫یؽاؼ فم‬ٚ‫ایٗ ـ‬
51(,2 َ‫ٔثب‬
<form onsubmit="window.alert('Thank You');">

What's your name?<br />
<input type="text" id="thename" /><br />
<input type="submit" value="Submit Form">
</form>
The Reset Event (onreset)
ٝ‫ ث‬ٚ)‫ ٕ٘بیؽ‬reset ‫ة ـا‬ٚ ٝ‫ ِفط‬reset ٕٝ‫ی ؼو‬ٚ‫ وبـثف ثب وّیه ثف ـ‬ٝ‫ؽ و‬ٞ‫یؽاؼ قٔب٘ی ـظ ٔی ؼ‬ٚ‫ایٗ ـ‬
)‫ٓ ؼـ ٘ظف ٌففز‬ٞ ‫ب‬ٞ ْ‫ فف‬ٝ‫ٖ ث‬ٛ‫بی ٔفث‬ٞ‫یؽاؼ‬ٚ‫اٖ آٖ ـا اق ـ‬ٛ‫ػی ٔی س‬ٛ٘
)‫٘ؽؼ‬ٛ‫ع ٔی دی‬ٛ‫ل‬ٚ ٝ‫یؽاؼ ث‬ٚ‫ ـ‬ٚ ‫ؼ‬ٌٛ ‫ ـیىز ٔی‬ٝ‫ ِفط‬reset ٕٝ‫ی ؼو‬ٚ‫ی ـ‬ٚ‫ؼـ ٔثبَ قیف ثب وّیه ثف‬
51(,3 َ‫ٔثب‬
<html >
<head>
<title> Form Events Example </title>
</head>
<body>
<form onReset="alert('onreset');">
<input type="reset" value="reset"

onReset="alert('onreset');"/><input type="text" />
</form>
</body>
</html>
The Select Event (onselect)
‫ز اخفا‬ِٕٙ‫ؼ ؼـ ایٗ ا‬ٛ‫خ‬ٛٔ ‫ؼ اوىفدز‬ٌٛ ‫ؼ ؼاـؼ ا٘شػبة‬ٛ‫ ـا ؼـ غ‬ٝ‫بو‬ٌٙ ٗ‫ ای‬ٝ‫ لىٕشی اق ففْ و‬ٝ‫لشی و‬ٚ
)‫ؼ‬ٌٛ ‫ٔی‬
)‫ؼ‬ٌٛ ‫یؽاؼ اخفا ٔی‬ٚ‫ؼ ؼـ وبؼـ ایٗ ـ‬ٛ‫خ‬ٛٔ ٗ‫ؼـ ٔثبَ قیف ثب ا٘شػبة ٔش‬
51(,4 َ‫ٔثب‬
<html>
<head>
<title> Form Events Example </title></head>
<body>
<textarea cols="20" rows="10"
onselect="alert('onselect')";>Lerning JavaScript
Hadi Ahmadi
http://dlp.lxb.ir</textarea>
</body>
</html>
‫ وشبة‬ٕٝ‫ ٕٔی‬ٚ ‫ـؼ ایٗ ٔجطث اوز‬ٛٔ ‫ ؼـ‬ٝ‫ی ـا و‬html ُ‫ ففْ فبی‬ٝ‫ٖ ث‬ٛ‫بی ٔفث‬ٞ‫یؽاؼ‬ٚ‫شف ـ‬ٟ‫ثفای ؼـن ث‬
)‫یؽ‬ٞ‫ـؼ ثفـوی لفاـ ؼ‬ٛٔ ‫ٔی ثبٌؽ ـا‬
‫رٍیذادّای پٌجزُ هزٍرگز‬
The Load Event (onload)
)‫ؼ‬ٌٛ ‫ؼ‬ِٛ ُٔ‫ـ وب‬ٛٙ‫ ث‬ٝ‫ یه ِفط‬ٝ‫ؽ و‬ٞ‫ٍبٔی ـظ ٔی ؼ‬ٙٞ ‫یؽاؼ‬ٚ‫ایٗ ـ‬
51(-+ َ‫ٔثب‬
<body onload="window.alert('I\'m done loading now!');">

Text for the body of the page...
</body>
ُ‫ وؽ قیف ـا ؼـ یه فبی‬ٝ‫ؼ‬ٙ‫ا٘یؽ اثشؽا ل‬ٛ‫ـر یه فبیُ غبـخی ثىبـ ثجفیؽٔی س‬ِٛ ٝ‫ آٖ ـا ث‬ٝ‫یؽ و‬ٞ‫ا‬ٛ‫اٌف ٔی غ‬
) ‫یؽ‬ٙ‫ و‬ٜ‫ ؾغیف‬load_alert.js ‫ ٔثال‬.js
51(-, َ‫ٔثب‬
window.onload = function() {
window.alert('I\'m done loading now!');
};
)‫ؼ ثىبـ ثفیؽ‬ٛ‫ غ‬html ٝ‫ٖ ِفط‬ٚ‫ اق وؽ قیف آٖ ـا ؼـ‬ٜ‫وذه ثب اوشفبؼ‬
51(-- َ‫ٔثب‬
<body>
<script type="text/javascript" src="load_alert.js"></script>
Text for the body of the page...
</body>
The Unload Event (onunload)
)‫یؽاؼ ثبال ػُٕ ٔی ٕ٘بیؽ‬ٚ‫ػىه ـ‬
51(-. َ‫ٔثب‬
<body onunload="window.alert('Be sure to come back, OK?');">

Other HTML code goes here...
</body>
ٚ ‫ـؼ ایٗ ٔجطث اوز‬ٛٔ ‫ ؼـ‬ٝ‫ی ـا و‬html ُ‫ـٌف فبی‬ٚ‫ ٔف‬ٜ‫دف‬ٙ‫ د‬ٝ‫ٖ ث‬ٛ‫بی ٔفث‬ٞ‫یؽاؼ‬ٚ‫شف ـ‬ٟ‫ثفای ؼـن ث‬
)‫یؽ‬ٞ‫ـؼ ثفـوی لفاـ ؼ‬ٛٔ ‫ وشبة ٔی ثبٌؽ ـا‬ٕٝ‫ٕٔی‬
The resize event(onresize)
)‫ؼ‬ٌٛ ‫وٗ وبـثف اخفا ٔی‬ٛ‫ـٌف س‬ٚ‫ ٔف‬ٜ‫دف‬ٙ‫ٍبْ سغییف وبیك د‬ٙٞ ‫یؽاؼ ؼـ‬ٚ‫ایٗ ـ‬
51(-. َ‫ٔثب‬
<html>
<head>
<title>OnResize Example</title>
</head>
<body onresize=”alert(„Resizing‟)”>
</body>
</html>
The scroll event(onscroll)
ٝ‫ ز‬ٚ ‫ؼی‬ٕٛ‫َ وفؼٖ ػ‬ٚ‫ اوىف‬ٝ‫٘ؽؼ) ز‬ٛ‫ع ٔی دی‬ٛ‫ل‬ٚ ٝ‫ ث‬ٜ‫دف‬ٙ‫َ وفؼٖ یه د‬ٚ‫ٍبْ اوىف‬ٙٞ ‫یؽاؼ ؼـ‬ٚ‫ایٗ ـ‬
)‫افمی‬
51(-/ َ‫ٔثب‬
)‫ ٕ٘بیً ؼـ ٔی آیؽ‬ٝ‫ یه دیغبْ ثفای ٌٕب ث‬ٝ‫َ وفؼٖ ِفط‬ٚ‫ ٔطٓ اوىف‬ٝ‫ؼـ ٔثبَ قیف ث‬
<html>
<head>
<title>OnScroll Example</title>
</head>
<body onscroll=”alert(„Scrolling‟)”>
<p>Try scrolling this window.</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</body>
</html>
51(-0 َ‫ٔثب‬
‫ ٔی‬ٜ‫خؽ ؼـ آٖ ٕ٘بیً ؼاؼ‬ٛٔ ‫ی‬ٙ‫ ٔش‬ٝ‫بیی ؼـ خؼج‬ٞ ْ‫ دیغب‬ٝ‫َ وفؼٖ ِفط‬ٚ‫ٍبْ اوىف‬ٙٞ ‫ؼـ ٔثبَ قیف ؼـ‬
)‫ؼ‬ٌٛ
<html>
<head>
<title>OnScroll Example</title>
window.onscroll = function () {
var oTextbox = document.getElementById(“txt1”);
oTextbox.value += “\nscroll is at “ + document.body.scrollLeft
+ “
horizontally and “ + document.body.scrollTop + “ vertically.”;
}
</script>
</head>
<body>
<p>Try scrolling this window.</p>
<p><textarea rows=”15” cols=”50” id=”txt1”></textarea>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</body>
</html>
‫ اضیا‬: ‫فصل ّفتن‬
‫تزًاهِ ًَیسی ضیءگزا‬
‫خب‪ٚ‬ااوىفیذز یه قثبٖ ٌیءٌفاوز) ٘ط‪ ٜٛ‬وبغز اٌیبء ؼـ ثػً دیٍففش‪ ٝ‬ؼـ فُّ ‪ٞ‬بی ثؼؽی آٔ‪ٛ‬قي‬
‫ؼاؼ‪ ٜ‬غ‪ٛ‬ا‪ٞ‬ؽ ٌؽ) ؼـ ای‪ٙ‬دب ٔب اق اٌیبی ؼاغّی خب‪ٚ‬ااوىفیذز اوشفبؼ‪ ٜ‬وفؼ‪ٍ٘ٚ ٜ‬ب‪ٞ‬ی ث‪ ٝ‬آ٘‪ٟ‬ب ٔی ا٘ؽاقیٓ ‪٘ ٚ‬ط‪ٜٛ‬‬
‫اوشفبؼ‪ ٜ‬اق آ٘‪ٟ‬ب ـا ٔی آٔ‪ٛ‬قیٓ) ؼـ ز‪ٙ‬ؽ خّى‪ ٝ‬ثؼؽی و‪ٔ ٝ‬فث‪ ٖٛ‬ث‪ ٝ‬ایٗ ثػً اوز ‪ٞ‬ف یه اق ایٗ اٌیب ـا ثفـوی‬
‫اخٕبِی وفؼ‪ٔ ٚ ٜ‬ثبَ ‪ٞ‬بی قیبؼی اق آٖ ‪ٞ‬ب ـا غ‪ٛ‬ا‪ٞ‬یٓ ؼیؽ)‬
‫‪ٞ‬ف ٌیء یه ٔدٕ‪ٛ‬ػ‪ ٝ‬غّ‪ِٛ‬یبر (‪ٔ ٚ )properties‬شؽ‪ٞ‬ب (‪ )methods‬ؼاـؼ)‬
‫اضیاء (‪)object‬‬
‫‪ٕٞ‬بٍ٘‪ ٝ٘ٛ‬و‪ ٝ‬ؼـ اسبق ٌٕب اٌیبء ٔػشّفی ‪ٕٞ‬س‪ٔ ٖٛ‬یك ' ِ‪ٙ‬ؽِی ' سػز ‪ ٚ‬غیف‪ٚ ٜ‬خ‪ٛ‬ؼ ؼاـؼ ؼـ ؼ٘یبی‬
‫ٔدبقی ٘یك اٌیبء ‪ٚ‬خ‪ٛ‬ؼ ؼاـؼ ث‪ٛ٘ ٝ‬ـ ٔثبَ ؼوٕ‪ٞ ٝ‬بیی و‪ ٝ‬ثب ‪ html‬وبغش‪ ٝ‬ایؽ ' وبؼـ‪ٞ‬بیی و‪ ٝ‬ثفای ػىه‬
‫وبغش‪ ٝ‬ایؽ ‪ ٚ‬غیف‪٘ ٜ‬یك ٔف‪ٌ ْٟٛ‬یء ـا ث‪ٔ ٝ‬ب ٔی ـوب٘ؽ)‬
‫اضیاء در جاٍا اسکزیپت‬

‫اٌیبء ؼـ خب‪ٚ‬ا اوىفیذز ث‪ ٝ‬ؼ‪ ٚ‬ؼوش‪ ٝ‬وّی سمىیٓ ٔی ٌ‪٘ٛ‬ؽ‪ 5‬ؼوش‪ ٝ‬ا‪ َٚ‬اٌیبیی ‪ٞ‬ىش‪ٙ‬ؽ و‪ ٝ‬ث‪ٔ ٝ‬طیٗ‬
‫اخفای خب‪ٚ‬ا اوىفیذز سؼّك ؼاـ٘ؽ ایٗ ث‪ٔ ٝ‬ؼ‪ٙ‬یىز و‪ ٝ‬وؽ‪ٞ‬ب اق لجُ ؼـ ٔف‪ٚ‬ـٌفی و‪ٌٕ ٝ‬ب اق آٖ اوشفبؼ‪ٔ ٜ‬ی‬
‫و‪ٙ‬یؽ ث‪ِٛ ٝ‬ـر دیٍففْ ثف ـ‪ٚ‬ی آٖ ‪ٞ‬ب لفاـ ٌففش‪ٌ ٝ‬ؽ‪ ،ٜ‬ؼوش‪ ٝ‬ؼ‪ ْٚ‬اٌیبیی و‪ ٝ‬اق لجُ ؼـ غ‪ٛ‬ؼ خب‪ٚ‬ا‬
‫اوىفیذز سؼفیف ٌؽ‪ ٜ‬ا٘ؽ ‪$‬اٌیبی ؼـ‪ ٖٚ‬وبغز‪)#‬‬

‫ساختار اضیا‬
‫وبغشبـ اٌیب ‪ ٚ‬زٍ‪ٍ٘ٛ‬ی سؼفیف آ٘‪ٟ‬ب ـا ثب سؼفی یه ٔثبَ دی ٔی ٌیفیٓ‪5‬‬
‫ٔثال ثفای وبغز ٌی ‪ car‬اثشؽا آٖ ـا ث‪ِٛ ٝ‬ـر قیف سؼفیف ٔی و‪ٙ‬یٓ ‪5‬‬
‫ٔثبَ ‪52(,‬‬
‫{ )‪function car(seats,engine,theradio‬‬
‫;‪this.seats=seats‬‬
‫;‪this.engine=engine‬‬
‫;‪this.theradio=theradio‬‬
‫}‬
‫ؼـ غٗ ا‪ َٚ‬اق ل‪ٙ‬ؼ‪ ٝ‬وؽ ثبال ٌٕب ٘بْ ٌی ‪ ٚ‬دبـأشف‪ٞ‬بی آٖ ـا ٍٔب‪ٞ‬ؽ‪ٔ ٜ‬ی و‪ٙ‬یؽ ‪ ٚ‬ؼـ غ‪ ٖٛٙ‬ثؼؽی ‪ ٚ‬ثب‬
‫اوشفبؼ‪ ٜ‬اق وّٕ‪ this ٝ‬ا٘‪ٟ‬ب ـا ث‪ٔ ٝ‬ف‪ٚ‬ـٌف ٔی ٌ‪ٙ‬بوب٘یٓ)‬
‫ضبَ ثفای ٔمؽاـ ؼ‪ٞ‬ی ث‪ ٝ‬دبـأشف‪ٞ‬ب ث‪٘ ٝ‬فیك قیف ػُٕ ٔی و‪ٙ‬یٓ ‪5‬‬
‫;)"‪var work_car= new car("cloth","V-6","Tape Deck‬‬
‫اثشؽا یه ٔشغیف ـا سؼفیف وفؼ‪ ٚ ٜ‬وذه ثب اوشفبؼ‪ ٜ‬اق وّیؽ ‪٘ ٚ new‬بْ ٌی اق دیً سؼفیف ٌؽ‪ٔ ٜ‬مبؼیف ـا‬
‫ث‪ٌ ٝ‬ی ٔ‪ٙ‬شىت وفؼ‪ ٚ ٜ‬ؼـ ٔشغیف ؾغیف‪ٔ ٜ‬ی ٕ٘بییٓ)‬
‫‪ ٚ‬ثب اوشفبؼ‪ ٜ‬اق ل‪ٙ‬ؼ‪ ٝ‬وؽ قیف ٌٕب ٔی س‪ٛ‬ایؽ ث‪ٞ ٝ‬ف وؽاْ اق دبـأشف‪ٞ‬ب ؼوشیبثی ؼاٌش‪ ٝ‬ثبٌیؽ ‪5‬‬
‫;‪var engine_type= work_car.engine‬‬

5 ‫ؽ ٌؽ‬ٞ‫ا‬ٛ‫ٓ سف غ‬ٟ‫ لبثُ ف‬ٚ ‫ن سف‬ّٕٛٔ ‫ب ثفای ٌٕب‬ٟ٘‫ اق آ‬ٜ‫ اوشفبؼ‬ٜٛ‫ ٘ط‬ٚ ‫ اق ٔثبَ قیف اٌیب‬ٜ‫ثب اوشفبؼ‬
52(- َ‫ٔثب‬
function car(seats,engine,theradio) {
this.seats=seats;
this.engine=engine;
this.theradio=theradio;
}
var work_car= new car("cloth","V-6","Tape Deck");
var fun_car= new car("leather","V-8","CD Player");
var engine_type= work_car.engine;
var seat_type= fun_car.seats;
var radio_type= fun_car.theradio;
document.write("I want a car with "+seat_type+" seats.<br
/>");
document.write("It also needs a "+engine_type+" engine.<br
/>");
document.write("Oh, and I would like a "+radio_type+" also.");
</script>
52(. َ‫ٔثب‬
this.seats=seats;
this.engine=engine;
}
work_car.engine="V-4";
var custom_car= new
car(fun_car.seats,work_car.engine,fun_car.theradio);
document.write("I want a car with "+custom_car.seats+"
seats.<br />");
document.write("It also needs a "+custom_car.engine+"
engine.<br />");
document.write("Oh, and I would like a "+custom_car.theradio+"
also.");
work_car ‫ یه ٔمؽاـ خؽیؽ ـا ٌی‬work_car.engine="V-4"; ‫ اق‬ٜ‫ ثب اوشفبؼ‬ٚ ‫ وؽ ثبال‬ٝ‫ؼ‬ٙ‫ؼـ ل‬

‫ خبی ٔمؽاـ سؼفیف‬ٝ‫ ٔمؽاـ خؽیؽ ـا ث‬ٝٔ‫یؽ وفؼ ثف٘ب‬ٞ‫ا‬ٛ‫ غ‬ٜ‫ؽ‬ٞ‫ ثب اخفای وؽ ٍٔب‬ٝ‫ـ و‬ٛٙ٘‫ٕب‬ٞ ٚ ٓ‫ی‬ٙ‫اـؼ ٔی و‬ٚ
)‫ؽ‬ٞ‫ ٕ٘بیً ٔی ؼ‬ٜ‫ٌؽ‬
52(/ َ‫ٔثب‬
this.seats=seats;
this.engine=engine;
}
var first_engine=work_car.engine;
work_car.engine="V-4";
var custom_car= new
document.write("At first, I wanted a "+first_engine+"
engine.<br />");
document.write("But after thinking about it a bit:<br />");
document.write("I want a car with "+custom_car.seats+"
seats.<br />");
document.write("It also needs a "+custom_car.engine+"
engine.<br />");
document.write("Oh, and I would like a "+custom_car.theradio+"
also.");
object initializer ‫اسفادُ اس رٍش‬
5 ‫یؽ‬ٙ‫اـؼ و‬ٚ ‫ـر قیف ؼـ وبغشبـ ٌی‬ِٛ ٝ‫ ٔمبؼیف ـا ث‬ٚ ‫ب‬ٞ‫ا٘یؽ دبـأشف‬ٛ‫ي ٌٕب ٔی س‬ٚ‫ؼـ ایٗ ـ‬
52(0 َ‫ٔثب‬
work_car= {seats:"cloth",engine:"V-6",theradio:"Tape Deck"}

fun_car= {seats:"leather",engine:"V-8",theradio:"CD Player"}
52(1 َ‫ٔثب‬
work_car= {seats:"cloth",engine:"V-6",theradio:"Tape Deck"}

fun_car= {seats:"leather",engine:"V-8",theradio:"CD Player"}
document.write("I want a car with "+fun_car.seats+"
seats.<BR>");
document.write("It also needs a "+work_car.engine+"
engine.<BR>");
document.write("Oh, and I would like a "+fun_car.theradio+"
also.");
5 ‫ اق اٌیب‬ٜ‫ـؼ اوشفبؼ‬ٛٔ ‫ٔثبَ ػّٕی ؼـ‬

ٖ‫ ٕ٘بیً ؼاؼ‬ٚ ‫ااوىفیذز ثفای وبغز‬ٚ‫بی خب‬ٞ‫ ؼیٍف وبغشبـ‬ٚ ‫ اق اٌیب‬ٜ‫ اوشفبؼ‬ٜٛ‫ؼـ ٔث بَ قیف ٌٕب ٘ط‬
5 ‫غز‬ٛٔ‫یؽ آ‬ٞ‫ا‬ٛ‫ ـا غ‬#ٚ‫ؼـ‬ٛ‫بی ٔػشّف غ‬ٞ ٍٗ‫دب آد‬ٙ‫ؼـ ای‬$ َ‫ػی غب‬ٛٔٛٔ ‫ـؼ‬ٛٔ ‫ؽ ؼـ‬ٙ‫ا٘الػبر وبـثفدى‬
52(2 َ‫ٔثب‬
function get_payment() {
var the_payment=250;
the_payment += (this.seats == "leather") ? 100 : 50;
the_payment += (this.engine == "V-8") ? 150 : 75;
the_payment += (this.theradio == "CD Player") ? 35 : 10;
return the_payment;
}
this.seats=seats;
this.engine=engine;
this.payment=get_payment;
}
var custom_car= new
var work_car_payment= work_car.payment();
var fun_car_payment= fun_car.payment();
var custom_car_payment= custom_car.payment();
document.write("<h2>The information on the cars you
requested:</h2>");
document.write("<strong>Work Car: </strong>");
document.write(work_car.seats+","+work_car.engine+","+work_car
.theradio);
document.write("<br />");
document.write("<strong>Payments:</strong>
$"+work_car_payment);
document.write("<p>");
document.write("<strong >Fun Car: </strong>");
document.write(fun_car.seats+","+fun_car.engine+","+fun_car.th
eradio);
$"+fun_car_payment);
document.write("</p>");
document.write("<p>");
document.write("<strong>Custom Car: </strong>");
document.write(custom_car.seats+","+custom_car.engine+",");
document.write(custom_car.theradio);
$"+custom_car_payment);
document.write("</p>");
5‫ اق سبثغ قیف ٔی ثبٌؽ‬ٜ‫ ٔثبَ ثبال اوشفبؼ‬ٝ‫ب ٘ىش‬ٟٙ‫س‬
the_payment += (this.seats == "leather") ? 100 : 50;
the_payment += (this.engine == "V-8") ? 150 : 75;
the_payment += (this.theradio == "CD Player") ? 35 : 10;
return the_payment;
}
5 ٓ‫ی‬ٙ‫یىی ٔی و‬ٛ٘‫ ثبق‬if else ‫بی‬ٌٙ‫ـر وبغشبـ آ‬ِٛ ٝ‫شف' آٖ ـا ث‬ٟ‫ ثفای ؼـن ث‬ٝ‫و‬
if(this.seats == "leather") {
the_payment+=100;
}
else {
the_payment+=50;
if(this.engine == "V-8") {
the_payment+=150;
}
else {
the_payment+=75;
}
if(this.theradio == "CD Player") {
the_payment+=35;
}
else {
the_payment+=10;
}
return the_payment;
}
ٖ‫ؼ‬ٛ‫ـر ؼـوز ث‬ِٛ ‫ ؼـ‬ٝ‫ اوز و‬ٜ‫٘ی سؼییٗ ٌؽ‬ٚ‫ ٔی ٕ٘بییؽ ؼـ سبثغ ثبال ٌف‬ٜ‫ؽ‬ٞ‫ ٍٔب‬ٝ‫ـ و‬ٛٙ٘‫ٕب‬ٞ
‫ اوز‬ٜ‫ ٌؽ‬ٝ‫ دیً ففٔی ثفای آٖ ؼـ ٘ظف ٌففش‬ٚ ‫ ای‬ٝ‫ ٔمؽاـ دبی‬ٝ‫ و‬the_payment ‫ ٔشغیف‬ٝ‫ٔمؽاـی ـا ث‬
‫ ٔشغییف‬ٝ‫ ث‬75$ ‫ب ٔمؽاـ‬ٞ‫ـ‬ٛ‫س‬ٛٔ ‫اع‬ٛ٘‫ ثفای وبیف ا‬ٚ 150$ ‫ ٔمؽاـ‬v-8 ‫ـ‬ٛ‫س‬ٛٔ ‫ ٌفؼؼ ٔثال ثفای‬ٝ‫أبف‬
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ ٔمؽاـ آٖ ثفٌٍز ؼاؼ‬return ‫ـ‬ٛ‫ اق ؼوش‬ٜ‫ ؼـ آغف ثب اوشفبؼ‬ٚ ‫ ٌفؼؼ‬ٝ‫ أبف‬the_payment
For – in Loop ‫دستَر‬
)‫ؽ‬ٞ‫ب ـا ٔی ؼ‬ٟ٘‫ ؼوشىبـی ٔمبؼیف آ‬ٚ ً‫بی یه ٌی یب ٕ٘بی‬ٞ‫ دبـأشف‬ٝ‫ ؼوشیبثی ث‬ٜ‫ ٌٕب اخبق‬ٝ‫ـ ث‬ٛ‫ایٗ ؼوش‬
for (var variable_name in object_name) {

JavaScript statements
}
52(3 َ‫ٔثب‬
‫ ؼوشفوی دیؽا‬work_car ‫بی ٌی‬ٞ‫ دبـأشف‬ٝ‫یر وبـ أبفی ث‬ٞ ٖٚ‫ ٌٕب ثؽ‬ٝ‫ؼ و‬ٌٛ ‫ـ قیف ثبػث ٔی‬ٛ‫ؼوش‬
5 ‫ـیؽ‬ٚ‫ ٕ٘بیً ؼـ آ‬ٝ‫ب ـا ث‬ٟ٘‫ آ‬ٚ ‫یؽ‬ٙ‫و‬
this.seats=seats;
this.engine=engine;
}
for (var prop_name in work_car) {
document.write(work_car[prop_name]+"<br />");
}
work_car ‫بی ٌی‬ٞ ‫یمٌی‬ٚ ‫ؽاـی‬ٍٟ٘ ٝ‫ظیف‬ٚ ٝ‫ اوز و‬ٝ‫الغ یه آـای‬ٚ ‫ ؼـ‬work_car[prop_name]
)‫ ؼاـؼ‬ٜ‫ؽ‬ٟ‫ثفای زبح ـا ثفػ‬
The with Statement ‫دستَر‬
)‫ؽ‬ٙ‫ ـا ـاضز سف ٔی و‬ٝ‫بی آـای‬ٞ‫ دبـأشف‬ٝ‫ـ لیُ ؼوشفوی ث‬ٛ‫ؽ ؼوش‬ٙ٘‫ـ ٘یك ٔب‬ٛ‫ایٗ ؼوش‬
52(4 َ‫ٔثب‬
this.seats=seats;
this.engine=engine;
}
with (work_car) {
document.write("Seats: "+seats+"<br />");
document.write("Engine: "+engine+"<br />");
document.write("Radio: "+theradio);
}
‫اضیا اس پیص تؼزیف ضذُ در جاٍا اسکزیپت‬
ٝ‫ ثیٍشف ث‬ٚ ‫شف‬ٟ‫ ٌٕب ثفای ؼوشفوی ث‬ٝ‫ ث‬ٝ‫ؼ ؼاـؼ و‬ٛ‫خ‬ٚ ‫ قیبؼی‬ٜ‫ا اوىفیذز اٌیب اق دیً سؼفیف ٌؽ‬ٚ‫ؼـ خب‬
)‫ؽ‬ٙ٘‫ب یبـی ٔی ـوب‬ٞ‫ ٔشؽ‬ٚ ‫ب‬ٞ‫دبـأشف‬
)‫(اضیا ّذایت گز‬The Navigator Object
ٚ ٖ‫ـل‬ٚ 'ْ‫ؽ ٘ب‬ٙ٘‫ؽ) ٔب‬ٙٞ‫ـٌف وبـثف ـا ٔی ؼ‬ٚ‫ظیٕبر ٔف‬ٙ‫ س‬ٚ ‫ اخكا‬ٝ‫ ؼوشیبثی ث‬ٜ‫ ٌٕب اخبق‬ٝ‫ ث‬navigator ‫اٌیب‬
) ٜ‫غیف‬
Properties
‫ـٌف وبـثف‬ٚ‫ع ٔف‬ٛ٘ ‫ـؼ‬ٛٔ ‫ ا٘الػبسی ؼـ‬ٝ‫ ٌٕب لبثّیز ؼوشفوی ث‬ٝ‫ ث‬navigator object ‫ ؼـ‬Properties
)‫ؽ‬ٞ‫ـا ٔی ؼ‬
)‫یؽ‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ـار ـا ٍٔب‬ٛ‫َ قیف ایٗ ؼوش‬ٚ‫ؼـ خؽ‬
Property Value
appCodeName The code name of the browser
appMinorVersion The name of the browser
appMinorVersion A string representing the minor version of the browser
appMinorVersion
(Internet Explorer only)
appVersion The version of the browser and some other information
browserLanguage The language of the browser being used (Internet Explorer and Opera)
buildID The build identifier of the browser being used (Firefox only)
cookieEnabled Specifies whether or not the browser has cookies enabled
cpuClass A string representing the class of the CPU (Internet Explorer only)
language The language of the browser being used (Firefox and Opera)
mimeTypes An array of MIME types supported by the browser
onLine Specifies whether or not the browser is in “global offline mode”
oscpu A string representing the operating system of the computer (Firefox only)
platform The machine type for which the browser was created
plugins An array of the plugins the browser has installed on it
A string representing the product name of the browser being used
product
(Firefox only)
productSub The build number of the browser being used (Firefox only)
securityPolicy An empty string—returned a value in Netscape 4.7 (Firefox only)
The default language used by the operating system (Internet Explorer
systemLanguage
only)
The natural language of the operating system (Internet Explorer and
userLanguage
Opera)
userAgent The user agent header for the browser
An empty string—returned a string representing the vendor of the
vendor
browser being used (Firefox only)
An empty string—returned the vendor version number of the browser
vendorSub
being used (Firefox only)
ٚ ‫ف ثكـي‬ٚ‫ٌشٗ ضف‬ٛ٘ ٜٛ‫ ٘ط‬ٝ‫ ث‬navigator object ‫ ؼـ‬Properties ‫ اق‬ٜ‫ٍبْ اوشفبؼ‬ٙٞ ‫ ؼـ‬5 ٟٓٔ ٝ‫٘ىش‬
)‫یؽ‬ٙ‫زه ؼلز و‬ٛ‫و‬
52(,+ َ‫ٔثب‬
window.alert("You are using "+navigator.propertyname);
</script>
)‫ وبـ ثجفیؽ‬ٝ‫ ث‬propertyname ‫ خبی‬ٝ‫ا٘یؽ ث‬ٛ‫َ ثبال ـا ٔی س‬ٚ‫بی خؽ‬ٞ ‫ سٕبْ غبِیز‬5 ٝ‫٘ىش‬
52(,, َ‫ٔثب‬
)‫ؽ‬ٞ‫ وبـثف ـا ٕ٘بیً ٔی ؼ‬ٜ‫ـؼ اوشفبؼ‬ٛٔ ‫ـٌف‬ٚ‫ اوٓ ٔف‬ٚ ‫ع‬ٛ٘ ‫وؽ قیف‬
<body>
switch (navigator.appName) {
case "Netscape" : window.alert("Firefox/Netscape is cool.");
break;
case "Microsoft Internet Explorer" : window.alert("Internet
Explorer is Cool.");
break;
case "Opera" : window.alert("Opera is cool."); break;
default : window.alert("What browser is this?");
}
</script>
Hi, and welcome!
</body>
‫هتذّا‬
‫ب‬ٟ٘‫بی ٔػشّف اق آ‬ٞ‫ا٘یؽ ثفای ا٘دبْ وبـ‬ٛ‫ ٔی س‬ٝ‫ ؼاـای سؼؽاؼی ٔشؽ ٘یك ٔی ثبٌؽ و‬Navigator object
) ‫یؽ‬ٙ‫ و‬ٜ‫اوشفبؼ‬
)‫یؽ‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ف وؽاْ ـا ٍٔب‬ٞ ٜ‫ٔیطی ؼـ ثبـ‬ٛ‫ س‬ٚ ‫ب‬ٟ٘‫َ قیف اوبٔی آ‬ٚ‫ؼـ خؽ‬
Method Purpose
javaEnabled() Used to test whether or not Java is enabled in the browser
mozIsLocallyAvailable() Checks to see if a file at a certain address is available locally
(Firefox only)
preference() Allows certain browser preferences to be set (requires signed
script)
registerContentHandler() Allows a Web site to set itself as a potential handler of a certain
MIME type
registerProtocolHandler() Allows a Web site to set itself as a potential handler of a certain
protocol
taintEnabled() Returns false— because the method is no longer being in use. It
was used to specify whether or not data tainting was enabled in
the browser
52(,- َ‫ٔثب‬
)‫ب ـا ؼاـؼیب غیف‬ٞ ‫ ٕ٘بیً اوىفیذز‬ٜ‫ـٌف ٌٕب اخبق‬ٚ‫ آیب ٔف‬ٝ‫ؽ و‬ٙ‫وؽ قیف ٍٔػُ ٔی و‬
var hasJava= navigator.javaEnabled()

if (hasJava==true) {
window.alert("Cool, you have Java!");
}
else {
window.alert("Java disabled? You cannot see my Java Applet!");
}
The History Objet
‫ـٌف‬ٚ‫ خبـی ٔف‬ٝ‫ ِفط‬ٝ‫ـؼ سبـیػس‬ٛٔ ‫ ا٘الػبسی ـا ؼـ‬ٚ ‫ ٔیجبٌؽ‬windows ‫ایٗ ٌی ؼـ ضمیمز خكء اٌیب‬
)‫ؽ‬ٙ‫ٓ ٔی و‬ٞ‫ففا‬
52(,. َ‫ٔثب‬
<body>
alert("Your current window has viewed "+history.length+"
pages!")
</script>
</body>
ِ‫هتذّای ضیء تاریخچ‬
5‫ اوز‬ٜ‫ ٌؽ‬ٜ‫ـؼ‬ٚ‫ ٔشؽ ثفای ایٗ ٌیء آ‬ٝ‫َ قیف و‬ٚ‫ؼـ خؽ‬
Method Purpose
Back() Sends the
browser window back one page in the history list
Forward() Sends the browser one page forward in the history list
Go() Sends the browser to a specified page in the history list using an integer
value
The back() Method
ٝ‫ لجُ اق ِفط‬ٝ‫ خبـی ؼـ ِیىز سبـیػس‬ٝ‫ لجُ اق ِفط‬ٜ‫ ٌؽ‬ٜ‫ ؼیؽ‬ٝ‫ آغفیٗ ِفط‬ٝ‫ـٌف ـا ث‬ٚ‫ایٗ ٔشؽ ٔف‬
)‫خبـی ٔی ففوشؽ‬
52(,/ َ‫ٔثب‬
<body>
<form>
<input type="button" value="Back" id="back_button" />
</form>
<script type="text/javascript" >
var bb = document.getElementById("back_button");
bb.onclick = function() {
history.back();
};
</script>
</body>
The forward() Method
)‫ خبـی ٔی ففوشؽ‬ٝ‫ ثؼؽ اق ِفط‬ٝ‫ ؼـ ِیىز سبـیػس‬ٜ‫ ٌؽ‬ٝ‫ لفاـ ٌففش‬ٝ‫ ِفط‬ٝ‫ـٌف ـا ث‬ٚ‫ایٗ ٔشؽ ٔف‬
52(,0 َ‫ٔثب‬
<body>
<form>
<input type="button" value="Back" id="back_button" /><br />
<input type="button" value="Forward" id="forward_button" />
</form>
var bb = document.getElementById("back_button");
var fb = document.getElementById("forward_button");
bb.onclick = function() {
history.back();
};
fb.onclick = function() {
history.forward();
};
</script>
</body>
‫‪The go() Method‬‬

‫ث‪ ٝ‬ا٘ؽاق‪ ٜ‬ػؽؼی و‪ ٝ‬ث‪ ٝ‬ػ‪ٛٙ‬اٖ دبـأشف ؼـیبفز ٔی و‪ٙ‬ؽ ؼـ ِیىز سبـیػس‪ ٝ‬خبث‪ ٝ‬خب ٔی ٌ‪ٛ‬ؼ)‬
‫ٔثبَ ‪52(,1‬‬
‫;)‪history.go(-2‬‬
‫وؽ ثبال ؼ‪ِ ٚ‬فط‪ ٝ‬ؼـ ِیىز سبـیػس‪ٔ ٝ‬ف‪ٚ‬ـٌف ث‪ ٝ‬ػمت ثف ٔیٍفؼؼ)‬

DOM : ‫فصل ّطتن‬
DOM‫هذل ضی گزای سٌذ ؛‬
ٖ‫ آ‬ّٝ‫وی‬ٚ ٝ‫ ث‬ٝ‫ا اوىفیذز اوز' و‬ٚ‫یىی خب‬ٛ٘ ٝٔ‫ٓ سفیٗ خكء ثف٘ب‬ٟٔ DOM ٝ‫اٖ ٌفز و‬ٛ‫ خفار ٔی س‬ٝ‫ث‬
‫ خب‬ٝ‫ؽ خبث‬ٙ٘‫یٓ ٔب‬ٙ‫ب ـا ؼوشىبـی و‬ٟ٘‫ ثبٌیٓ ' آ‬ٝ‫ ؼوشفوی ؼاٌش‬ٝ‫ؼ ؼـ ِفط‬ٛ‫خ‬ٛٔ ‫بِف‬ٙ‫ ػ‬ٝ‫ؼ ث‬ٛ‫یٓ ث‬ٞ‫ا‬ٛ‫لبؼـ غ‬
)‫ب‬ٟ٘‫ وفؼٖ آ‬ٝ‫ أبف‬ٚ ‫ ضؿف‬ٚ ٖ‫وفؼ‬
‫بیی‬ٞ ‫ي‬ٚ‫ وذه ـ‬ٚ ‫یٓ دفؼاغز‬ٞ‫ا‬ٛ‫ غ‬DOM‫یٓ اثشؽایی‬ٞ‫ سٍفیص ٔفب‬ٝ‫ وؽ قیف اثشؽا ث‬ٝ‫ؼ‬ٙ‫ اق ل‬ٜ‫ثب اوشفبؼ‬
) ‫یٓ ؼاؼ‬ٞ‫ا‬ٛ‫ٔیص غ‬ٛ‫ ـا س‬ٜ‫ٓ وفؼ‬ٞ‫ ـا ففا‬ٝ‫ؼ ؼـ ِفط‬ٛ‫خ‬ٛٔ ‫بِف‬ٙ‫ ثفای ؼوشىبـی ػ‬ٝ‫و‬
53(, َ‫ٔثب‬
<html>
<head>
<title>DOM </title>
</head>
<body>
<h1> Learning DOM </h1>
<p>
The document object is an object that is created by the
browser for each new HTML page
(document) that is viewed.
For more information visit :
<a href=http://www.dlp.lxb.ir/ rel="external">Dehloran PC</a>
<a href="http://www.quirksmode.org/" rel="external">PPK</a>
and
<a href="http://adactio.com/" rel="external">Jeremy
Keith</a>
</p>
</body>
</html>
‫ایٗ وؽ ـا ٔی س‪ٛ‬اٖ ث‪ِٛ ٝ‬ـر قیف ٕ٘بیً ؼاؼ ‪5‬‬
‫ؼـ ؼـغز ثبال ‪ٞ‬ف ٔىش‪ٙ‬یُ ث‪ ٝ‬ػ‪ٛٙ‬اٖ یه ٌف‪ ٜ‬ؼـ ٘ظف ٌففش‪ٔ ٝ‬ی ٌ‪ٛ‬ؼ ‪ ٚ‬ؼـ ـیٍ‪ ٝ‬آٖ ٌف‪document ٜ‬‬
‫لفاـ ؼاـؼ و‪ٕٞ ٝ‬یٍ‪ ٝ‬ؼـ ثبالسفیٗ و‪ٙ‬ص ؼـغز لفاـ ٔی ٌیفؼ)‬
‫‪element‬‬
‫ٌف‪ٞ‬ی و‪ٌ ٝ‬بُٔ یه ػ‪ّٙ‬ف اق ِفط‪ ٝ‬ثبٌؽ ‪.‬ایٗ ٌف‪ٌ ٜ‬بُٔ یه سً آغبقی ‪ ٚ‬یه سً دبیب٘ی ٔب٘‪ٙ‬ؽ‬
‫>‪ <tag></tag‬یب >‪ <tag /‬اوز‪ .‬ایٗ ٘‪ٛ‬ع ٌف‪ ٜ‬س‪ٟٙ‬ب ٘‪ٛ‬ػی اوز و‪ٔ ٝ‬ی س‪ٛ‬ا٘ؽ ٌبُٔ ففق٘ؽاٖ اق ا٘‪ٛ‬اع ؼیٍف ثبٌؽ ‪.‬‬
‫ٌفش‪ٔ ٝ‬ی ٌ‪ٛ‬ؼ‪.‬‬ ‫ث‪ ٝ‬ایٗ ٌف‪ٞ ٜ‬ب ‪ٌ ،‬ف‪ ٜ‬ػ‪ّٙ‬فی‬
‫‪text‬‬
‫ایٗ ٘‪ٛ‬ع ٌف‪ٞ ٜ‬ب ث‪ٔ ٝ‬شٗ ٔ‪ٛ‬خ‪ٛ‬ؼ ؼـ ؼاغُ یه سً آغبقی ‪ ٚ‬سً دبیب٘ی اٌبـ‪ ٜ‬ؼاـ٘ؽ ‪.‬ایٗ ٘‪ٛ‬ع ٌف‪ٞ ٜ‬ب ‪ٕ٘ ٓٞ‬ی‬
‫س‪ٛ‬ا٘‪ٙ‬ؽ ففق٘ؽ ؼاٌش‪ ٝ‬ثبٌ‪ٙ‬ؽ‪ .‬ث‪ ٝ‬ایٗ ٘‪ٛ‬ع ٌف‪ٞ ٜ‬ب ‪ٌ ،‬ف‪ٔ ٜ‬ش‪ٙ‬ی ٔی ٌ‪ٛ‬ی‪ٙ‬ؽ ‪.‬اٌف ٌف‪ٞ ٜ‬بی ٔش‪ٙ‬ی ـا ‪ ٓٞ‬ث‪ٔ ٝ‬ثبِی و‪ٝ‬‬
‫ٔب ث‪ٌ ٝ‬ىُ قیف سجؽیُ غ‪ٛ‬ا‪ٞ‬ؽ ٌؽ‪:‬‬ ‫ثفـوی وفؼیٓ أبف‪ ٝ‬و‪ٙ‬یٓ ؼـغز‬

‫‪attr‬‬
‫ٌف‪ ٜ‬ای و‪ ٝ‬ث‪ ٝ‬یه ِفز اق یه ػ‪ّٙ‬ف اٌبـ‪ٔ ٜ‬ی و‪ٙ‬ؽ ‪ ٚ‬فبلؽ ففق٘ؽ ٔی ثبٌؽ ‪.‬ث‪ ٝ‬ایٗ ٘‪ٛ‬ع ٌف‪ٞ ٜ‬ب ‪ٌ ،‬ف‪ٜ‬‬
‫ِفشی ٌفش‪ٔ ٝ‬ی ٌ‪ٛ‬ؼ) ؼـ ؼـغز ‪ٔ DOM‬ؼٕ‪ٛ‬ال ایٗ ٌف‪ٞ ٜ‬ب ـا ث‪ِٛ ٝ‬ـر ؼایف‪ ٜ‬ای ‪ٔ ٚ‬شُّ ث‪ٌ ٝ‬ف‪ٞ ٜ‬بی‬
‫ػ‪ّٙ‬فی ٕ٘بیً ٔی ؼ‪ٙٞ‬ؽ ‪.‬ث‪ ٝ‬ػ‪ٛٙ‬اٖ ٔثبَ ‪ٞ‬ف یه اق ػ‪ٙ‬بِف ِی‪ٙ‬ىی و‪ ٝ‬ؼـ ٔثبَ ثبال ٍٔب‪ٞ‬ؽ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ ؼاـای‬
‫ِفز ‪ٞ‬بی ‪ rel‬و ‪ٞ href‬ىش‪ٙ‬ؽ و‪ٔ ٝ‬ی س‪ٛ‬اٖ آٖ ‪ٞ‬ب ـا ث‪ِٛ ٝ‬ـر قیف ٕ٘بیً ؼاؼ‪:‬‬
‫‪comment‬‬
‫ث‪ٌ ٝ‬ف‪ٞ ٜ‬بی س‪ٔٛ‬یطی اٌبـ‪ٔ ٜ‬ی و‪ٙ‬ؽ ‪ ٚ‬فبلؽ ففق٘ؽ اوز‪ .‬غبِجب ٌف‪ٞ‬ی اِّی ث‪ ٝ‬ػ‪ٛٙ‬اٖ ـان ایٗ ؼـغز‬
‫‪ٚ‬خ‪ٛ‬ؼ ؼاـؼ و‪ٕٞ ٝ‬بٖ‪ document‬اوز‪.‬‬
‫استفادُ اس ٍیژگی ّای هذل ضی گزای سٌذ‬
‫‪ DOM‬ایٗ اخبق‪ ٜ‬ـا ث‪ ٝ‬خب‪ٚ‬ا اوىفیذز ٔی ؼ‪ٞ‬ؽ سب ث‪ ٝ‬وبغشبـ و‪ٙ‬ؽ ؼـ ٔف‪ٚ‬ـٌف ؼوشفوی دیؽا و‪ٙ‬ؽ)‪ ٚ‬ایٗ‬
‫وبـ ـا ثب اوشفبؼ‪ ٜ‬اق ‪ٚ‬یمٌی ‪ٞ‬بیی ا٘دبْ ٔی ؼ‪ٞ‬ؽ و‪ ٝ‬ؼـ خؽَ قیف آ‪ٚ‬ـؼ‪ٌ ٜ‬ؽ‪ ٜ‬ا٘ؽ)‬

Property Description
activeElement Returns a string holding the value of the active element in the document
alinkColor Returns the hexadecimal value of the active link color of the document
anchors An array of all the named anchors in the document
async Used to tell the browser whether to load a document with an
asynchronous request or a synchronous request
applets An array of all the Java applets in a document
bgColor Returns the hexadecimal value of the background color of the document
body Returns the body or frameset element of the document
characterSet Returns a string value that represents the character set used to encode
the document
charset Returns a string value that represents the character set used to encode
the document
childNodes An array of all of the child nodes of the document
compatMode Returns the string “BackCompat” if the document is rendered in Quirks
modor the string “CSS1Compat” if the document is rendered in Strict
mode
contentType Returns a string for the Content-Type from the MIME header of the
document
cookie Used to set JavaScript cookies in a document
defaultCharset Returns a string value that represents the default character set used to
encode the documen
defaultView References the window object for the document
designMode Returns a string value that provides information on whether or not the
document can be edited
dir Returns a string value that represents the reading direction of the
document
doctype Returns the doctype declaration associated with the document
documentElement Returns a string representing the root node of the document
documentURIObje Returns an object representing the URI of the document (only available
ct to privileged JavaScript code)
domain Returns the domain name of the server for the document
embeds An array of all the embed tags in the document
expando Returns a Boolean value based on whether or not arbitrary variables can
be created within the document
fgColor Returns the hexadecimal value of the default text color of the document
fileCreatedDate Returns the date the document was created
fileModifiedDate Returns the date the document was last modified
formName Not a property itself, but creates a new property with each named form
placedin the document
forms An array of all the form tags in a document
frames An array of all of the frames used in the document
height Returns the height, in pixels, of the body element of the document
images An array of all the image (img) tags in the documen
implementation Returns a string value representing the implementation object of the document
inputEncoding Returns a string representing the document’s encoding

lastModified Returns the date of the last modification of the document
layers An array of all the layer tags on the page (Netscape Navigator 4 only)
all Allows access to all the objects on a page
linkColor Returns the hexadecimal
value of the default link color for the document
location Returns the URI of the document
links An array of all the link (<a>) tags in the document
namespaces An array of all the namespaces in the document
parentWindow Returns a reference to the parent window (the parent window’s
document object)
plugins An array of all the plugins used in the document
protocol Returns the protocol portion of the Web address (URL) of the
document
readyState Returns a string value that represents the current state of the document
referrer Returns the URL of the document that referred the viewer to the current
document
scripts An array of all the script tags used in the document
styleSheets An array of all the style sheets used in the document
tags Sets the style of an HTML tag in the document
title Returns the text used inside the title tags of the document
uniqueID Returns a string value that represents a unique ID given to the
document
URL Returns the URL of the current document
URLUnencoded Returns the URL of the document without any encoding
vlinkColor Returns the hexadecimal value of the visited link color for the
document
width Returns the width, in pixels, of the body element of the document
The Color Properties
‫بؼ ٔی‬ٍٟٙ‫ دی‬ٝ‫ؼ) اِجش‬ٚ‫ غیفع ثىبـ ٔی ـ‬ٚ ‫ب‬ٟ‫ى‬ٙ‫یٗ ـً٘ ِی‬ٙ‫ٕس‬ٞ ٚ ٝٙ‫ایٗ غبِیز ثفای ـً٘ ده*دیً قٔی‬
)‫یؽ‬ٞ‫ یب سغییف ؼ‬ٚ ‫ اػٕبَ ٕ٘بییؽ‬CSS ‫ب ـا ؼـ‬ٞ ‫یمٌی‬ٚ ٗ‫ ای‬ٝ‫ؼ و‬ٌٛ
The anchors Property (Array)
)‫( ـا ثفٔی ٌفؼا٘ؽ‬such as <a name=“top”>) ‫ؽ‬ٙ٘‫ؽ ٔب‬ٙ‫ؼ ؼـ و‬ٛ‫خ‬ٛٔ anchor ‫بی‬ٞ ْ‫ ای اق سٕبْ ٘ب‬ٝ‫آـای‬
5 3(- َ‫ٔثب‬
<body>
<h1>My Page</h1>
<a name="sec1"></a>
<h2>Section 1</h2>
This section is all about section 1 stuff...

<a name="sec2"></a>
<h2>Section 2</h2>
This section talks about all the section 2 issues and ...
<br />
document.write("There are "+document.anchors.length+" named
anchors");
</script>
</body>
)‫ؽ آٔؽ‬ٞ‫ا‬ٛ‫ ٕ٘بیً ؼـ غ‬ٝ‫ ث‬anchor ‫بی‬ٍٟ‫ سؼؽاؼ س‬ٝ‫یؽ وفؼ و‬ٞ‫ا‬ٛ‫ غ‬ٜ‫یؽ‬ٞ‫ق ٍٔب‬ٛ‫ثب اخفای وؽ ف‬
1
The cookie Property
‫ ٔی‬ٜ‫ ٌىُ قیف اوشفبؼ‬ٝ‫ ث‬document ‫ ٌی‬.cookie ‫ااوىفیذز اق غبِیز‬ٚ‫ب ؼـ خب‬ٟ‫وی‬ٛ‫ثفای ایدبؼ و‬
:ٓ‫ی‬ٙ‫و‬
document.cookie = "name=value; expires=Date; path=path;

domain=domain";
:‫یٓ وفؼ‬ٞ‫ا‬ٛ‫ ٌىُ قیف ػُٕ غ‬ٝ‫ ث‬ٜ‫بی اق لجُ ایدبؼ ٌؽ‬ٞ ‫وی‬ٛ‫ ثفای ثبقیبثی سٕبٔی و‬ٚ
var x = document.cookie;
.‫ مطالة مثحث کًکی عیىا از فصلی تا َمیه وام از کتاب آمًزش کارتردی جايا اسکریپت وًشتٍ آقای احمذ تادپی آيردٌ شذٌ اوذ‬: ٍ‫وکت‬ .1
‫‪ٕٞ‬ب٘‪ٛٙ‬ـ و‪ ٝ‬ؼـ ؼوش‪ٛ‬ـ اثشؽایی ٔی ثی‪ٙ‬یؽ ثفای ایدبؼ و‪ٛ‬وی ٔی ثبیىز ـٌش‪ ٝ‬ای ضب‪ٚ‬ی یىىفی غ‪ٛ‬اَ‬
‫‪ٔ ٚ‬مبؼیفٌبٖ ـا ؼـ لبِت خفز ‪ٞ‬بی ‪ name=value‬ث‪ ٝ‬غبِیز ‪٘ .cookie‬ىجز ؼ‪ٞ‬یٓ‪ .‬ؼـ خؽ‪ َٚ‬قیف ‪ٞ‬ف‬
‫یه اق ایٗ لىٕز ‪ٞ‬ب ـا ٌفش ٔی ؼ‪ٞ‬یٓ‪.‬‬
‫هثال‬ ‫تَضیحات‬ ‫خاصیت‬

‫‪name = ali‬‬ ‫ایٗ ؼوش‪ٛ‬ـ ٘بْ ‪ٔ ٚ‬مؽاـ و‪ٛ‬وی ـا ٍٔػُ‬ ‫‪name = value‬‬
‫ٔی و‪ٙ‬ؽ)‬
‫=‪expires‬‬ ‫ایٗ غبِیز اغشیبـی قٔبٖ ا٘مٕبی‬ ‫‪expires = date‬‬
‫‪13/06/2003 00:00:00‬‬ ‫و‪ٛ‬وی ـا ٍٔػُ ٔیى‪ٙ‬ؽ ‪ٔ.‬مؽاـی‬
‫و‪ ٝ‬ث‪ ٝ‬ایٗ غبِیز ؼاؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ‬
‫ٔی ثبیىز سبـیػی ث‪ ٝ‬ففٔز‬
‫ثبقٌٍشی اق ٔشؽ‬
‫)(‪ٌoGMTString‬ی ‪Date‬‬
‫ثبٌؽ‪ .‬ؼـ ِ‪ٛ‬ـسی و‪ ٝ‬ایٗ غبِیز‬
‫ٍٔػُ ٍ٘‪ٛ‬ؼ ‪ٍٙٞ‬بٔی و‪ ٝ‬وبـثف‬
‫د‪ٙ‬دف‪ٔ ٜ‬ف‪ٚ‬ـٌف ـا ثج‪ٙ‬ؽؼ و‪ٛ‬وی ٘یك‬
‫اق ثیٗ غ‪ٛ‬ا‪ٞ‬ؽ ـفز‪.‬‬
‫‪path=/tutorials/‬‬ ‫ایٗ غبِیز اغشیبـی ٘بْ ٔىیفی‬ ‫‪path=path‬‬
‫اق وبیز ـا و‪ٔ ٝ‬ی س‪ٛ‬ا٘ؽ ث‪ٝ‬‬
‫و‪ٛ‬وی ‪.‬ؼوشفوی ؼاٌش‪ ٝ‬ثبٌؽ ـا‬
‫ٍٔػُ ٔی و‪ٙ‬ؽ‬
‫‪domain = mysite.com‬‬ ‫ایٗ غبِیز اغشیبـی ٘بْ وبیشی‬ ‫‪domain=domain‬‬
‫و‪ٔ ٝ‬ی س‪ٛ‬ا٘ؽ اق و‪ٛ‬وی اوشفبؼ‪ٜ‬‬
‫و‪ٙ‬ؽ ـا ‪ٍٔ.‬ػُ ٔی و‪ٙ‬ؽ)‬
‫ٔثبَ ‪5 3(.‬‬
‫ؼـ ٔثبَ قیف یه و‪ٛ‬وی ثب ٘بْ ‪ ٚ username‬ثب ٔمؽاـ ‪ ali‬و‪ ٝ‬ؼـ سبـیع ‪ 15/02/2010‬اق ثیٗ ٔی ـ‪ٚ‬ؼ‬
‫ایدبؼ ٔی ٌ‪ٛ‬ؼ‪:‬‬
‫‪document.cookie = " username = ali ; expires = 15/02/2010‬‬

‫;" ‪00:00:00‬‬

‫ٔثبَ ‪5 3(/‬‬
‫ؼـ ٔثبَ قیف یه و‪ٛ‬وی ثب ٘بْ ‪ ٚ myCookie‬ثب ٔمؽاـ ‪ this is my cookie‬ایدبؼ ٌؽ‪ ٜ‬اوز‪:‬‬
‫;)”‪document.cookie = “myCookie=” + escape(“This is my Cookie‬‬
‫٘ىش‪: ٝ‬ؼـ وؽ ف‪ٛ‬ق سبثغ )(‪.escape‬یه ـٌش‪ ٝ‬ـا ؼـیبفز وفؼ‪ ٚ ٜ‬سٕبٔی وبـاوشف‪ٞ‬بی ٘بٔؼشجف آٖ ـا ث‪ ٝ‬وؽ‬
‫ٔؼبؼًِ سجؽیُ ٔی و‪ٙ‬ؽ ‪.‬لجُ اق وؽ ٔؼبؼَ یه ػالٔز ‪ %‬لفاـ ٔی ٌیفؼ ‪.‬ث‪ ٝ‬ػ‪ٛٙ‬اٖ ٔثبَ ایٗ سبثغ وبـاوشف‬
‫‪ space‬ـا ث‪ ٝ‬وؽ ‪ 20%‬سجؽیُ ٔی و‪ٙ‬ؽ ‪.‬ایٗ سبثغ ٔؼبؼَ سبثغ )(‪.encodeURIComponent‬اوز‪.‬‬
‫حذف کَکی ّا‬
‫ثفای ضؿف یه و‪ٛ‬وی ٔی س‪ٛ‬اٖ اق سبثؼی و‪ ٝ‬قٔبٖ ا٘مٕبی و‪ٛ‬وی ـا ث‪ ٝ‬یه ثب٘ی‪ ٝ‬لجُ س‪ٙ‬ظیٓ ٔی و‪ٙ‬ؽ‬
‫اوشفبؼ‪ ٜ‬و‪ٙ‬یٓ ‪.‬ایٗ سبثغ ث‪ِٛ ٝ‬ـر قیف اوز‪:‬‬
‫ٔثبَ ‪5 3(0‬‬
‫) ‪function delete_cookie ( cookie_name‬‬

‫{‬
‫‪var cookie_date = new Date ( ); // current date & time‬‬
‫;) ‪cookie_date.setTime ( cookie_date.getTime() - 1‬‬
‫‪document.cookie = cookie_name += "=; expires=" +‬‬
‫;)(‪cookie_date.toGMTString‬‬
‫}‬
‫ضبَ وبفی اوز ثفای ضؿف یه و‪ٛ‬وی ٘بْ آٖ ـا ثفای سبثغ ف‪ٛ‬ق ثففوشیٓ ‪.‬ؼوش‪ٛ‬ـ قیف و‪ٛ‬وی ثب ٘بْ‬
‫‪ username‬ـا ضؿف ٔی و‪ٙ‬ؽ‪:‬‬
‫; )"‪delete_cookie ("username‬‬

‫تاسیاتی کَکی ّا‬
‫ضبَ و‪ ٝ‬ثب ایدبؼ ‪ ٚ‬ضؿف وفؼٖ و‪ٛ‬وی ‪ٞ‬ب آٌ‪ٙ‬ب ٌؽیٓ ٘ط‪ ٜٛ‬ثبقیبثی ‪ٚ‬ؼوشفوی ث‪ ٝ‬آ٘‪ٟ‬ب ـا ثیبٖ ٔی و‪ٙ‬یٓ ‪.‬‬
‫ثفای ثبقیبثی و‪ٛ‬وی ‪ٞ‬بیی و‪ ٝ‬لجال ایدبؼ ٌؽ‪ ٜ‬ا٘ؽ ثبق ‪ ٓٞ‬اق غبِیز ‪ٌ .cookie‬ی ‪ document‬ث‪ِٛ ٝ‬ـر‬
‫قیف اوشفبؼ‪ٔ ٜ‬ی و‪ٙ‬یٓ‪:‬‬
‫;‪var x = document.cookie‬‬
‫ایٗ ؼوش‪ٛ‬ـ ِیىشی اق خفز ‪ٞ‬بی ‪ name=value‬سٕبٔی و‪ٛ‬وی‪ٟ‬بی لبثُ ؼوشفن ثفای و‪ٙ‬ؽ خبـی ـا و‪ٝ‬‬
‫ثب ; اق ‪ ٓٞ‬خؽا ٌؽ‪ ٜ‬ا٘ؽ ثفٔی ٌفؼا٘ؽ ) ث‪ ٝ‬ػ‪ٛٙ‬اٖ ٔثبَ ٔشغیف ‪ٔ x‬ی س‪ٛ‬ا٘یؽ ضب‪ٚ‬ی ـٌش‪ ٝ‬ای ث‪ِٛ ٝ‬ـر قیف‬
‫ثبٌؽ‪:‬‬
‫ٔثبَ ‪5 3(1‬‬
‫"‪"username = ali; password = abc123‬‬
‫ؼـ ایٗ ٔثبَ ؼ‪ ٚ‬و‪ٛ‬وی اق لجُ ایدبؼ ٌؽ‪ ٜ‬اوز ‪:‬یىی ثب ٘بْ ‪ٔ ٚ username‬مؽاـ ‪ ٚ ali‬ؼ‪ٔٚ‬ی ثب ٘بْ‬
‫‪ password‬ثب ٔمؽاـ ‪.abc123‬‬
‫او‪ x ٖٛٙ‬یه ٔشغیف ـٌش‪ ٝ‬ای وبؼ‪ ٜ‬اوز و‪ٔ ٝ‬ی س‪ٛ‬ا٘یٓ ثفای ؼوشفوی ث‪ٞ ٝ‬ف یه اق و‪ٛ‬وی ‪ٞ‬ب ‪ٚ‬‬
‫ٔمؽاـٌبٖ اثشؽا ‪ x‬ـا ث‪ٛ‬ویّ‪ٔ ٝ‬شؽ ‪ٌ split‬ی ‪ string‬ث‪ ٝ‬آـای‪ ٝ‬ای سجؽیُ وفؼ‪ ٚ ٜ‬ث‪ٛ‬ویّ‪ٔ ٝ‬شؽ‪ٞ‬بی غبَ آـای‪ٝ‬‬
‫ث‪ ٝ‬آٖ ‪ٞ‬ب ؼوشفوی ؼاٌش‪ ٝ‬ثبٌیٓ ‪.‬ث‪ ٝ‬ػ‪ٛٙ‬اٖ ٔثبَ ثفای زبح ٔمؽاـ و‪ٛ‬وی ‪ٞ‬بی ف‪ٛ‬ق ٔی س‪ٛ‬اٖ ث‪ِٛ ٝ‬ـر قیف‬
‫ػُٕ وفؼ‪:‬‬
‫ٔثبَ ‪5 3(2‬‬
‫‪var‬‬ ‫;‪allCookie = document.cookie‬‬

‫‪Var‬‬ ‫;)";"(‪cookieParts = allCookie.split‬‬
‫‪Var‬‬ ‫;]‪fistCookie = cookieParts[0‬‬
‫‪Var‬‬ ‫;]‪secondCookie = cookieParts[1‬‬
‫‪Var‬‬ ‫;]‪nameOfFirstCookie = firstCookie.split("=")[0‬‬
‫‪Var‬‬ ‫;]‪valueOfFirstCookie = firstCookie.split("=")[1‬‬
‫‪Var‬‬ ‫;]‪nameOfSecondCookie = firstCookie.split("=")[0‬‬
‫‪Var‬‬ ‫;]‪valueOfSecondCookie = firstCookie.split("=")[1‬‬

The domain Property

‫ ـا ثفٔی ٌفؼا٘ؽ‬ٝ‫ ِفط‬ٜ‫ؽ‬ٙٞ‫ ؼ‬ٝ‫اوٓ وبیز اـائ‬
5 3(3 َ‫ٔثب‬
<body>
window.alert("You have reached the "+document.domain+"
domain!");
</script>
</body>
‫ٍؽاـ قیف ـا ثف ٔی‬ٞ ‫ ثبٌؽ‬ٝ‫ لفاـ ٌففش‬dlp.lxb.ir 5 ‫فیه اق ِفطبر یه وبیز ٔثال‬ٞ ‫اٌف ایٗ وؽ ؼـ‬
5‫ٌفؼا٘ؽ‬
“You have reached the dlp.lxb.ir domain!”
The formname Property
‫ وبـ ٔی آیؽ‬ٝ‫ قٔب٘ی ث‬ٝ‫ؼ یه غبِیز ٘یىز) ثّى‬ٛ‫ؼی غ‬ٛ‫ غ‬ٝ‫الغ ث‬ٚ ‫ ؼـ‬The formname Property
ٚ ٜ‫ ٔثبَ قیف ؼلز وفؼ‬ٝ‫ّت ث‬ٙٔ ٖ‫ ٌؽ‬ٝ‫خ‬ٛ‫ ثبٌیؽ ثفای ٔش‬ٝ‫ سجغ آٖ ٘بْ یه ففْ ـا ؼاٌش‬ٝ‫ ث‬ٚ ْ‫ ٌٕب یه فف‬ٝ‫و‬
5 ‫آٖ ـا اخفا ٕ٘بییؽ‬
5 3(4 َ‫ٔثب‬
<body>
<form name="funform">
<input type="button" name="funb" value="You can click me I
suppose"
onclick="document.funform.funb.value='Thanks, you clicked
me!';" />
</form>
</body>
The lastModified Property
)‫ ـا ثفٔی ٌفؼا٘ؽ‬ٝ‫ وبػز آغفیٗ سغییف ؼـ ِفط‬ٚ ‫یمٌی سبـیع‬ٚ ٗ‫ای‬
5 3(,+ َ‫ٔثب‬
<body>
<h1>My Always Updated Web Page!</H1>
document.write("Last Updated: "+document.lastModified);
</script>
</body>
The layers Property (Array)
)‫ؽ‬ٙ‫ ٘ز اوىیخ وٕه و‬ٝ‫بی ثف دبی‬ٞ‫ـٌف‬ٚ‫بوبیی ٔف‬ٌٙ ‫ ٌٕب ثفای‬ٝ‫ا٘ؽ ث‬ٛ‫ٔی س‬
5 3(,, َ‫ٔثب‬
if (document.layers) {
window.alert("You have Netscape Navigator 4!");
}
The all Property
)‫ؽ‬ٙ‫ــوٕه و‬ّٛ‫شف٘ز اوىذ‬ٙ‫ـٌف ای‬ٚ‫بوبیی ٔف‬ٌٙ ‫ ٌٕب ثفای‬ٝ‫ا٘ؽ ث‬ٛ‫ٔی س‬
5 3(,- َ‫ٔثب‬
if (document.all) {
window.alert("You have Internet Explorer 4 or better!");
}
The links Property (Array)
)‫ی‬ٙ‫بوبیی و‬ٌٙ ‫ ـا‬ٝ‫ؼ ؼـ ِفط‬ٛ‫خ‬ٛٔ ‫بی‬ٞ ‫ه‬ٙ‫ا٘یؽ سؼؽاؼ ِی‬ٛ‫ اق ایٗ غبِیز ٌٕب ٔی س‬ٜ‫ثب اوشفبؼ‬
5 3(,. َ‫ٔثب‬
<body>
<a href="http://www.dlp.lxb.ir" >
<a href="http://www.dlp.loxblog.com">
document.write(document.links.length);
</script>
</body>
The title Property
)‫خی ثفٔی ٌفؼا٘ؽ‬ٚ‫اٖ غف‬ٛٙ‫ ػ‬ٝ‫ ـا ث‬ٝ‫اٖ ِفط‬ٛٙ‫یمٌی ػ‬ٚ ٗ‫ای‬
5 3(,/ َ‫ٔثب‬
<head>
<title>JavaScript!</title>
</head>
<body>
document.write("<h1>" + document.title + "</h1>");
</script>
Learning javascript with us!
</body>
The URL Property
)‫ خبـی ـا ثفٔی ٌفؼا٘ؽ‬ٝ‫آؼـن وبُٔ ِفط‬

5 3(,0 َ‫ٔثب‬
<body>
<h1>Buy Something!</h1>
If you don't buy something I will be really upset so you had
better...
<br/><br/>
document.write("You are at: "+document.URL);
</script>
</body>
The URLUnencoded Property
#ٖ‫ وفؼ‬encode$‫ ـٔكٌٍبیی‬ٌٝ٘ٛ‫ف‬ٞ ٖٚ‫ خبـی ـا ثفٔی ٌفؼا٘ؽ' ثؽ‬ٝ‫آؼـن وبُٔ ِفط‬
‫ؼ ؼـ ضبِی‬ٌٛ ٜ‫ ٕ٘بیً ؼاؼ‬%20 ‫ـر‬ِٛ ٝ‫ فٕبی غبِی ث‬ٝ‫ ٕٔىٗ اوز و‬URL Property ‫ـ ٔثبَ ؼـ‬ٛ٘ ٝ‫ث‬
)‫ؼ‬ٌٛ ‫ٌی ٔی‬ٛ‫ اق ٕ٘بیً آٖ زٍٓ د‬URLUnencoded Property ‫ ؼـ‬ٝ‫و‬
DOM ‫استفادُ اس هتذّای‬
ٗ‫ اق ای‬ٜ‫ اوز) ثب اوشفبؼ‬ٜ‫ ٌؽ‬ٜ‫ـؼ‬ٚ‫ب ـا آ‬ٟ٘‫ـؼ آ‬ٛٔ ‫ٔیطبسی ؼـ‬ٛ‫ ٔش‬ٚ ‫ب‬ٞ‫فیه اق ایٗ ٔشؽ‬ٞ ْ‫َ قیف ٘ب‬ٚ‫ؼـ خؽ‬
)‫یؽ‬ٙ‫اـؼ و‬ٚ ‫ؼ‬ٛ‫بؼ غ‬ٙ‫ او‬ٝ‫بی خؽیؽی ـا ث‬ٞ ‫ لبثّیز‬ٚ ‫یمٌی‬ٚ ‫ا٘یؽ‬ٛ‫ب ٌٕب ٔی س‬ٞ‫ٔشؽ‬
Method Description
Attaches a function to an event, so that the function runs when
attachEvent()
the eventoccurs (Internet Explorer only)
createAttribute() Creates an attribute with a name that is sent to it as a parameter
createAttributeNS() Creates a new attribute in a particular namespace
createCDATASection() Creates a new CDATA section
Creates a comment with the value that is sent to it as a
createComment()
parameter
createDocumentFragment() Creates a new document fragment
createElement() Creates an element of the type sent to it as a parameter
Creates an element in a particular URI and a particular type sent
createElementNS()
to it as parameters
createEntityReference() Creates a new entity reference
createEvent() Creates an event
Creates an event object for the purpose of passing event
createEventObject()
information
createNodeIterator() Creates a node iterator object
createNSResolver() Creates a namespace resolver
createProcessingInstruction() Creates a processing instruction
createRange() Creates a range object
Creates a style sheet for the document to use (Internet Explorer
createStyleSheet()
only)
createTextNode() Creates a text string from the value sent to it as a parameter

createTreeWalker() Creates a treewalker object
detachEvent() Detaches a function from an event (Internet Explorer only)
Returns the element object that appears at the location that is
elementFromPoint() sent to it in two parameter values (pixels from left and pixels
from top)
evaluate() Returns a result based on the parameters sent to it
Executes a command on the document when the document is in
execCommand()
designmode
Returns a reference to the object with the ID attribute that is sent
getElementById()
to as a parameter
Returns references to the elements with the class name that is
getElementsByClassName()
sent to it as a paramete
Returns references to the objects with the name attribute that is
getElementsByName()
sent it as a parameter
Returns references to the elements with the tag name that is sent
getElementsByTagName()
to it s a parameter
Returns references to the elements with the tag name and
getElementsByTagNameNS()
namespace sent to it as parameters
getSelection() Returns the value of a string of selected text in the document
Returns a Boolean value based on whether or not the document
hasFocus()
has focus
load() Loads an XML document
mergeAttributes() Copies attributes from an object
Opens a new document that allows you to write its contents
open()
using write() or writeln() statements
Closes a new document that has been opened with the open()
close()
method
Returns a Boolean value based on whether or not a command
queryCommandEnabled()
sent to it as a parameter can be executed
queryCommandIndeterm()
sent to it as a parameter is in the indeterminate state
queryCommandState()
sent to it as a parameter has executed
queryCommandSupported()
sent to it as a parameter is supported
Returns the current value of the document for the command that
queryCommandValue()
is sent to it as a parameter
Method Description
Returns the current value of the document for the command that
queryCommandValue()
is sent to it as a parameter
recalc() Recalculates the dynamic properties in the document
releaseCapture() Releases the mouse capture from the document
setActive() Sets an object as active, but does not give it focus
write() Allows you to write a string of text into an HTML document
writeln() Allows you to write a string of text into an HTML document,
but ends the line with a JavaScript newline character
getElementById() ‫هتذ‬
‫ آیؽی آٖ ؼوشفوی دیؽا‬ّٝ‫وی‬ٚ ٝ‫ ث‬ٝ‫بی یه خكء اق ِفط‬ٟ‫ غبِیش‬ٝ‫ ث‬ٝ‫ؽ و‬ٞ‫ ٔی ؼ‬ٜ‫ ٌٕب اخبق‬ٝ‫ایٗ ٔشؽ ث‬
)‫یؽ‬ٙ‫و‬
5 3(,1 َ‫ٔثب‬
<div id="some_text">This is some text.</div>

var text_element = document.getElementById("some_text");
getElementByName() ‫هتذ‬
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ب ثفاثف ٔمؽاـی غبَ اوز اوشفبؼ‬ٟ٘‫ آ‬name ‫ ِفز‬ٝ‫ و‬ٝ‫بِفی اق ِفط‬ٙ‫ ػ‬ٝ‫ثفای ؼوشفوی ث‬
5 3(,2 َ‫ٔثب‬
<html>
<head>
<title>DOM Example</title>
</head>
<body>
<form method=”post” action=”dosomething.php”>
<fieldset>
<legend>What color do you like?</legend>
<input type=”radio” name=”radColor” value=”red” /> Red<br />
<input type=”radio” name=”radColor” value=”green” /> Green<br
/>
<input type=”radio” name=”radColor” value=”blue” /> Blue<br />
</fieldset>
<input type=”submit” value=”Submit” />
</form>
</body>
</html>

‫ایٗ ِفط‪ ٝ‬ـً٘ ٔ‪ٛ‬ـؼ ػالل‪ ٝ‬وبـثف ـا و‪ٛ‬اَ ٔی و‪ٙ‬ؽ)‪ٞ radiobutton‬ب اوٓ یىىب٘ی ؼاـ٘ؽ ‪.‬أب ٔی‬
‫غ‪ٛ‬ا‪ٞ‬یٓ فمٗ ٔمؽاـ‪radiobutton‬ی ـا و‪ ٝ‬ا٘شػبة ٌؽ‪ ٜ‬اوز ـا دیؽا و‪ٙ‬یٓ)ثفای ایٗ أف اق وؽ قیف اوشفبؼ‪ٜ‬‬
‫ٔی و‪ٙ‬یٓ‪5‬‬
‫;)”‪var oRadios = document.getElementsByName(“radColor‬‬
‫ضبَ ٔی س‪ٛ‬ا٘یؽ اق ‪ٕٞ‬بٖ ـ‪ٚ‬ي لجّی ثفای ث‪ ٝ‬ؼوز آ‪ٚ‬ـؼٖ ٔمؽاـ ‪ٞ‬ف اق ‪ٞradiobutton‬ب ث‪ ٝ‬ـ‪ٚ‬ي قیف‬
‫ػُٕ و‪ٙ‬یؽ‪:‬‬
‫”‪alert(oRadios[0].getAttribute(“value”)); //outputs “red‬‬
‫هتذ )(‪The getElementsByClassName‬‬
‫‪ٕٞ‬ب٘‪ٙ‬ؽ ٔشؽ‪ٞ‬بی ثبال ػُٕ ٔی و‪ٙ‬ؽ ثب ایٗ سفب‪ٚ‬ر و‪ ٝ‬اق ٘بْ والوی و‪ ٝ‬ث‪ ٝ‬ػ‪ٙ‬بِف سػّیّی یبفش‪ ٝ‬اوز ثفای‬
‫ؼوشفوی ث‪ ٝ‬آ٘‪ٟ‬ب اوشفبؼ‪ٔ ٜ‬ی و‪ٙ‬ؽ)‬
‫ٔثبَ ‪5 3(,4‬‬
‫ففْ و‪ٙ‬یؽ ٔی غ‪ٛ‬ا‪ٞ‬یٓ ث‪ ٝ‬سٕبْ اخكایی و‪ ٝ‬والن آ٘‪ٟ‬ب ‪ number_one‬اوز ـا ؼوشفوی دیؽا و‪ٙ‬یٓ‬
‫ثؽیٗ ٔ‪ٙ‬ظ‪ٛ‬ـ اق ل‪ٙ‬ؼ‪ ٝ‬وؽ قیف اوشفبؼ‪ٔ ٜ‬ی و‪ٙ‬یٓ‪5‬‬
‫;)"‪var my_class = document.getElementsByClassName("number_one‬‬
‫هتذ )(‪getElementsByTagName‬‬
‫ایٗ ٔشؽ ث‪ٌٕ ٝ‬ب اخبق‪ ٜ‬ؼوشیبثی ث‪ ٝ‬آـای‪ ٝ‬ای اق ػ‪ٙ‬بِفی ـا ٔی ؼ‪ٞ‬ؽ و‪ ٝ‬ؼاـای سً ٍٔػُ ‪ٞ‬ىش‪ٙ‬ؽ)‬
‫ٔثبَ ‪5 3(-+‬‬

‫ـ اق‬ٛ‫ظ‬ٙٔ ٗ‫یٓ ثؽی‬ٙ‫ؽ ؼوشفوی دیؽا و‬ٙ‫ىش‬ٞ img ً‫ ؼاـای س‬ٝ‫بِفی و‬ٙ‫ سٕبْ ػ‬ٝ‫یٓ ث‬ٞ‫ا‬ٛ‫یؽ ٔی غ‬ٙ‫ففْ و‬
5ٓ‫ی‬ٙ‫ ٔی و‬ٜ‫وؽ قیف اوشفبؼ‬
var all_images = document.getElementsByTagName("img");
close() ّ open() ‫هتذّای‬
‫ ثفای دبیبٖ آٖ اق ٔشؽ‬ٚ ‫ؽ‬ٞ‫ٌشٗ ؼـ آٖ ـا ٔی ؼ‬ٛ٘ ٚ ‫ خؽیؽ‬ٝ‫ وبغز یه ِفط‬ٜ‫ ٌٕب اخبق‬ٝ‫ ث‬open() ‫ٔشؽ‬
)‫ ٔی ٌفؼؼ‬ٜ‫ اوشفبؼ‬close()
5 3(-, َ‫ٔثب‬
ٜ‫ خؽیؽ ثبق ٌؽ‬ٝ‫ وفؼٖ آٖ یه ِفط‬submit ‫ؽ وذه ثب‬ٙ‫اـؼ ٔی و‬ٚ ‫ؼ ـا‬ٛ‫ؼـ ٔثبَ قیف وبـثف اثشؽا ٘بْ غ‬
)‫یؽ‬ٌٛ ‫ي آٔؽ ٔی‬ٛ‫ غ‬ٜ‫اـؼ وفؼ‬ٚ ‫ ؼـ اثشؽا‬ٝ‫ؼ وبـثف ـا ثب ؾوف ٘بٔی و‬ٚ‫ـ‬ٚ ٝ‫و‬
<body>
<strong>Enter your name in the box below, then click
the button to see a personalized page!</strong>
<br />
<form id="newp" onsubmit="newpage();">
Name: <input type="text" id="yourname" size="25">
<br/><br/>
<input type="submit" value="Submit">
</form>
function newpage() {
var thename = document.getElementById("yourname").value;
document.open();
document.write("<h1>Welcome!</h1>");
document.write("Hello, "+thename+", and welcome to my page!");
document.close();
}
</script>
</body>

DOM ‫خَاظ گزُ ّا در‬
)‫ ا٘ؽ‬ٜ‫ ٌؽ‬ٜ‫ـؼ‬ٚ‫ آ‬DOM ‫ب ؼـ‬ٞ ٜ‫بی ٌف‬ٟ‫َ قیف غبِیش‬ٚ‫ؼـ خؽ‬
attributes An array of all of the attributes in the specified node; the name and
value properties of this property can be used to access the attribute
name or attribute value for each member of the array
childNodes An array of all the child nodes of the specified node
className Returns the value of the class attribute of the specified node
clientHeight Returns the height, in pixels, of the specified node
clientWidth Returns the width, in pixels, of the specified node
dir Returns the value of the direction of the text in the specified node (ltr or
rtl)
firstChild Returns the first child node of the specified node
id Returns the value of the id of the specified node
innerHTML Returns the HTML code (text, image code, tags, etc.) within the
specified node, such as all of the HTML code within a div element
lang Returns the language value of the specified node
lastChild Returns the last child node of the specified node
nextSibling Returns the node following the specified node
nodeName Returns the name of the specified node (such as div for a div element)
nodeType Returns the type of the specified node
nodeValue Returns the value of the specified node (such as the text within a div
element or the value of an attribute)
offsetHeight Returns the offset height of the specified node
offsetWidth Returns the offset width of the specified node
ownerDocument Returns the document object that contains the specified node
parentNode Returns the parent node of the specified node
previousSibling Returns the node before the specified node
scrollLeft Returns the difference between the left edge and the left edge in view of
the specified node
scrollTop Returns the difference between the top edge and the top edge in view of
the specified node
scrollHeight Returns the entire height (including anything hidden and viewable via a
scroll bar) of the specified node
scrollWidth Returns the entire width (including anything hidden and viewable via a
scroll bar) of the specified node
style Returns the style object of the specified node
tabIndex Returns the tab index of the specified node
tagName Returns the tag name (in uppercase) of the specified node
title Returns the value of the title attribute of the specified node

)ٓ‫ی‬ٙ‫ ـا سٍفیص ٔی و‬title ‫ اق غبِیز‬ٜ‫ اوشفبؼ‬ٜٛ‫ؼـ ٔثبَ قیف ٘ط‬
5 3(-- َ‫ٔثب‬
<body>
<div id="div1" title="All about me!">
This page is about me, me, and... me!
</div>
var me_div = document.getElementById("div1");
var me_title = me_div.title;
window.alert("The title of the div element is" + me_title);
</script>
</body>
DOM ‫هتذّای هزتَط تِ گزُ ّا در‬
)‫ ٔی ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫ب ـا ٍٔب‬ٞ‫َ قیف ِیىشی اق ایٗ ٔشؽ‬ٚ‫ؼـ خؽ‬
Method Description
addEventListener() Adds an event listener to the specified node to run a function
on the
event sent to it as a parameter
appendChild() Appends a node as the last child of the specified node
attachEvent() Attaches an event to the specified node to run a function on
the eventsent to it as a parameter
blur() Removes focus from the specified node
click() Executes the click event on the specified node
cloneNode() Creates a clone of the specified node
detachEvent() Detaches an event from the specified node
dispatchEvent() Executes an event on the specified node
focus() Gives focus to the specified node
getAttribute() Returns the value of the attribute name sent to it as a
parameter on the specified node
getAttributeNS() Returns the value of the attribute name and namespace sent
to it as a parameter on the specified node
getAttributeNode() Returns the attribute node of the attribute name sent to it as a
parameter for the specified node
getAttributeNodeNS() Returns the attribute node of the attribute name and
namespace sent to it as parameters for the specified node
getElementsByTagName() An array of all the child element nodes with the tag name
sent to it as a parameter in the specified node
getElementsByTagNameNS() An array of all the child element nodes with the tag name and
namespace sent to it as parameters in the specified node
hasAttribute() Returns true if the attribute name sent to it as a parameter
exists on the specified node, or false if not
hasAttributeNS() Returns true if the attribute name and namespace sent to it as
parameters exist on the specified node, or false if no
hasAttributes() Returns true if the specified node has any attribute nodes
defined, or false if not
hasChildNodes() Returns true if the specified node has any child nodes. or
false if not
insertBefore() Inserts a node sent to it as a parameter before the node sent to
it as a second parameter inside the specified node
normalize() Normalizes the specified node
removeAttribute() Removes the attribute node for the attribute name sent to it as
a parameter from the specified node
removeAttributeNode() Removes the attribute node for the attribute node object
reference sent to it as a parameter from the specified node
removeAttributeNS() Removes the attribute node for the attribute name sent to it as
a parameter with the namespace sent to it as a parameter
from the specified node
removeChild() Removes the child node sent to it as a parameter from the
specified node
removeEventListener() Removes an event listener from the specified node
replaceChild() Replaces the child node sent to it as the second parameter
with the child node sent to it as the first parameter in the
specified node
scrollIntoView() Scrolls the specified node into view in the browser window
setAttribute() Sets an attribute node’s name (first parameter) and value
(second parameter) for the specified node
setAttributeNode() Sets an attribute node as the attribute node object sent to it as
a parameter for the specified node
setAttributeNodeNS() Sets an attribute node as the attribute node object sent to it as
a parameter with the namespace sent to it as a parameter for
the specified node
setAttributeNS() Sets an attribute node’s namespace (first parameter), name
(secondparameter), and value (third parameter) for the specified node
5 3(-. َ‫ٔثب‬
<body>
<div id="div1" title="All about me!">
This page is about me, me, and... me!
</div>
</body>

ٖ‫ آ‬ٝ‫بی ؼیٍفی ـا ث‬ٞ ٜ‫یؽ ٌف‬ٞ‫ا‬ٛ‫ اوز) اٌف ٌٕب ثػ‬text ‫ ففق٘ؽ‬ٜ‫ یه ٌف‬ٚ div ٜ‫ایٗ وؽ ؼاـای یه ٌف‬
ٜ‫ ٔشؽ ٌف‬ٚ ' document.createTextNode()'document.createElement() ‫یؽ ثبیؽ اق‬ٙ‫ و‬ٝ‫أبف‬
)‫یؽ‬ٙ‫ و‬ٜ‫ اوشفبؼ‬appendChild() 'DOM
5‫یؽ‬ٙ‫ ؼوشفوی دیؽا و‬div ٝ‫ اق وؽ قیف ث‬ٜ‫ ثب اوشفبؼ‬ٚ ٝ‫ا اوىفیذز ـفش‬ٚ‫ وؽ خب‬ٝ‫اثشؽا ث‬
5 3(-/ َ‫ٔثب‬
var me_div = document.getElementById("div1");
5 ‫ ٕ٘بییؽ‬ٝ‫ّف أبف‬ٙ‫ اق وؽ قیف یه ػ‬ٜ‫وذه ثب اوشفبؼ‬
var inner_div = document.createElement("div");
5‫ ٕ٘بییؽ‬ٝ‫ أبف‬inner_div ٝ‫ی ـا ث‬ٙ‫ ٔش‬ٜ‫ثؼؽ اق آٖ یً ٌف‬
var inner_div_text = document.createTextNode("More about

me...")
inner_div ٜ‫اٖ یىی اق ففق٘ؽاٖ ٌف‬ٛٙ‫ ػ‬ٝ‫ ـا ث‬ٜ‫ ایٗ ٌف‬appendChild() ‫سپس با استفادٍ اس هتذ‬
)‫ا٘شػبة ٕ٘بییؽ‬
inner_div.appendChild(inner_div_text);
5‫ ٕ٘بییؽ‬ٝ‫ أبف‬me_div ٜ‫ ده اق ٌف‬ٜ‫اٖ آغفیٗ ٌف‬ٛٙ‫ ػ‬ٝ‫ اق وؽ قیف آٖ ـا ث‬ٜ‫وفا٘دبْ ثب اوشفبؼ‬
me_div.appendChild(inner_div);

DOM ‫درآهذی تز تکٌیک ّای پیطزفتِ در‬
‫ ؼـ ِفطبر‬CSS ‫ ثیٍشف اق‬ٚ ‫شف‬ٟ‫ ث‬ٜ‫بیی ثفای اوشفبؼ‬ٞ ‫ي‬ٚ‫ ـ‬ٚ ‫ب‬ٞ ‫یه‬ٙ‫ؼ سى‬ٌٛ ‫ؼـ ایٗ ثػً وؼی ٔی‬
)‫ؼ‬ٌٛ ٜ‫قي ؼاؼ‬ٛٔ‫ؼ آ‬ٛ‫غ‬
ٗ‫ ٕٔى‬ٝ‫ؼ ٔی ثبٌؽ اٌفز‬ٛ‫خ‬ٛٔ css ‫ ؼـ‬ٝ‫بیی اوز و‬ٟ‫یمٌی‬ٚ ٚ َ‫ا‬ٛ‫ ٌبُٔ سٕبْ غ‬style object ٜ‫ق‬ٚ‫أف‬
‫ ؼـ‬background-color َ‫ـ ٔثب‬ٛ٘ ٝ‫ ثبٌؽ ث‬ٝ‫ؼ ؼاٌش‬ٛ‫خ‬ٚ ‫ر‬ٚ‫ب سفب‬ٞ ‫یمٌی‬ٚ ٗ‫اوز وٕی ؼـ ٘بٍٔؿاـی ای‬
)‫ؼ‬ٚ‫ وبـ ٔی ـ‬ٝ‫ ث‬style.backgroundColor ‫ـر‬ِٛ ٝ‫ ث‬CSS
)‫یؽ‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ ـا ٍٔب‬DOM ‫ب ؼـ‬ٟ٘‫ ٔؼبؼَ آ‬ٚ CSS ‫ؼ ؼـ‬ٛ‫خ‬ٛٔ ‫بی‬ٞ ‫یمٌی‬ٚ ‫َ قیف‬ٚ‫ؼـ خؽ‬
CSS Style Attribute JavaScript Style Property

background-color style.backgroundColor
color style.color
font style.font
font-family style.fontFamily
font-weight style.fontWeight
5 3(-0 َ‫ٔثب‬
5 ٓ‫ی‬ٙ‫ سؼفیف ٔی و‬object property ٜ‫ ثب اوشفبؼ‬ٚ ‫بی قیف‬ٟ‫یمٌی‬ٚ ‫ ثب‬border ‫ؼـ ٔثبَ قیف یه‬
var oDiv = document.getElementById(“div1”);

oDiv.style.border = “1px solid black”;
5 3(-1 َ‫ٔثب‬
5 ‫ ٕ٘بیً ؼـ ٔی آیؽ‬ٝ‫ ث‬ٝٙ‫ ٘بْ ـً٘ قٔی‬ٕٝ‫ؼـ وؽ قیف ثب فٍفؼٖ یه ؼو‬
<html>
<head>
<title>Style Example</title>
function sayStyle() {
alert(oDiv.style.backgroundColor);
}

</script>
</head>
<body>
<div id=”div1” style=”background-color: red; height: 50px;
width:
50px”></div><br />
<input type=”button” value=”Get Background Color”
onclick=”sayStyle()” />
</body>
</html>
5 3(-2 َ‫ٔثب‬
‫ آثی‬ٝ‫ آٖ ث‬ٜ‫ؼ‬ٚ‫ ٔطؽ‬ٝ‫ن ث‬ٚ‫ؼ ٍ٘بٍ٘ف ٔب‬ٚ‫ـ‬ٚ ‫ ثب‬ٝ‫ ٕ٘بیً ؼـ ٔی آیؽ و‬ٝ‫ اق وؽ قیف یه ٔفثغ لفٔك ث‬ٜ‫ثب اوشفبؼ‬
)‫ؼ ثبق ٔی ٌفؼؼ‬ٛ‫ ـً٘ لجّی غ‬ٝ‫ ٔفثغ ث‬ٜ‫ؼ‬ٚ‫ن اق ٔطؽ‬ٚ‫ج ٍ٘بٍ٘ف ٔب‬ٚ‫ ثب غف‬ٚ ‫ؽ‬ٞ‫سغییف ـً٘ ٔی ؼ‬
<html>
<head>
</head>
<body>
<div id=”div1”
style=”background-color: red; height: 50px; width: 50px”
onmouseover=”this.style.backgroundColor = „blue‟”
onmouseout=”this.style.backgroundColor = „red‟”></div>
</body>
</html>
5 3(-3 َ‫ٔثب‬
‫ وؽ‬ٝ‫ؼ‬ٙ‫ اق ل‬ٜ‫یؽ ثب اوشفبؼ‬ٙ‫ی ٔفثغ لفٔك ـً٘ وّیه ٔی و‬ٚ‫ ـ‬ٝ‫ٍبٔی و‬ٙٞ ‫ؼـ ٔثبَ قیف‬
)‫ؽ‬ٙ‫ ٕ٘بیً ؼـ ٔی آی‬ٝ‫بی ٔفثغ ث‬ٟ‫یمٌی‬ٚ this.style.cssText
<html>
<head>
</head>
<body>
<div id=”div1”
onclick=”alert(this.style.cssText)”></div>
</body>
</html>
DOM style methods
Css ٚ DOM ٗ‫ ػُٕ سجؽیُ ٔشمبثُ ـا ثی‬ٝ‫بیی اوز و‬ٞ‫ـؼ ٔشؽ‬ٛٔ ‫ ؼـ‬DOM style methods
)ٓ‫ی‬ٙ‫ٌٗ سف ٔی و‬ٚ‫ ایٗ ٔجطث ـا ـ‬ٚ ‫بی قیف‬ٞ َ‫ ٔثب‬ٚ َٚ‫ اق خؽ‬ٜ‫ؽ )ثب اوشفبؼ‬ٙٞ‫ا٘دبْ ٔی ؼ‬
Returns the string value of the CSS property

propertyName. The property must be
getPropertyValue(propertyName) specified in CSS style, such as
“background-color” instead of
“backgroundColor”
Returns the string “important” if the CSS
property
getPropertyPriority()
“!important” is specified in the rule;
otherwise it returns an empty string
Returns the name of the CSS property at the
item(index) given index, such as
“background-color”
Removes propertyName from the CSS
removeProperty(propertyName)
definition
Sets the CSS property propertyName
setProperty(propertyName, value,
to value with the given priority (either
priority)
“important” or an empty string)
5 3(-4 َ‫ٔثب‬
<html>
<head>
function useMethods() {
alert(oDiv.style.item(0)); //outputs “background-
color”
alert(oDiv.style.getPropertyValue(“background-color”));
}
</script>
</head>
<body>

<div id=”div1” style=”background-color: red; height: 50px;

width:
50px”></div><br />
<input type=”button” value=”Use Methods”
onclick=”useMethods()” />
</body>
</html>
background- ٖٕٕٛٔ ‫ٍؽاـ ثب‬ٞ ْ‫ؼ اثشؽا یه دیب‬ٌٛ ‫ ٔی‬ٜ‫ فٍفؼ‬ٝ‫ؼ ؼـ ِفط‬ٛ‫خ‬ٛٔ ٕٝ‫ ؼو‬ٝ‫قٔب٘ی و‬
‫ ؼـ‬ٝ‫ و‬div ‫ ی‬ٝٙ‫ٖ ٘بْ ـً٘ قٔی‬ٕٕٛٔ ‫ٍؽاـ ؼیٍفی ثب‬ٞ ْ‫ وذه ثب سبییؽ آٖ دیب‬ٚ ‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ ٕ٘بیً ؼاؼ‬color
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ اوز ٕ٘بیً ؼاؼ‬red ‫دب‬ٙ‫ای‬

Custom tooltips
‫ٔیطبسی‬ٛ‫الغ س‬ٚ ‫بوز ایٗ اثكاـ ؼـ‬ٞtooltip ‫ اق‬ٜ‫ اوشفبؼ‬style object ‫ خؿاة‬ٜ‫اـؼ اوشفبؼ‬ٛٔ ‫یىی ؼیٍف اق‬
)‫٘ؽ‬ٌٛ ‫ ٔی‬ٜ‫ لفاـ ٔی ٌیفؼ ٕ٘بیً ؼاؼ‬ٝ‫ی یىی اق اٌیبی ِفط‬ٚ‫ن ـ‬ٚ‫ ٍ٘بٍ٘ف ٔب‬ٝ‫ قٔب٘ی و‬ٝ‫ؽ و‬ٙ‫ىش‬ٞ
5 3(.+ َ‫ٔثب‬
<html>
<head>
function showTip(oEvent) {
var oDiv = document.getElementById(“divTip1”);
oDiv.style.visibility = “visible”;
oDiv.style.left = oEvent.clientX + 5;
oDiv.style.top = oEvent.clientY + 5;
}
function hideTip(oEvent) {
var oDiv = document.getElementById(“divTip1”);
oDiv.style.visibility = “hidden”;
}
</script>
</head>
<body>
<p>Move your mouse over the red square.</p>
<div id=”div1”
onmouseover=”showTip(event)”
onmouseout=”hideTip(event)”></div>
<div id=”divTip1”
style=”background-color: yellow; position: absolute;
visibility:
hidden; padding: 5px”>
<span style=”font-weight: bold”>Custom Tooltip</span><br />
More details can go here.
</div>
</body>
</html>
‫ی آٖ لفاـ ٔی‬ٚ‫ن ـ‬ٚ‫ ٍ٘بٍ٘ف ٔب‬ٝ‫ قٔب٘یى‬ٝ‫ ٕ٘بیً ؼـ ٔی آیؽ و‬ٝ‫ثب اخفا ٌؽٖ وؽ ثبال یه ٔفثغ لفٔك ـً٘ ث‬
More ٖٕٕٛٔ ٚ ً٘‫ ی قـؼ ـ‬ٝٙ‫ن دیبٔی ثب ده قٔی‬ٚ‫ وٕز زخ ٍ٘بٍ٘ف ٔب‬ٚ ٗ‫ٌیفؼ ؼـ لىٕز دبیی‬
)‫ ٕ٘بیً ؼـ ٔی آیؽ‬ٝ‫ ث‬details can go here.

Collapsible sections
Collapsible section ‫ اق‬ٜ‫ؼ اوشفبؼ‬ٚ‫ة ثىبـ ٔی ـ‬ٚ ‫ ثفای خؿاة ٌؽٖ ِفطبر‬ٝ‫یىی ؼیٍف اق اثكاـی و‬
‫یؽ سب‬ٞ‫ ـا ثؽ‬ٜ‫ وبـثف ایٗ اخبق‬ٝ‫ ث‬ٝ‫ـؼ ایٗ اوز و‬ٛٔ ٗ‫ ی اِّی ؼـ ای‬ٜ‫ ای ٔی ثبٌؽ)ایؽ‬ٜ‫بی وفوف‬ٞٛٙٔ ‫ب یب‬ٞ
)‫ب ٘ؽاـؼ ـا ٔػفی ٕ٘بیؽ‬ٟ٘‫ ؼیؽٖ آ‬ٝ‫ سٕبیُ ث‬ٝ‫ ـا و‬ٝ‫بیی اق ِفط‬ٞ ‫لىٕز‬
5 3(., َ‫ٔثب‬
<html>
<head>
function toggle(sDivId) {
var oDiv = document.getElementById(sDivId);
oDiv.style.display = (oDiv.style.display == “none”) ? “block”
:
“none”;
}
</script>
</head>
<body>
<div style=”background-color: blue; color: white; font-weight:
bold;
padding: 10px; cursor: pointer”
onclick=”toggle(„divContent1‟)”>Click Here</div>
<div style=”border: 3px solid blue; height: 100px; padding:
10px”
id=”divContent1”>This is some content
to show and hide.</div>
<p> </p>
<div style=”background-color: blue; color: white; font-weight:
bold;
padding: 10px; cursor: pointer”
onclick=”toggle(„divContent2‟)”>Click Here</div>
<div style=”border: 3px solid blue; height: 100px; padding:
10px”
id=”divContent2”>This is some content
to show and hide.</div>
</body>
</html>

innerText and innerHTML
)‫ اوز‬ٜ‫ سً ٘فاضی ٌؽ‬ٚ‫ ثفای سغییف یب اِالش ٔشٗ ثیٗ ؼ‬innerText property
5 3(.- َ‫ٔثب‬
<div>New text for ٝ‫یؽ آٖ ـا ث‬ٞ‫ا‬ٛ‫ ٔی غ‬ٝ‫< ؼاـیؽ و‬div/> ‫یؽ ٌٕب یه سً غبِی‬ٙ‫ففْ و‬
5 ‫ـر قیف ا٘دبْ ٔی ٌیفؼ‬ِٛ ٝ‫ ایٗ ػُٕ ث‬DOM ‫ اق‬ٜ‫یؽ ثب اوشفبؼ‬ٞ‫ سغیف ؼ‬thediv.</div>
oDiv.appendChild(document.createTextNode(“New text for the

div.”));
innerText ‫ اق‬ٜ‫ ٔی ثبٌؽثب اوشفبؼ‬ٜ‫ؽ‬ٙٙ‫ و‬ٝ‫الؼی غىش‬ٛٔ ‫ ؼـ‬ٚ ‫ال٘ی‬ٛ٘ ‫ِی‬ٚ ‫ایٗ وؽ قیبؼ ٍٔىُ ٘یىز‬
5 ‫ـر قیف ا٘دبْ ؼیؽ‬ِٛ ٝ‫ا٘یؽ آٖ ـا ث‬ٛ‫ٔی س‬
oDiv.innerText = “New text for the div.”;
5 3(.. َ‫ٔثب‬
‫ اق‬ٜ‫< ـا ثب اوشفبؼ‬div><strong>Hello</strong> <em>World</em></div> ٓ‫ی‬ٞ‫ا‬ٛ‫اٌف ثػ‬

5 ‫ؼ‬ٌٛ ‫یىی‬ٛ٘‫ـر قیف ثبیؽ ثبق‬ِٛ ٝ‫یىیٓ ث‬ٛٙ‫ ث‬DOM
var oStrong = document.createElement(“strong”);

oStrong.appendChild(document.createTextNode(“Hello”));
var oEm = document.createElement(“em”);
oEm.appendChild(document.createTextNode(“World”));
oDiv.appendChild(oStrong);
oDiv.appendChild(document.createTextNode(“”)); //space between
“Hello” and “World”
oDiv.appendChild(oEm);
5‫ـر قیف ؼـ ٔی آیؽ‬ِٛ ٝ‫ ث‬innerHTML ‫ اق‬ٜ‫ ثب اوشفبؼ‬ٝ‫و‬

oDiv.innerHTML = “<strong>Hello</strong> <em>World</em>”;
ٜ‫ ٌؽ‬ٜ‫ ٍ٘بٖ ؼاؼ‬innerHTML ٚ innerText ‫ر‬ٚ‫ اق یه وؽ ٍٔػُ سفب‬ٜ‫ ثب اوشفبؼ‬ٚ ‫َ قیف‬ٚ‫ؼـ خؽ‬
)‫اوز‬
Code innerText innerHTML

<div>Hello world</div> “Hello world” “Hello world”
<div><b>Hello</b>
“Hello world” “<b>Hello</b> world”
world</div>
<div><span></span></div> “” “<span></span>”
‫بی‬ٞ‫ وؽ‬innerHTML ٝ‫ٌشبـی ـا ثف ٔی ٌفؼا٘ؽ ؼـ ضبِیى‬ٛ٘ ‫بی‬ٞ ً‫ فمٗ ثػ‬innerText ‫الغ‬ٚ ‫ؼـ‬
)‫ب ـا ثفٔی ٌفؼا٘ؽ‬ٞ ٗ‫ ٔش‬ٚ '‫ سٕبْ اخكا‬ٝ‫ٖ ث‬ٛ‫ ٔفث‬HTML
outerText and outerHTML
)‫ؽ‬ٙ‫ خب ٔی و‬ٝ‫ی خبث‬ٙ‫ ٔش‬ٜ‫ ـا ثب یه ٌف‬ٜ‫ ٌف‬ٝ‫ر و‬ٚ‫ اوز ثب ایٓ سب‬innerText ‫ؽ‬ٙ٘‫ٕب‬ٞ
5 3(./ َ‫ٔثب‬
oDiv.outerText = “Hello world!”;
5‫ـر قیف ؼـ ٔی آیؽ‬ِٛ ٝ‫ ث‬dom ‫وؽ ثبال ؼـ‬
var oText = document.createTextNode(“Hello world! “);

var oDivParent = oDiv.parentNode;
oDivParent.replaceChild(oText, oDiv);

5 3(.0 َ‫ٔثب‬
oDiv.outerHTML = “<p>This is a paragraph.</p>”;
5‫ؼ‬ٌٛ ‫ ٔی‬ٝ‫ٌش‬ٛ٘ ‫ـر قیف‬ِٛ ٝ‫ ث‬dom ‫وؽ ثبال ٘یك ؼـ‬
var oP = document.createElement(“p”);
oP.appendChild(document.createTextNode(“This is a paragraph.
“));
var oDivParent = oDiv.parentNode;
oDivParent.replaceChild(oP, oDiv);
)‫ اوز‬ٜ‫ ٌؽ‬ٜ‫ ٍ٘بٖ ؼاؼ‬outerHTML ٚ outerText ‫ر‬ٚ‫ اق یه وؽ ٍٔػُ سفب‬ٜ‫ ثب اوشفبؼ‬ٚ ‫َ قیف‬ٚ‫ؼـ خؽ‬
Code outerText outerHTML

<div>Hello world</div> “Hello world” “<div>Hello world</div>”
div><b>Hello</b> “<div><b>Hello</b>
“Hello world”
world</div> world</div>”
<div><span></span></div> “” “<div><span></span></div>”

5 3(.1 َ‫ٔثب‬
‫یؽ‬ٞ‫ؼ ؼـ ٔثبَ قیف ـا فٍبـ ٔی ؼ‬ٛ‫خ‬ٛٔ ٕٝ‫ ٌٕب ؼو‬ٝ‫< قٔب٘ی و‬div/> ُٔ‫ی ٌب‬ٙ‫ ٔش‬ٜ‫ ثب یه ٌف‬This is my
‫ؼ‬ٌٛ ‫ خبیٍكیٗ ٔی‬original text.
<html>
<head>
<title>OuterText Example</title>
<style type=”text/css”>
div.special {
background-color: red;
padding: 10px;
}
</style>
function useOuterText() {
oDiv.outerText = oDiv.outerText;
alert(document.getElementById(“div1”));
}
</script>
</head>
<body>
<div id=”div1” class=”special”>This is my original text</div>
<input type=”button” value=”Use OuterText”
onclick=”useOuterText()” />
</body>
</html>


ُ‫ اضیاء پٌجز‬: ‫فصل ًْن‬

ُ‫اضیای پٌجز‬
‫ ؼـ‬ٝ‫ـ و‬ٛٙ٘‫ٕب‬ٞ ٚ )‫٘ؽ‬ٌٛ ‫ ٔی‬ٝ‫اٖ ٌی ؼـ ٘ظف ٌففش‬ٛٙ‫ ػ‬ٝ‫ ث‬ٜ‫ غیف‬ٚ ‫ب‬ٞ ٓ‫ب' ففی‬ٞ ٜ‫دف‬ٙ‫ا اوىفیذز د‬ٚ‫ؼـ خب‬
‫ب‬ٞ‫ـؼ ٔشؽ‬ٛٔ ‫ سفّیُ ؼـ‬ٝ‫ِیبسی ٘یبق ؼاـیٓ) ؼـ یٗ فُّ ث‬ّٛ‫ غ‬ٚ ‫ب‬ٞ‫ ٔشؽ‬ٝ‫َ لجُ ؼیؽیٓ' ثفای وبـ ثب اٌیب ث‬ّٛ‫ف‬
ٜ‫ وفؼ‬ٜ‫ب آٔبؼ‬ٞ ٜ‫دف‬ٙ‫ـ اغشّبِی ثفای وبـ ثب د‬ٛ٘ ٝ‫ااوىفیذز ث‬ٚ‫ خب‬ٝ‫یٓ ٌفز و‬ٞ‫ا‬ٛ‫ِیبسی وػٗ غ‬ّٛ‫ غ‬ٚ
)‫اوز‬
Properties_‫خصَصیات‬
)ٓ‫ی‬ٌٛ ‫ب‬ٌٙ‫ِیبر ایٗ ٌی آ‬ّٛ‫یؽ سب اثشؽا ثب غ‬ٞ‫ ؼ‬ٜ‫ اخبق‬ٜ‫دف‬ٙ‫بی ٌی د‬ٞ‫ع وبـ ثب ٔشؽ‬ٚ‫ثفای ٌف‬
)‫ف وؽاْ اوز‬ٞ ‫ـؼ‬ٛٔ ‫ٔیطبسی ؼـ‬ٛ‫ س‬ٜ‫ٕفا‬ٞ ٝ‫ِیبر ث‬ّٛ‫َ قیف ٌبُٔ ِیىشی اق ایٗ غ‬ٚ‫خؽ‬
closed Holds the value based on whether or not a window has been closed
defaultStatus Defines the default message displayed in the status bar
document A reference to the document object of the window
frames An array that represents all of the frames in a given window
history Provides information on the browser history of the current window
innerHeight Returns the height, in pixels, of the viewable area within the window
innerWidth Returns the width, in pixels, of the viewable area within the window
length Holds a value equal to the number of frames in a window
location Holds the value of the current URL of the window
name Enables a window to be named
opener Refers to the window that opened another window
outerHeight Returns the width, in pixels, of the entire browser window
outerWidth Returns the width, in pixels, of the entire browser window
parent Refers to the frame set that contains the current frame
screen.availWidth Returns the available width of the browser window in pixels
screen.availHeight Returns the available height of the browser window in pixels
screen.colorDepth Returns the color depth of the screen in bits per pixel
screen.height Returns the total height of the screen in pixels
screen.pixelDepth Returns the bit depth of the screen in bits per pixel
screen.width Returns the total width of the screen in pixels
self Provides another way to reference the current window
status Enables a message to be placed in the status bar; overrides defaultStatus
top A reference to the top window containing a frame, frame set, or nested
frame set
window A reference to the current window

The closed Property
ٚ '‫ اوز یب غیف؟‬ٜ‫ ٌؽ‬ٝ‫ ای ثب ٘بْ ٍٔػُ ثىش‬ٜ‫دف‬ٙ‫ آیب د‬ٝ‫ؽ و‬ٙ‫ زه ٔی و‬ٝ‫ىز و‬ٙ‫ ایٗ غبِیز ای‬ٝ‫ظیف‬ٚ
ٜ‫دف‬ٙ‫٘ؽ) ایٗ غبِیز ػُٕ ٔفؼ ٘ظفي ـا ثف اوبن ٘بْ د‬ٌٛ ‫بی ؼاغُ آٖ اخفا ٔی‬ٞ‫ؼٖ وؽ‬ٛ‫ ث‬ٝ‫ـر ثىش‬ِٛ ‫ؼـ‬
)‫ؽ‬ٞ‫ب ا٘دبْ ٔی ؼ‬ٞ
if (windowname.closed) {
JavaScript Statements
}
innerHeight Property
ٗ‫ؽ' ای‬ٙ‫ؽاـی ٔی و‬ٍٟ٘ ‫ؽ ـا‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ وبـثف ٍٔب‬ٝ‫ و‬ٜ‫دف‬ٙ‫ ای اق د‬ٜ‫ؼ‬ٚ‫ایٗ غبِیز ٔمؽاـ اـسفبع ٔطؽ‬
‫ِیز ؼـ‬ّٛ‫ؼ) ایٗ غ‬ٌٛ ‫ـٌف ٕ٘ی‬ٚ‫ِیبر ٔف‬ّٛ‫ ؼیٍف غ‬ٚ ‫ِجبـ‬ٛ‫ثبـ' س‬ٛٙٔ '‫َ ثبـ‬ٚ‫غبِیز ٌبُٔ اوىف‬
)‫ــ ثف ٕ٘ی ٌفؼا٘ؽ‬ّٛ‫شف٘ز اوىذ‬ٙ‫ ای ـا ؼـ ای‬ٝ‫ِی ٘شید‬ٚ ‫ؽ‬ٙ‫ فبیففبوه وبـ ٔی و‬ٚ ‫بی ادفا‬ٞ‫ـٌف‬ٚ‫ٔف‬
innerWidth Property
ٗ‫ؽ' ای‬ٙ‫ؽاـی ٔی و‬ٍٟ٘ ‫ؽ ـا‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ وبـثف ٍٔب‬ٝ‫ و‬ٜ‫دف‬ٙ‫ ای اق د‬ٜ‫ؼ‬ٚ‫ایٗ غبِیز ٔمؽاـ ػفْ ٔطؽ‬
‫ِیز ؼـ‬ّٛ‫ؼ) ایٗ غ‬ٌٛ ‫ـٌف ٕ٘ی‬ٚ‫ِیبر ٔف‬ّٛ‫ ؼیٍف غ‬ٚ ‫ِجبـ‬ٛ‫ثبـ' س‬ٛٙٔ '‫َ ثبـ‬ٚ‫غبِیز ٌبُٔ اوىف‬
)‫ــ ثف ٕ٘ی ٌفؼا٘ؽ‬ّٛ‫شف٘ز اوىذ‬ٙ‫ ای ـا ؼـ ای‬ٝ‫ِی ٘شید‬ٚ ‫ؽ‬ٙ‫ فبیففبوه وبـ ٔی و‬ٚ ‫بی ادفا‬ٞ‫ـٌف‬ٚ‫ٔف‬
5 4(, َ‫ٔثب‬
var mywin_width = 450; // Sets a low default value

if (window.innerWidth || document.body.clientWidth) {
mywin_width = (window.innerWidth) ? window.innerWidth :
document.body.clientWidth;
}
var div_width = (mywin_width >= 800) ? "750px" : "400px";
document.write('<div style="width:'+div_width+'; background-
color:#CCC;">');
document.write('Some text for the new div element.');
document.write('</div>');

The length Property
‫ؽ ٔشؽ‬ٙ٘‫ٕب‬ٞ ‫خؽ ٔی ثبٌؽ) ؼـوز‬ٛٔ ٜ‫دف‬ٙ‫ سؼؽاؼ ففیٓ ؼـ د‬ٝ‫ ز‬ٝ‫یؽ و‬ٌٛ ‫ ٌٕب ٔی‬ٝ‫ایٗ غبِیز ث‬
) window.frames.length
The location Property
‫ه‬ٙ‫ ِی‬ٕٝ‫یمٌی ثفای ایدبؼ ؼو‬ٚ ٗ‫٘یؽ اق ای‬ٛ‫ ٔی ؼاـ ؼٌٕب ٔی س‬ٍٝ٘ ‫ خبـی ـا‬ٝ‫ ِفط‬URL ‫ایٗ ٔشؽ‬
)‫ ٕ٘بییؽ‬ٜ‫اوشفبؼ‬
5 4(- َ‫ٔثب‬
<head>
<title>Page has moved</title>
window.location="page2.html";
</script>
</head>
<body>
Lacking JavaScript? Click the link below for the new page
then!
<br />
<a href="page2.html">New Page</a>
</body>
The name Property
ٝ‫ؽ سب یه ٘بْ ـا ث‬ٞ‫ ٌٕب ایٗ أىبٖ ٔی ؼ‬ٝ‫ ث‬ٚ ‫ؼ‬ٚ‫ وبـ ٔی ـ‬ٝ‫ خبـی ث‬ٝ‫ؽاـی ٘بْ ِفط‬ٍٟ٘ ‫ایٗ ٔشؽ ثفای‬
)‫یؽ‬ٞ‫ ای اغشّبَ ؼ‬ٝ‫ِفط‬
5 4(. َ‫ٔثب‬
<body>
window.name="cool_window";
document.write("This window is named "+window.name);
</script>
</body>

)‫ ٕ٘بیً ٔی ٌؿاـؼ‬ٝ‫ ث‬ٝ‫ؼ ِفط‬ٚ ‫ؽ وذه آٖ ـا ؼـ‬ٞ‫ اغشّبَ ٔی ؼ‬ٝ‫ ِفط‬ٝ‫ایٗ ٔثبَ یه ٘بْ ـا ث‬
The opener Property
ٝ‫ قٔب٘ی اسفبق ٔی افشؽ و‬ٚ )‫ اوز‬ٜ‫ ای ؼیٍف ـا ثبق وفؼ‬ٜ‫دف‬ٙ‫ د‬ٝ‫ ای اوز و‬ٜ‫دف‬ٙ‫ د‬ٝ‫ ث‬ٝ‫ایٗ ٔشؽ ثفای ٔفاخؼ‬
)‫ؼ‬ٌٛ ‫ ثبق‬open() ‫ ٔشؽ‬ّٝ‫وی‬ٚ ٝ‫ خؽیؽ ث‬ٜ‫دف‬ٙ‫یه د‬
The parent Property
‫ ٌٕب ایٗ أىبٖ ـا‬ٝ‫ ث‬ٚ ‫ؽ‬ٌٙ‫ ثب‬ٝ‫ؼ ؼاٌش‬ٛ‫خ‬ٚ ٝ‫ؽ ففیٓ ؼـ ِفط‬ٙ‫ ز‬ٝ‫ؼ و‬ٚ‫ وبـ ٔی ـ‬ٝ‫ٍبٔی ث‬ٙٞ ٗ‫ایٗ ٔشؽ فم‬
)‫یؽ‬ٙ‫ ؼوشفوی دیؽا و‬parent frame set ٝ‫ؽ سب ث‬ٞ‫ٔی ؼ‬
The self Property
ٜ‫دف‬ٙ‫ؽ یه ٌی د‬ٙ٘‫ااوىفیذز) ایٗ ٔشؽ ٔب‬ٚ‫ خبـی ؼـ خب‬ٝ‫ی اوز ثفای ِؽا وفؼٖ ِفط‬ٞ‫ایٗ ٔشؽی ـا‬
)‫ؽ ٌفؼؼ‬ٙٔ ٜ‫ف‬ٟ‫ خبـی ث‬ٜ‫دف‬ٙ‫بی ٌی د‬ٞ ‫ا٘ؽ اق سٕبْ غبِیز‬ٛ‫ ٔی س‬ٚ ‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ثىبـ ثفؼ‬
‫هتذّا‬
‫بی ایٗ ٌی‬ٞ‫ سب ثب ٔشؽ‬ٜ‫ثز آٖ ـویؽ‬ٛ٘ ‫ ایؽ‬ٜ‫ب ٌؽ‬ٌٙ‫ آ‬ٜ‫دف‬ٙ‫بی ٌی د‬ٞ ‫یمٌی‬ٚ ‫ ٌٕب ثب سؼؽاؼی اق‬ٝ‫ضبَ و‬
)‫یؽ‬ٌٛ ‫ب‬ٌٙ‫٘یك آ‬
)‫ ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫ب ـا ؼـ قیف ٍٔب‬ٞ‫ا٘یؽ ِیىشی اق ایٗ ٔشؽ‬ٛ‫ٌٕب ٔی س‬
Method Description
alert() Pops up an alert to the viewer, who must then click OK to proceed
back() Takes the window back one item in its history list
blur() Removes the focus from a window
clearInterval() Cancels the action of a setInterval() method call
clearTimeout() Cancels the action of a setTimeout() method call
close() Closes a browser window
Displays a confirmation dialog box to the viewer, who must then click
confirm()
OK or Cancel to proceed
escape() Converts special characters in a string to hexadecimal characters
Enables the viewer to launch the Find utility in the browser to find text
find()
on a page
focus() Gives the focus to a window
forward() Takes the window one item forward in its history list
Sends the viewer to the home page the viewer has set in the Web
home()
browser settings

moveBy() Moves a window by certain pixel values that are sent as parameters
Moves the top-left corner of the window to the coordinates sent as
moveTo()
parameters
open() Opens a new browser window
print() Prints the contents of the window
prompt() Pops up a prompt dialog box asking the viewer to input information
Resizes a window by moving the bottom-right corner by certain pixel
resizeBy()
values that are sent as parameters
Resizes an entire window to the height and width that are sent as
resizeTo()
parameters
Scrolls the viewing area of a window by certain pixel values that are
scrollBy()
sent as parameters
Scrolls the viewing area of the window to the specified coordinates that
scrollTo()
are sent as parameters
setInterval() Calls a function each time a certain amount of time passes
setTimeout() Calls a function once after a certain amount of time has passed
stop() Stops the window from loading its content
unescape() Converts an escaped string back to its normal characters
The alert() Method
ٝ‫ ث‬ٝ‫ـؼ و‬ٚ‫ؼ ٔی آ‬ٛ‫خ‬ٚ ٝ‫ ایؽ) ایٗ ٔشؽ یه دبح آح ث‬ٜ‫َ لجُ ؼیؽ‬ّٛ‫ اق ایٗ ٔشؽ ـا ؼـ ف‬ٜ‫ اوشفبؼ‬ٝ‫٘فیم‬
)ٓ‫ی‬ٙ‫ٌكؼ ٔی و‬ٌٛ ‫ وبـثف‬ٝ‫ آٖ دیبٔی ـا ث‬ّٝ‫وی‬ٚ
5 4(/ َ‫ٔثب‬
window.alert("Hi there!");
The confirm() Method
‫ٍؽاـ‬ٞ ٖ‫اِی اق وبـة یب ؼاؼ‬ٛ‫ ثف دفویؽٖ و‬ٜٚ‫ ؼـ آٖ ػال‬ٝ‫ؽ و‬ٙ‫ ثبق ٔی و‬pop up ٜ‫دف‬ٙ‫ایٗ ٔشؽ ٘یك یه د‬
)‫ؼ ؼاـؼ‬ٛ‫خ‬ٚ cancel ٚ ok ٝٙ‫ ٌكی‬ٚ‫ ؼ‬ٜ‫ یب غیف‬ٚ
var varname = window.confirm("Your Message");

5 4(0 َ‫ٔثب‬
var is_sure = window.confirm("Are you sure?");
5 4(1 َ‫ٔثب‬
<body>
<a href="http://www.dlp.lxb.ir" id="myweb">My Weblog</a>
var s_link = document.getElementById("myweb");
s_link.onclick = function() {
var is_sure = window.confirm("Are you sure you want to
leave?");
if (!is_sure) {
window.alert("OK. You can stay here.");
return false;
}
};
</script>
</body>
‫ آیب اق‬ٝ‫ى‬ٙ‫ی ثف ای‬ٙ‫ؼ ٔج‬ٌٛ ‫ ٔی‬ٜ‫ وبـثف ٕ٘بیً ؼاؼ‬ٝ‫ه دیغبٔی ث‬ٙ‫ی ِی‬ٚ‫ ٔطٓ وّیه وفؼٖ ـ‬ٝ‫ؼـ ٔثبَ ثبال ث‬
‫بٖ ؼاـیؽ ؟‬ٙ‫ إ٘ی‬ٝ‫سفن ِفط‬
ٝ‫یؽ ؼـ ِفط‬ٙ‫ وّی و‬cancel ‫ی‬ٚ‫ِی اٌف ـ‬ٚ ‫یؽ‬ٌٛ ‫ غبـج ٔی‬ٝ‫ اق ِفط‬ok ‫ی‬ٚ‫ـر وّیه وفؼٖ ـ‬ِٛ ‫ؼـ‬
)‫ثبلی ٔی ٔب٘یؽ‬
The find() Method
‫ ای غبَ ؼـ ِفطبر‬ّٕٝ‫ی ِغز یب خ‬ٛ‫ خ‬ٚ ‫ وبـثف اخبق خىز‬ٝ‫ا٘یؽ ثب ثىبـ ثفؼٖ ایٗ ٔشؽ ث‬ٛ‫ٌٕب ٔی س‬
)‫یؽ‬ٞ‫ؼ ـا ثؽ‬ٛ‫غ‬
5َ‫ٔثب‬
‫ ثفای وبـثف‬ٛ‫ خ‬ٚ ‫ خىز‬ٜ‫دف‬ٙ‫ یه د‬Click to Find Text ٕٝ‫ی ؼو‬ٚ‫ؼـ ٔثبَ قیف ثب وّیه وفؼٖ ثف ـ‬
)‫بی ٔػشّف آٖ ـا ا٘شػبة ٕ٘بثؽ‬ٞ ٍٗ‫ آد‬ٚ ‫ؼ ـا ؼـ آٖ سبیخ ٕ٘بیؽ‬ٛ‫ـؼ ٘ظف غ‬ٛٔ ‫ا٘ؽ ِغز‬ٛ‫ ٔی س‬ٝ‫ؼ و‬ٌٛ ‫ثبق ٔی‬
5 4(2 َ‫ٔثب‬
<form>

<input type="button" value="Click to Find Text"

onclick="window.find();" />
</form>
The home() Method
Web _‫ـٌف‬ٚ‫ة ٔف‬ٚ ‫ظیٕبر‬ٙ‫ ؼـ س‬ٝ‫ اِّی و‬ٝ‫ ِفط‬ٝ‫ؼ سب وبـثف ـا ث‬ٌٛ ‫ ٔی‬ٜ‫ایٗ ٔشؽ ثفای ایٗ اوشفبؼ‬
‫ ؼـ‬ٚ ‫ؽ‬ٙ‫ فبیففبوه وبـ ٔی و‬ٚ ‫بی ادفا‬ٞ‫ـٌف‬ٚ‫ ثفٌفؼا٘ؽ) ایٗ ٔشؽ ؼـ ٔف‬ٜ‫ؼ سبیخ وفؼ‬ٛ‫_ غ‬browser settings
)ٝ‫ٖ ٘شید‬ٚ‫ــ ثؽ‬ّٛ‫شف٘ز اوىذ‬ٙ‫ـٌف ای‬ٚ‫ٔف‬
5 4(3 َ‫ٔثب‬
<form>
<input type="button" value="Go Home!"
onclick="window.home();">
</form>
The print() Method
) ‫ؽ‬ٙ‫ز اق یه و‬ٙ‫ اق ٘بْ آٖ ثف ٔی آیؽ وبـثف ـا لبؼـ ٔی وبقؼ ثفای ٌففشٗ دفی‬ٝ‫ـ و‬ٛٙ٘‫ٕب‬ٞ
5 4(4 َ‫ٔثب‬
<form>
<input type="button" value="Click to Print Page"
onclick="window.print();">
</form>
The prompt() Method
‫اـؼ وفؼٖ ا٘الػبر ؼـ آٖ ـا ٔی‬ٚ ‫ا٘بیی‬ٛ‫ وبـثف س‬ٝ‫ ث‬ٝ‫ؽ و‬ٙ‫ دبح آح ایدبؼ ٔی و‬ٜ‫دف‬ٙ‫ایٗ ٔشؽ ٘یك یه د‬
)‫ؽ‬ٞ‫ؼ‬
)‫ؽ‬ٌٙ‫ی ؼیٍفی ثب‬ٙ‫ف ا٘الػبر ٔش‬ٞ ‫ؽ وبـوشف' ِغبر یب‬ٙ٘‫ا‬ٛ‫ایٗ ا٘الػبر ٔی س‬
var varname = window.prompt("Your Text","Default Entry");

)‫یؽ‬ٞ‫ؼ اغشّبَ ؼ‬ٛ‫ دبح آح غ‬ٜ‫دف‬ٙ‫ د‬ٝ‫ خبی آٖ یه ٘بْ ث‬ٝ‫ ث‬varname
)‫یىیؽ‬ٛ٘ ‫دب ٔی‬ٙ‫ ٕ٘بیؽ ـا ؼـ ای‬ٜ‫ؽ‬ٞ‫ىشیؽ سب وبـثف ٍٔب‬ٞ ُ‫ ٔبی‬ٝ‫ دیبٔی و‬Your Text
ٖ‫ وبـثف ٍ٘ب‬ٝ‫ـر دیً ففْ ث‬ِٛ ٝ‫ ث‬ٚ ‫ؼی‬ٚ‫ـ‬ٚ ُ‫ ٌٕب ـا لبؼـ ٔی ٌبقؼ سب دیبٔی ـا ؼـ ٔؽغ‬Default Entry
)‫یؽ‬ٞ‫ؼ‬
5 4(,+ َ‫ٔثب‬
var thename = window.prompt("What's your name?","");
if (thename.length < 1) {
thename = "Anonymous Visitor";
}
document.write("Hello "+thename+"!");
</script>
‫شف‬ٙ‫ قؼٖ وّیؽ ای‬ٚ ْ‫اـؼ وفؼٖ ٘ب‬ٚ ‫ـر‬ِٛ ‫اـؼ ٕ٘بییؽ ؼـ‬ٚ ‫ؼ ٘بٔی ـا‬ٌٛ ‫اوز ٔی‬ٛ‫ؼـ ٔثبَ ثبال اثشؽا اق ٌٕب ؼـغ‬
ْ‫یؽ دیب‬ٞ‫شف ـا فٍبـ ؼ‬ٙ‫ ای‬ٚ ‫ٕبییؽ‬ٙ٘ ‫ِی اٌف زیكی ـا ؼـ وبؼـ سبیخ‬ٚ ‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ ٕ٘بیً ؼاؼ‬ٝ‫٘بْ ٌٕب ؼـ ِفط‬
)‫ؼ‬ٌٛ ‫ زبح ٔی‬ٝ‫ ؼـ ِفط‬Anonymous Visitor
5 4(,, َ‫ٔثب‬
<body>
<div id="greeting">
<h1>Hello! Welcome!</h1>
</div>
<div id="content">
This page talks about what I think about...
</div>
var greet = document.getElementById("greeting");
var thename = window.prompt("What's your name?","");
if (thename.length < 1) {
thename = "Anonymous Visitor";
}
greet.innerHTML = "<h1>Hello " + thename + "! Welcome!</h1>";
vf
</script>
‫>‪</body‬‬
‫‪The open() Method‬‬

‫ایٗ ٔشؽ ٌٕب ـا لبؼـ ٔی وبقؼ سب ث‪ٚ ٝ‬ویّ‪ ٝ‬خب‪ٚ‬ااوىفیذز د‪ٙ‬دف‪ ٜ‬خؽیؽی ثبق ٕ٘بییؽ)ایٗ ٔشؽ و‪ ٝ‬دبـأشف‬
‫ؼاـؼ و‪ ٝ‬ؼـ قیف ٍٔب‪ٞ‬ؽ‪ٔ ٜ‬ی ٕ٘بییؽ)‬
‫;)"‪window.open("URL","name","attribute1=value,attribute2=value‬‬
‫‪URL‬‬
‫ث‪ ٝ‬خبی ایٗ دبـأشف آؼـن ِفط‪ ٝ‬یب وبیز ٔ‪ٛ‬ـؼ ٘ظف لفاـ ٔی ٌیفؼ)‬
‫‪name‬‬
‫ث‪ ٝ‬خبی ایٗ دبـأشف ٘بٔی ـا و‪ٔ ٝ‬ی غ‪ٛ‬ا‪ٞ‬یؽ ث‪ِ ٝ‬فط‪ ٝ‬خؽیؽ ا٘الق ٌ‪ٛ‬ؼ ـا ٔی ٘‪ٛ‬یىیؽ)‬
‫‪attribute1=value,attribute2=value‬‬
‫ث‪ ٝ‬خبی ایٗ دبـأشف‪ٞ‬ب ٔمبؼیف ػؽؼی ‪ ٚ‬یب ٌكی‪ٞ ٝٙ‬بی ‪ “yes”, “no”,‬لفاـ ٔی ٌیفؼ) اٌف اق ایٗ دبـأشف‪ٞ‬ب‬
‫اوشفبؼ‪ٕٙ٘ ٜ‬بییؽ اق ٌكی‪ٞ ٝٙ‬بی دیً ففْ د‪ٙ‬دف‪ ٜ‬خبـی اوشفبؼ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ)‬
‫ٔثبَ ‪5 4(,-‬‬
‫;)"‪window.open("http://www.dlp.lxb.ir","my_blog‬‬
‫ٔثبَ ‪5 4(,.‬‬
‫‪window.open("http://www.dlp.lxb.ir","my_blog","width=400,heigh‬‬
‫;)"‪t=300‬‬

Standard Attributes
‫ب‬ٌٙ‫اَ ایٗ ٔشؽ آ‬ٛ‫ ٕ٘بییؽ ثبیؽ ثب ثفغی اق غ‬ٜ‫ اوشفبؼ‬open() ‫بی ٔشؽ‬ٞ ‫یمٌی‬ٚ ‫ اق‬ٝ‫یؽ و‬ٞ‫ا‬ٛ‫اٌف ٔی غ‬
ٝ‫ٕیز ؼاـؼ و‬ٞ‫ز ا‬ٟ‫اَ اوشب٘ؽاـؼ اق آٖ خ‬ٛ‫ غ‬ٝ‫ب ث‬ٟ٘‫ؽ ٘بٍٔؿاـی آ‬ٙ‫ی‬ٌٛ ‫اَ اوشب٘ؽاـؼ ٔی‬ٛ‫ب غ‬ٟ٘‫ آ‬ٝ‫ ث‬ٝ‫یؽ و‬ٌٛ
)‫یٓ وفؼ‬ٞ‫ا‬ٛ‫ب ِطجز غ‬ٟ٘‫ـؼ آ‬ٛٔ ‫ ؼـ ثػً ثؼؽ ؼـ‬ٝ‫ؼ ؼاـ٘ؽ و‬ٛ‫خ‬ٚ ٜ‫دف‬ٙ‫ د‬ٝ‫ٖ ث‬ٛ‫اَ ٔفث‬ٛ‫ ای ؼیٍف اق غ‬ٝ‫ؼوش‬
)‫یؽ‬ٙ‫َ قیف ٔی ثی‬ٚ‫اَ اوشب٘ؽاـؼ ـا ؼـ خؽ‬ٛ‫ِیىشی اق غ‬
Attribute Possible Function

Name Values
width number Defines the width of the new window in pixels
height number Defines the height of the new window in pixels
directories yes, no, 1, 0 Defines whether or not the new window has directory
buttons (like the What’s New or Link buttons near the
top of the browser)
location yes, no, 1, 0 Defines whether or not the new window has a location
box to type in a new URL
menubar yes, no, 1, 0 Defines whether or not the window has a menu bar
(File menu, Edit menu, and so on)
resizable yes, no, 1, 0 Defines whether or not the viewer is allowed to resize
the new window
scrollbars yes, no, 1, 0 Defines whether or not the new window has scroll bars
if the contents of the window are larger than the
window’s size
status yes, no, 1, 0 Defines whether or not the new window has a status bar
at the bottom
toolbar yes, no, 1, 0 Defines whether or not the new window has a toolbar
(Forward and Back buttons, Stop button, and so on)
5 4(,/ َ‫ٔثب‬
window.open("http://dlp.lxb.ir","dehloran
pc","width=300,height=200,menubar=yes");
5 4(,0 َ‫ٔثب‬
window.open("http://dlp.lxb.ir","dehloran pc
","width=300,height=200,directories=yes,
location=yes,menubar=yes,resizable=yes,scrollbars=yes,status=y
es,
toolbar=yes");

Extended Attributes
‫ب ٔی‬ٟ٘‫ ٔؼففی آ‬ٝ‫ ؼـ قیف ث‬ٝ‫ؼ ؼاـؼ و‬ٛ‫خ‬ٚ ‫ خؽیؽ‬ٜ‫دف‬ٙ‫ ٔشؽ ایدبؼ د‬ٝ‫ٖ ث‬ٛ‫اَ ٔفث‬ٛ‫ ای ؼیٍف اق غ‬ٝ‫ؼوش‬
ٕٝٞ ‫ ؼـ‬ٝ‫ب٘ؽ ٕٔىٗ اوز و‬ٞ‫ ایدبؼ ٌؽ‬new window ‫ ٔشؽ‬ٝ‫وؼ‬ٛ‫ ثفای س‬ٝ‫ب و‬ٞ ‫یمٌی‬ٚ ٗ‫دفؼاقیٓ) ای‬
)‫ ا٘ؽ‬ٜ‫اَ اوشب٘ؽاـؼ لفاـ ٘ؽاؼ‬ٛ‫ب ـا خكء غ‬ٟ٘‫ آ‬ٝ‫ٕیٗ ؼِیُ اوز و‬ٞ ٝ‫ؽ ث‬ٙٙ‫ثی ػُٕ ٘ى‬ٛ‫ غ‬ٝ‫ب ث‬ٞ‫ـٌف‬ٚ‫ٔف‬
)‫ ٔی ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫َ قیف ٍٔب‬ٚ‫اَ ـا ؼـ خؽ‬ٛ‫ِیىشی اق ایٗ غ‬
Attribute Possible Function

Values
fullscreen yes, no, 1, 0 Defines whether or not the window should open in a
full screen
left number Defines the distance from the left of the screen for the
new window
personalbar yes, no, 1, 0 Defines whether or not the new window has a personal
toolbar
screenX number Defines the distance from the left of the screen for the
new window
screenY number Defines the distance from the top of the screen for the
new window
top number Defines the distance from the top of the screen for the
new window
5 4(,1 َ‫ٔثب‬
window.open("http://dlp.lxb.ir","dehloran pc"
,"width=400,height=300,status=yes,screenX=0,left=0,screenY=0,t
op=0");
ٜ‫دف‬ٙ‫ وٕز زخ د‬ٚ ‫ ثبال‬ٌٌٝٛ ‫ دیىىُ' ؼـ‬.++ ‫ دیىىُ ' اـسفبع‬/++ ْ‫ ثب ػف‬ٜ‫دف‬ٙ‫ؼـ ٔثبَ ثبال یه د‬
)‫ؼ‬ٌٛ ‫خبـی ایدبؼ ٔی‬

The close() Method
‫ی‬ٚ‫ؼ) ایٗ ٔشؽ ٕٔىٗ اوز ـ‬ٚ‫ وبـ ٔی ـ‬ٝ‫ ایؽ ث‬ٜ‫ااوىفیذز ثبق وفؼ‬ٚ‫ ثب خب‬ٝ‫ ای و‬ٜ‫دف‬ٙ‫ایٗ ٔشؽ ثفای ثىشٗ د‬
)‫ؽ‬ٙ‫ب وبـ ٘ى‬ٞ‫ـٌف‬ٚ‫ثؼٕی اق ٔف‬
<body>
I am a new window! I am newer than that old window
that opened me, so I am special. Ha, ha!
<form>
<input type="button" value="Close Window"
onclick="window.close();" />
</form>
</body>
The moveBy() Method
ُٕ‫ ایٗ ػ‬ٚ)‫ؼ‬ٚ‫ ٕ٘بیٍٍف ثىبـ ـ‬ٝ‫ یه ٔىبٖ اق ِفط‬ٝ‫ خؽیؽ ث‬ٜ‫دف‬ٙ‫ خبیی یه د‬ٝ‫ا٘ؽ ثفای خب ث‬ٛ‫ایٗ ٔشؽ ٔی س‬
ٝ‫یٓ) ٌىُ وّی آٖ ث‬ٞ‫ آٖ ٔی ؼ‬ٝ‫ ثف ضىت دیىىُ ث‬ٝ‫ؽ و‬ٞ‫بی ػؽؼی ا٘دبْ ٔی ؼ‬ٞ‫ اق دبـأشف‬ٜ‫ـا ثب اوشفبؼ‬
5‫ـر قیف اوز‬ِٛ
window.moveBy(x-pixels,y-pixels);
5 4(,2 َ‫ٔثب‬
<body>
<form>
<input type="button" value="Move Window"
onclick="window.moveBy(50,50);" />
<br /><br />
</form>
</body>

‫ٔثبَ ثبال ٌٕب ؼ‪ ٚ‬ؼوٕ‪ٔ ٝ‬ی ثبٌؽ یىی اق آ٘‪ٟ‬ب ثب ٘بْ ‪ Move Window‬و‪ٚ ٝ‬ظیف‪ ٝ‬خبث‪ ٝ‬خبیی ث‪ ٝ‬ا٘ؽاق‪ٜ‬‬
‫‪ 0+‬دیىىُ ؼـ ـاوشبی ٔط‪ٛ‬ـ‪ٞ‬بی ‪ X_Y‬ـا ثفػ‪ٟ‬ؽ‪ ٜ‬ؼاـؼ ‪ ٚ‬ؼیٍفی ثب ٘بْ ‪ٚ Close Window‬ظیف‪ ٝ‬ثىشٗ‬
‫د‪ٙ‬دف‪ )ٜ‬ایٗ ٔشؽ ٕٔىٗ اوز ـ‪ٚ‬ی ثؼٕی اق ٔف‪ٚ‬ـٌف‪ٞ‬ب وبـ ٘ى‪ٙ‬ؽ)‬
‫‪The moveTo() Method‬‬
‫ایٗ ٔشؽ ٔی س‪ٛ‬ا٘ؽ ثفای ا٘شمبَ یه د‪ٙ‬دف‪ ٜ‬خؽیؽ ث‪ ٝ‬یه ٔىبٖ اق ِفط‪ٕ٘ ٝ‬بیٍٍف ثىبـ ـ‪ٚ‬ؼ)‪ ٚ‬ایٗ ػُٕ ـا ثب‬
‫اوشفبؼ‪ ٜ‬اق دبـأشف‪ٞ‬بی ػؽؼی ا٘دبْ ٔی ؼ‪ٞ‬ؽ و‪ ٝ‬ثف ضىت دیىىُ ث‪ ٝ‬آٖ ٔی ؼ‪ٞ‬یٓ) ففق ایٗ ٔشؽ ثب ٔشؽ ثبال‬
‫ؼـ ایٗ اوز و‪ ٝ‬ایٗ ٔشؽ س‪ٟٙ‬ب یه ثبـ اخفا ٔی ٌ‪ٛ‬ؼ ٌىُ وّی آٖ ث‪ِٛ ٝ‬ـر قیف اوز‪5‬‬
‫;)‪window.moveTo(x-value,y-value‬‬
‫ثفای ؼـن ث‪ٟ‬شف ث‪ٔ ٝ‬ثبَ قیف ؼلز ٕ٘بییؽ‪5‬‬
‫ٔثبَ ‪5 4(,3‬‬
‫>‪<body‬‬
‫‪I am a new window! I am newer than that old window‬‬
‫!‪that opened me, so I am special. Ha, ha‬‬
‫>‪<form‬‬
‫"‪<input type="button" value="Move Window‬‬
‫>‪onclick="window.moveTo(50,50);" /‬‬
‫>‪<br /><br /‬‬
‫"‪<input type="button" value="Close Window‬‬
‫>‪onclick="window.close();" /‬‬
‫>‪</form‬‬
‫>‪</body‬‬
‫ایٗ ٔشؽ ٕٔىٗ اوز ـ‪ٚ‬ی ثؼٕی اق ٔف‪ٚ‬ـٌف‪ٞ‬ب وبـ ٘ى‪ٙ‬ؽ)‬
‫‪The resizeBy() Method‬‬

‫ایٗ ٔشؽ ثفای سغییف ا٘ؽاق‪ ٜ‬یه د‪ٙ‬دف‪ ٜ‬ثىبـ ٔی ـ‪ٚ‬ؼ ‪٘ ٚ‬ط‪ ٜٛ‬ػّٕىفؼ ‪ ٚ‬ؼـیبفز دبـأشف آٖ ‪ٕٞ‬ب٘‪ٙ‬ؽ ٔشؽ‬
‫)(‪ٔ moveBy‬ی ثبٌؽ)ٌىُ وّی آٖ ثّ‪ٛ‬ـر قیف ٔی ثبٌؽ)‬

window.resizeBy(x-value,y-value);
5 4(,4 َ‫ٔثب‬
<body>
<form>
<input type="button" value="Resize Window"
onclick="window.resizeBy(50,50);" />
<br /><br />
</form>
</body>
ٖ‫ ػفْ آ‬ٚ َٛ٘ ٝ‫ دیىىُ ث‬0+ ٜ‫ ا٘ؽاق‬ٝ‫ ث‬Resize Window ٕٝ‫ی ؼو‬ٚ‫فثبـ وّیه ثف ـ‬ٞ ‫ؼـ ٔثبَ ثبال ثب‬
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ؼ‬ٚ‫افك‬
The resizeTo() Method
‫ؽ ٔشؽ‬ٙ٘‫ٕب‬ٞ ٖ‫ ؼـیبفز دبـأشف آ‬ٚ ‫ ػّٕىفؼ‬ٜٛ‫ ٘ط‬ٚ ‫ؼ‬ٚ‫ ثىبـ ٔی ـ‬ٜ‫دف‬ٙ‫ یه د‬ٜ‫ایٗ ٔشؽ ثفای سغییف ا٘ؽاق‬
)‫ـر قیف ٔی ثبٌؽ‬ّٛ‫ ٔی ثبٌؽ)ٌىُ وّی آٖ ث‬moveTo()
window.resizeTo(x-value,y-value);
The setInterval() Method
ٝ‫ ثف ضىت ٔیّی ثب٘ی‬ٝ‫ دبـأشف قٔب٘ی و‬ٝ‫ ث‬ٝ‫خ‬ٛ‫ ثب س‬ٝ‫ؽ و‬ٞ‫ ـا ا٘دبْ ٔی ؼ‬ٝ‫ایٗ ٔشؽ ؼـ ضمیمز وبـ یه ضّم‬
ُ‫ ٕ٘بییٓ)ٌى‬ٜ‫ اوشفبؼ‬clearInterval() ‫ اق ٔشؽ‬ٝ‫ؼ سب قٔب٘ی و‬ٌٛ ‫ـر ٔىفـ اخفا ٔی‬ِٛ ٝ‫یٓ ث‬ٞ‫ آٖ ٔیؽ‬ٝ‫ث‬
5‫ـر قیف اوز‬ِٛ ٝ‫وّی ایٗ ٔشؽ ث‬
window.setInterval("function()",time);

5 4(-+ َ‫ٔثب‬
<body>
function annoy_alert() {
window.alert("Am I bothering you yet?");
}
window.setInterval("annoy_alert()",10000);
</script>
</body>
)‫ ٕ٘بیً ؼـ ٔی آیؽ‬ٝ‫ٍؽاـی ثفای وبـثف ث‬ٞ ْ‫ یه ثبـ دیب‬ٝ‫ ثب٘ی‬ٜ‫ف ؼ‬ٞ ‫ؼـ ٔثبَ ثبال‬
The clearInterval() Method
‫ـر قیف ٔی‬ِٛ ٝ‫ؼ)ٌىُ وّی آٖ ث‬ٌٛ ‫ ٔی‬ٜ‫ اوشفبؼ‬setInterval() ‫اق ایٗ ٔشؽ ثفای اق وبـ ا٘ؽاغشٗ ٔشؽ‬
5‫ثبٌؽ‬
window.clearInterval(name);
)‫ اوز‬ٜ‫ ٌؽ‬ٜ‫ ٘ىجز ؼاؼ‬setInterval() ٝ‫ ث‬ٝ‫یؽ و‬ٙ‫اـؼ و‬ٚ ‫ ٘بْ ٔشؽ یب ٔشغییف ـا‬name ‫ خبی‬ٝ‫ٌٕب ثبیؽ ث‬
5 4(-, َ‫ٔثب‬
<body>
window.alert("Am I bothering you yet?");
}
var madness = window.setInterval("annoy_alert()",10000);
</script>
Click the button below to end the endless barrage of
alerts.<br />
<form>
<input type="button" value="Stop the Madness!"
onclick="window.clearInterval(madness);" />
</form>
</body>

)‫ؼ‬ٌٛ ‫لف ٔی‬ٛ‫ ٔش‬setInterval() ‫ ٔشؽ‬Stop the Madness ٕٝ‫ ٔطٓ قؼٖ ؼو‬ٝ‫ؼـ ٔثبَ ثبال ث‬
The setTimeout() Method
)‫ؼ‬ٌٛ ‫ب یه ثبـ اخفا ٔی‬ٟٙ‫ س‬ٝ‫ر و‬ٚ‫ ثب ایٗ سفب‬setInterval() ‫ؽ ٔشؽ‬ٙ٘‫ٕب‬ٞ
5 4(-- َ‫ٔثب‬
<body>
window.alert("Sign my guest book NOW!");
}
var theguest = window.setTimeout("annoy_alert()",10000);
</script>
</body>
The clearTimeout() Method
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ اوشفبؼ‬setTimeout() ‫اق ایٗ ٔشؽ ثفای اق وبـ ا٘ؽاغشٗ ٔشؽ‬
5 4(-. َ‫ٔثب‬
<body>
window.alert("Sign my guest book NOW!");
}
var theguest = window.setTimeout("annoy_alert()",10000);
</script>
Click the button below within 10 seconds to avoid an alert
message.<br />
<form>
<input type="button" value="No Alert for Me!"
onclick="window.clearTimeout(theguest);" />
</form>
</body>


ِ‫ آرای‬: ‫فصل دّن‬

‫آرایِ‬
‫یه ـا‪ ٜ‬ؾغیف‪ ٜ‬وبقی ػ‪ٙ‬بِف اق یه ٘‪ٛ‬ع ثفای ؼوشفوی وفیغ ‪ ٚ‬آوبٖ ؼـ ٔ‪ٛ‬الغ ٔػشّف آـای‪ ٝ‬اوز) ؼـ‬
‫خب‪ٚ‬ا اوىفیذز ـ‪ٚ‬ي ‪ٞ‬بی ٔػشّفی ثفای ایدبؼ آـای‪ٞ ٝ‬ب ‪ٕٞ ٚ‬س‪ٙ‬یٗ ؼوشفوی ث‪ ٝ‬آ٘‪ٟ‬ب ‪ٚ‬خ‪ٛ‬ؼ ؼاـؼ) وبؼ‪ ٜ‬سفیٗ‬
‫٘‪ٛ‬ع یه آـای‪ ' ٝ‬آـای‪ ٝ‬ی یه ثؼؽی ٔی ثبٌؽ و‪ ٝ‬ؼوشفوی ث‪ ٝ‬ػ‪ٙ‬بِف آٖ ث‪ ٝ‬ـاضشی ‪ ٚ‬ثب اوشفبؼ‪ ٜ‬اق ای‪ٙ‬ؽوه آ٘‪ٟ‬ب‬
‫ِ‪ٛ‬ـر ٔی ٌیفؼ)‬
‫ًاهگذاری یک آرایِ‬
‫٘بٍٔؿاـی آـای‪ٞ ٝ‬ب ‪ٕٞ‬ب٘‪ٙ‬ؽ ٘بٍٔؿاـی ٔشغیف‪ٞ‬ب ' اٌیب ‪ ٚ‬س‪ٛ‬اثغ ٔی ثبٌؽ ‪ ٚ‬اق ل‪ٛ‬ا٘یٗ ٘بٍٔؿاـی ٌفش‪ٌ ٝ‬ؽ‪ ٜ‬ؼـ‬
‫ٔ‪ٛ‬ـؼ آ٘‪ٟ‬ب ٘یك دیف‪ٚ‬ی ٔی و‪ٙ‬ؽ)ٔب٘‪ٙ‬ؽ اخش‪ٙ‬بة اق آ‪ٚ‬ـؼٖ اػؽاؼ ؼـ اثشؽای ٘بْ آـای‪ ٝ‬یب اوشفبؼ‪ ٜ‬اق فٕبی غبِی ‪ٚ‬‬
‫وّٕبر ـقـ‪ٌ ٚ‬ؽ‪)ٜ‬‬
‫تؼزیف یک آرایِ‬
‫سؼفیف یه آـای‪ ٝ‬ث‪ ٝ‬وبؼٌی سؼفیف ‪ٞ‬ف ٔشغیف ؼیٍفی ِ‪ٛ‬ـر ٔی ٌیفؼ) ٔب٘‪ٙ‬ؽ ‪5‬‬
‫;)‪var arrayname = new Array(element0,element1‬‬
‫ٔثبَ ‪5,+(,‬‬
‫;)"‪var s_list = new Array("Thomas","Roger","Amber","Jennifer‬‬
‫ؼـ ٔثبَ ثبال یه آـای‪ ٝ‬ث‪٘ ٝ‬بْ ‪ ٚ s_list‬ثب ز‪ٟ‬بـ ػ‪ّٙ‬ف سؼفیف وفؼ‪ ٜ‬ایٓ)‬
‫دستزسی تِ اجشای آرایِ‬
‫ثفای ؼوشفوی ث‪ ٝ‬ػ‪ٙ‬بِف یه آـای‪ ٝ‬یه ثؼؽی ٔی س‪ٛ‬اٖ اق ای‪ٙ‬ؽوه آ٘‪ٟ‬ب اوشفبؼ‪ ٜ‬وفؼ ٔب٘‪ٙ‬ؽ‪5‬‬
‫;]‪var varname = arrayname[0‬‬

5,+(- َ‫ٔثب‬
<body>
var s_list = new Array("Thomas","Roger","Amber","Jennifer");
var tall_student = s_list[0];
document.write("The tallest student in class is
"+tall_student);
</script>
</body>
‫ وذه آٖ ـا ؼـ‬ٚ ٓ‫ی‬ٙ‫ ؼوشفوی دیؽا ٔی و‬ٝ‫َ آـای‬ٚ‫ ا‬ٝ٘‫ غب‬ٝ‫ ث‬s_list[0] ‫ اق وؽ‬ٜ‫ ثب اوشفبؼ‬ٚ ‫ؼـ ٔثبَ ثبال‬
)ٓ‫ی‬ٞ‫خی ٕ٘بیً ٔی ؼ‬ٚ‫بیز آٖ ـا ؼـ غف‬ٟ٘ ‫ ؼـ‬ٚ ٓ‫ ٔی ٕ٘بیی‬ٜ‫ ؾغیف‬tall_student
5,+(. َ‫ٔثب‬
<body>
var s_list = new Array("Thomas","Roger","Amber","Jennifer");
document.write("The tallest student in class is "+s_list[0]);
</script>
</body>
ً‫خی ٕ٘بی‬ٚ‫ ؼـ یه ٔشغییف غبـخی آٖ ـا ٔىشمیٕب ؼـ غف‬s_list[0] ٖ‫ وفؼ‬ٜ‫ٖ ؾغیف‬ٚ‫ؼـ ٔثبَ ثبال ثؽ‬
)‫ اوز‬Thomas ‫دب‬ٙ‫ ؼـ ای‬ٝ‫ ٔمؽاـ آٖ ـا و‬ٝ‫یٓ' اِجش‬ٞ‫ٔی ؼ‬
ِ‫دیگز راُ ّای تؼزیف آرای‬
‫یٓ وذه ؼـ‬ٞ‫ آٖ اغشّبَ ؼ‬ٝ‫ـؼ ٘یبق ـا ث‬ٛٔ ‫ اثشؽا فٕبی‬ٝ‫ ایٗ اوز و‬ٝ‫بی سؼفیف آـای‬ٞ ٜ‫یىی ؼیٍف اق ـا‬
)ٓ‫ٖ ٕ٘بیی‬ٛ‫ آٖ ٔفث‬ٝ‫لغ ٘یبق ٔمبؼیف ـا ث‬ٛٔ
5,+(/ َ‫ٔثب‬
var s_list = new Array(4);

‫ؼـ ٔثبَ ثبال یه آـای‪ ٝ‬ث‪٘ ٝ‬بْ ‪ ٚ s_list‬ز‪ٟ‬بـ غب٘‪ ٝ‬ثفای آٖ ایدبؼ ٕ٘‪ٛ‬ؼ‪ ٜ‬ایٓ)‬
‫ضبَ ٔی س‪ٛ‬ا٘یٓ ث‪ٞ ٝ‬فیه اق غب٘‪ٞ ٝ‬بی آٖ ٔمؽاـی ـا ٔ‪ٙ‬شّت ٕ٘بییٓ ‪ ٚ‬ضشٕب القْ ٘یىز و‪ ٝ‬ایٗ اسّبة‬
‫‪ٞ‬ب ث‪ ٝ‬سفسیت ثبٌ‪ٙ‬ؽ)‬
‫;"‪s_list[2] = "Amber‬‬
‫;"‪s_list[4] = "Pat‬‬
‫ـا‪ ٜ‬و‪ ْٛ‬ثفای سؼفیف آـای‪ ٝ‬ای‪ٙ‬ىز و‪ ٝ‬اثشؽا فٕبی ٔ‪ٙ‬بوت ـا ث‪ ٝ‬آٖ اغشّبَ ؼ‪ٞ‬یٓ ‪ ٚ‬ثالفبِّ‪ٔ ٝ‬مبؼیف ـا‬
‫ث‪ ٝ‬آٖ اسّبَ ؼ‪ٞ‬یٓ)‬
‫ٔثبَ ‪5,+(0‬‬
‫;)‪var s_list = new Array(4‬‬

‫;"‪s_list[0]="Thomas‬‬
‫;"‪s_list[1]="Roger‬‬
‫;"‪s_list[2]="Amber‬‬
‫;"‪s_list[3]="Jennifer‬‬
‫ایدبؼ یه آـای‪ ٝ‬فمٗ ثب اوشفبؼ‪ ٜ‬اق اغشّبَ یه ٘بْ ‪ ٚ‬ثؽ‪ ٖٚ‬ؼـ ٘ظف ٌففشٗ فٕب ثفای ؾغیف‪ ٜ‬وبقی ػ‪ٙ‬بِف‬
‫آٖ ٘یك یىی اق ـا‪ٞ ٜ‬بی سؼفیف آـای‪ٔ ٝ‬ی ثبٌؽ)‬
‫ٔثبَ ‪5,+(1‬‬
‫;)(‪var s_list = new Array‬‬
‫ؼـ ایٗ ـ‪ٚ‬ي ٔی س‪ٛ‬ا٘یٓ ثؼؽا ‪ ٚ‬ؼـ ٌفایٗ ٔػشّف ٔمبؼیف ٔشفب‪ٚ‬سی ـا ث‪ ٝ‬آٖ اغشّبَ ؼ‪ٞ‬یٓ)‬

5,+(2 َ‫ٔثب‬
var s_list= new Array();

var x = 17;
var y = x+2;
var my_message = "Hi!";
s_list[0]="Thomas";
5,+(3 َ‫ٔثب‬
var s_list = new Array();

var x = 17;
var y = x+2;
var my_message = "Hi!";
s_list[29]="Thomas";
ِ‫ٍیژگی ّا ٍ هتذّای آرای‬
)‫ ٔی ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫ ـا ٍٔب‬ٝ‫ آـای‬ٝ‫ٖ ث‬ٛ‫بی ٔفث‬ٞ ‫یمٌی‬ٚ ‫َ قیف‬ٚ‫ؼـ خؽ‬
constructor Refers to the constructor function used to create an instance of an
object
index Used when an array is created by a regular expression match
input Used when an array is created by a regular expression match
length Contains a numeric value equal to the number of elements in an
array
prototype Allows the addition of properties and methods to objects such as
the JavaScript
Array object
The constructor
)‫ ـا ٔی وبق٘ؽ‬ٝ‫ یه آـای‬ٝ‫بیی اوز و‬ٞ‫ایٗ غبِیز ٌبُٔ سٕبْ وؽ‬
function Array() { [native code] }

‫ وّیؽی‬ّٕٝ‫ ثؼؽ اق آٖ و‬ٚ ٝٙ‫ وذه ٘م‬ٚ ٝ‫ ایٗ غبِیز ٌٕب ثبیؽ اق ٘بْ آـای‬ٝ‫ثفای ؼوشفوی ث‬
)‫ ٕ٘بییؽ‬ٜ‫ اوشفبؼ‬constructor
5,+(4 َ‫ٔثب‬

window.alert(s_list.constructor);
The length
)‫اٖ ٔمؽاـ ثف ٔی ٌفؼا٘ؽ‬ٛٙ‫ ػ‬ٝ‫ ـا ث‬ٝ‫ایٗ غبِیز سؼؽاؼ اخكای آـای‬
5,+(,+ َ‫ٔثب‬
var s_list = new Array(4)

s_list[0]="Thomas";
s_list[1]="Roger";
s_list[2]="Amber";
s_list[3]="Jennifer";
window.alert("The array has "+s_list.length+" elements");
The prototype
‫ؽ سب‬ٞ‫ ٔی ؼ‬ٜ‫ ٌٕب اخبق‬ٝ‫ ٔی ثبٌؽ)ایٗ غبِیز ث‬prototype ‫ ' غبِیز‬ٝ‫بی آـای‬ٞ ‫یىی ؼیٍف اق غبِیز‬
)‫ ٕ٘بییؽ‬ٝ‫ب أبف‬ٞ ٝ‫ آـای‬ّٕٝ‫ اق خ‬ٝ‫ؼ ؼـ ِفط‬ٛ‫خ‬ٛٔ ‫ اخكای‬ٝ‫بی ٔػشّفی ـا ث‬ٞ‫ ٔشؽ‬ٚ ‫یمٌی‬ٚ
Array.prototype.new_property=default_value;
5,+(,, َ‫ٔثب‬
Array.prototype.attitude = "cool";
window.alert("This place is "+s_list.attitude);

5,+(,- َ‫ٔثب‬
Array.prototype.attitude = "cool";
window.alert("This place is "+s_list.attitude);
5,+(,. َ‫ٔثب‬
var fish = new Array();

fish.attitude = "wide-eyed";
window.alert("Fish are "+fish.attitude);
ِ‫هتذّای آرای‬
ٚ ‫ب‬ٞ ٝ‫بی آـای‬ٞ‫ سب ٔشؽ‬ٜ‫لز آٖ ـویؽ‬ٚ ‫ب ٌؽیؽ‬ٌٙ‫ آ‬ٝ‫بی آـای‬ٞ ‫ غبِیز‬ٚ ‫ب‬ٞ ‫یمٌی‬ٚ ‫ؼی ثب‬ٚ‫ سب ضؽ‬ٝ‫ضبال و‬
)ٓ‫ی‬ٞ‫ـؼ ثفـوی لفاـ ؼ‬ٛٔ ‫ آٖ ـا‬ٜ‫اـؼ اوشفبؼ‬ٛٔ
Method Description
concat() Combines the elements of two or more arrays into one new array
join() Combines the elements of an array into a single string with a separator
character
pop() Removes the last element from an array and then returns the removed
element if needed
push() Adds elements to the end of an array and then returns the numeric value of
the new length of the array if needed
reverse() Reverses the direction of the elements in an array: the first ele
shift() Removes the first element from an array and then returns that element if
needed
unshift() Adds elements to the beginning of an array and returns the numeric value of
the length of the new array if needed
slice() Pulls out a specified section of an array and returns the section as a new array
splice() Removes elements from an array or replaces elements in an array
sort() Sorts the elements of an array into alphabetical order based on the string
values of the elements
toString() Combines the elements of an array into a single string with a comma as a
separator character

The concat() Method
)‫ؼ‬ٚ‫ وبـ ٔی ـ‬ٝ‫ ث‬ٝ‫ؽ آـای‬ٙ‫ یب ز‬ٚ‫ایٗ ٔشؽ ثفای زىجب٘ؽٖ ؼ‬
5,+(,/ َ‫ٔثب‬
var fruits = new Array("oranges","apples");

var veggies = new Array("corn","peas");
var fruits_n_veggies = fruits.concat(veggies);
)‫ؼ‬ٌٛ ٝ‫ٌش‬ٛ٘ ‫٘ؽ ثبیؽ ٘بْ آٖ ؼـ اثشؽا‬ٌٛ ٜ‫ـؼ‬ٚ‫ ؼـ اثشؽا آ‬ٝ‫یؽ اخكای یه آـای‬ٞ‫ا‬ٛ‫ ثػ‬ٝ‫ى‬ٙ‫ثفای ای‬
5,+(,0 َ‫ٔثب‬

var fruits_n_veggies = veggies.concat(fruits);
)‫٘ؽ‬ٌٛ ‫ ٔی‬ٜ‫ـؼ‬ٚ‫ آ‬veggies ‫ ی‬ٝ‫ؼـ ٔثبَ ثبال اثشؽا اخكای آـای‬
) ٓ‫ی‬ٙ‫ي قیف ػُٕ ٔی و‬ٚ‫ ـ‬ٝ‫ٓ ث‬ٞ ٝ‫ آـای‬ٝ‫ثفای اسّبَ و‬
5,+(,1 َ‫ٔثب‬

var meats = new Array("fish","chicken");
var three_groups = fruits.concat(veggies,meats);
)‫ ٔی ثبٌؽ‬oranges, apples, corn, peas, fish, chicken ‫ ٔثبَ ثبال‬ٝ‫٘شید‬

5,+(,2 َ‫ٔثب‬

var meats = new Array("fish","chicken");
var three_groups = meats.concat(veggies,fruits);
)‫ؼ‬ٌٛ ‫ ٔی‬fish, chicken, corn, peas, oranges, apples ٝ‫ؼـ ٔثبَ ثبال ٘شید‬
The join() Method

‫ ایٗ ٔشؽ ٔی‬ّٝ‫وی‬ٚ ٝ‫یٗ ث‬ٙ‫ٕس‬ٞ )‫ؼ‬ٚ‫ وبـ ٔی ـ‬ٝ‫ ث‬ٝ‫ ؼـ یه ـٌش‬ٝ‫ایٗ ٔشؽ ثفای سفویت اخكای یه آـای‬
)ٓ‫ی‬ٞ‫ٓ سغییف ؼ‬ٞ ‫ ـا‬ٝ‫بی ثیٗ اخكای آـای‬ٞ ٜ‫ؽ‬ٙٙ‫ا٘یٓ خؽاو‬ٛ‫س‬
5,+(,3 َ‫ٔثب‬
<body>
var fruits = new Array("oranges","apples","pears");
var fruit_string = fruits.join();
document.write("The new string is "+fruit_string);
</script>
</body>
)‫ؼ‬ٌٛ ‫ سفویت ٔی‬The new string is ٝ‫ ثب ـٌش‬fruits ‫ ی‬ٝ‫ؼـ ٔثبَ ثبال آـای‬
5,+(,4 َ‫ٔثب‬
<body>
var fruit_string = fruits.join(":");
document.write("The new string is "+fruit_string);
</script>
</body>
)‫ؽ‬ٙ‫" سغییف دیؽا ٔی و‬:" ٝ‫ ث‬ٝ‫بی اخكای آـای‬ٞ ٜ‫ؽ‬ٙٙ‫ؼـ ٔثبَ ثبال خؽاو‬

The pop() Method

)‫ؼ‬ٚ‫ وبـ ٔی ـ‬ٝ‫ ث‬ٝ‫ایٗ ٔشؽ ثفای ضؿف وفؼٖ آغفیٗ خكء یه آـای‬
5,+(-+ َ‫ٔثب‬

fruits.pop();
)‫ؼ‬ٌٛ ‫ ضؿف ٔی‬fruits ‫ ی‬ٝ‫ اق آـای‬pears َ‫ؼـ ایٗ ٔثب‬
5,+(-, َ‫ٔثب‬

var picked_fruit = fruits.pop();
window.alert("You picked my "+picked_fruit);
The push() Method
)‫ؼ‬ٚ‫ ثىبـ ٔی ـ‬ٝ‫بی یه آـای‬ٟ‫ ا٘ش‬ٝ‫ وفؼٖ یه خكء ث‬ٝ‫ایٗ ٔشؽ ثفای أبف‬
5,+(-- َ‫ٔثب‬

fruits.push("pears");
5,+(-. َ‫ٔثب‬

fruits.push("pears","grapes");
5,+(-/ َ‫ٔثب‬

var who_knows = fruits.push("pears","grapes");

window.alert("The method returned "+who_knows);
The reverse() Method
)‫ؽ‬ٙ‫ن ٔی و‬ٛ‫ ـا ٔؼى‬ٝ‫ایٗ ٔشؽ سفسیت اخكای یه آـای‬
5,+(-0 َ‫ٔثب‬

fruits.reverse();
The shift() Method
)‫ؽ‬ٙ‫ ـا ضؿف ٔی و‬ٝ‫ّف اثشؽایی آـای‬ٙ‫ ػ‬ٝ‫ر و‬ٚ‫ؽ ثب ایٗ سفب‬ٙ‫ ػُٕ ٔی و‬pop ‫ؽ ٔشؽ‬ٙ٘‫ٕب‬ٞ ‫ایٗ ٔشؽ‬
5,+(-1 َ‫ٔثب‬

fruits.shift();
5,+(-2 َ‫ٔثب‬

var picked_fruit=fruits.shift();
window.alert("You picked my "+picked_fruit);
ٝ‫٘شید‬
You picked my orang

‫‪The slice() Method‬‬

‫ایٗ ٔشؽ ‪ٍٙٞ‬بٔی ٔفیؽ اوز و‪ ٝ‬ثػ‪ٛ‬ا‪ٞ‬یٓ لىٕشی اق یه آـای‪ ٝ‬ـا خؽا وفؼ‪ ٚ ٜ‬ث‪ ٝ‬ػ‪ٛٙ‬اٖ آـای‪ ٝ‬ای ؼیٍف‬
‫ٔدكا اق آـای‪ ٝ‬ا‪ َٚ‬ؾغیف‪ٕ٘ ٜ‬بییٓ)‬
‫)‪arrayname.slice(start,stop‬‬
‫ٔثبَ ‪5,+(-3‬‬
‫;)"‪var fruits = new Array("oranges","apples","pears","grapes‬‬

‫;)‪var somefruits = fruits.slice(1,3‬‬
‫٘شید‪ٝ‬‬
‫‪apples , pears‬‬
‫‪The splice() Method‬‬

‫ایٗ ٔشؽ ث‪ٌٕ ٝ‬ب اخبق‪ ٜ‬ضؿف یب خبیٍكی‪ٙ‬ی ػ‪ٙ‬بِف یه آـای‪ ٝ‬ـا ٔی ؼ‪ٞ‬ؽ) دبـأشف‪ٞ‬بیی و‪ٔ ٝ‬ی س‪ٛ‬ا٘یؽ ث‪ ٝ‬ایٗ‬
‫ٔشؽ اـوبَ و‪ٙ‬یؽ ػجبـس‪ٙ‬ؽ اق ٌٕبـ‪ ٜ‬ای‪ٙ‬ؽوه ػ‪ّٙ‬فی و‪ٔ ٝ‬ی غ‪ٛ‬ا‪ٞ‬یؽ ػّٕیبر اق آ٘دب ٌف‪ٚ‬ع ٌ‪ٛ‬ؼ' سؼؽاؼ اخكایی‬
‫و‪ٔ ٝ‬ی غ‪ٛ‬ا‪ٞ‬یؽ ضؿف ٌ‪٘ٛ‬ؽ ‪ ٚ‬ؼـ ٘‪ٟ‬بیز ‪ٚ‬یمٌی ‪ٞ‬بی ػ‪ّٙ‬ف خؽیؽی و‪ٔ ٝ‬ی غ‪ٛ‬ا‪ٞ‬یؽ ث‪ ٝ‬آـای‪ ٝ‬أبف‪ٕ٘ ٝ‬بییؽ)‬
‫ٔثبَ ‪5,+(-4‬‬

‫;)‪var somefruits = fruits.splice(2,1‬‬
‫ؼـ ٔثبَ ثبال ‪ splice‬وفؼٖ اق اق ػ‪ّٙ‬ف و‪ٌ "pears" ْٛ‬ف‪ٚ‬ع ٌؽ‪ ٚ ٜ‬ؼـ ‪ٕٞ‬ب٘دب ‪ ٓٞ‬غبسٕ‪ٔ ٝ‬ی یبثؽ ‪ ٚ‬ؼـ‬
‫٘شید‪ ٝ‬ثبػث ضؿف آٖ ٔی ٌ‪ٛ‬ؼ)‬
‫٘ىش‪ 5 ٝ‬ای‪ٙ‬ؽوه اخكای آـای‪ ٝ‬اق ِفف ٌف‪ٚ‬ع ٔی ٌ‪ٛ‬ؼ)‬
‫ٔثبَ ‪5,+(.+‬‬

var somefruits = fruits.splice(2,2);
"pears"ْٛ‫ّف و‬ٙ‫ ثف ػ‬ٜٚ‫ ػال‬ٝ‫ر و‬ٚ‫ؼ ثب ایٗ سفب‬ٌٛ ‫ع ٔی‬ٚ‫ْ ػّٕیبر ٌف‬ٛ‫ّف و‬ٙ‫ؽ ٔثُ ثبال اق ػ‬ٙ٘‫ٕب‬ٞ
)‫ؼ‬ٌٛ ‫" ٘یك ضؿف ٔی‬grapes" ‫ی‬ٙ‫بـْ یؼ‬ٟ‫ّف ز‬ٙ‫ػ‬
5,+(., َ‫ٔثب‬
var fruits = new Array("oranges","apples","pears","grapes");

var somefruits = fruits.splice(2,1,"watermelons");
ٝ‫ ث‬watermelons ‫ّف‬ٙ‫ ثؼؽ ػ‬ّٝ‫ؼ)وذه ؼـ ٔفض‬ٌٛ ‫ ضؿف ٔی‬ٝ‫ اق آـای‬pears ‫ّف‬ٙ‫َ ػ‬ٚ‫ ا‬ّٝ‫ؼـ ٔفض‬
)‫ٕبٖ ٔىبٖ خبیٍكیٗ ٔی ٌفؼؼ‬ٞ ‫ ؼـ‬ٚ ٖ‫خبی آ‬
5,+(.- َ‫ٔثب‬

var somefruits = fruits.splice(2,0,"watermelons","plums");
alert(somefruits);
document.write(fruits);
‫ ٔی‬ٝ‫ آٖ أبف‬ٝ‫ ٘یك ث‬plums ٚ watermelons ‫بِف‬ٙ‫ ػ‬ٝ‫ؼ ثّى‬ٌٛ ‫ ضؿف ٕ٘ی‬ٝ‫ّفی اق آـای‬ٙ‫یر ػ‬ٞ
)‫ٌفؼ٘ؽ‬
The sort() Method
)‫ؼ‬ٚ‫ ثىبـ ٔی ـ‬ٝ‫ثفای ٔفست وفؼٖ اخكای یه آـای‬
5,+(.. َ‫ٔثب‬

fruits.sort();

The toString Method
ٝ‫ یه ـٌش‬ٝ‫ ث‬ٝ‫سجؽیُ اخكای آـای‬
5,+(./ َ‫ٔثب‬

var fruit_list = fruits.toString();
document.write(fruit_list);
‫هتذّای تیطتز‬
‫ف‬ٞ ‫ ٔی ٕ٘بییؽ) ؼـ‬ٜ‫ؽ‬ٞ‫َ قیف ٍٔب‬ٚ‫ ؼـ خؽ‬ٝ‫ؼ ؼاـؼ و‬ٛ‫خ‬ٚ ‫ ثبالسف یه وفی ٔشؽ‬ٚ ,)1 ‫ااوىفیذز‬ٚ‫ؼـ خب‬
‫ؽ ؼـ‬ٌٙ‫ ثب‬ٝ‫ یب ٘شبیح یىىب٘ی ٘ؽاٌش‬ٚ ‫ؽ‬ٙٙ‫ ؼـوشی وبـ ٘ى‬ٝ‫ب ث‬ٞ‫ـٌف‬ٚ‫ب ٕٔىٗ اوز ؼـ سٕبْ ٔف‬ٞ‫ـر ایٗ ٔشؽ‬ِٛ
)‫یؽ‬ٙ‫ب ثب اضشیبٖ ـفشبـ و‬ٟ٘‫ اق آ‬ٜ‫ ؼـ اوشفبؼ‬ٝ‫٘شید‬
Method Description
filter() Returns a new array containing elements from an array that returned true
based on the function used to filter it
forEach() Calls a specified function for each element in the array
every() Returns true if all elements in the array return true for the specified
function used to test them
indexOf() Returns the lowest index number for an element that has a value equal to
the specified value sent as a parameter
lastIndexOf() Returns the highest index number for an element that has a value equal to
the specified value sent as a parameter
map() Returns a new array that results from calling a specified function on every
element in the array
reduce() Runs a function on two values in the array at a time, from left to right,
until only a single value is left
reduceRight() Runs a function on two values in the array at a time, from right to left,
until only a single value is left
some() Returns true if one or more elements return true for the specified function
used to test them

‫ساخت اجشای آرایِ تا استفادُ اس حلقِ ّا‬
‫ـ‬ٛ٘ ٝ‫بیی ـا ث‬ٞ ٜ‫یؽ ؼاؼ‬ٞ‫ا‬ٛ‫ ٔثال ٌٕب ثػ‬ٝ‫ؼ و‬ٌٛ ‫ قٔب٘ی ٔفیؽ ٔی‬ٝ‫ب ثفای وبغز آـای‬ٞ ٝ‫ اق ضّم‬ٜ‫اوشفبؼ‬
)‫یؽ‬ٙ‫اَ و‬ٛ‫دیبدی اق وبـثف و‬
5,+(.0 َ‫ٔثب‬

for(var count=0;count<4;count++) {
s_list[count] = window.prompt("Enter a name","");
}
document.write(s_list);
‫بـ ثب سىفاـ ٔی ٌفؼؼ‬ٟ‫ ایٗ ػُٕ ز‬ٚ ‫ؽ‬ٞ‫اـؼ وفؼٖ یه اوٓ ـا ٔی ؼ‬ٚ ‫اوز‬ٛ‫ اق وبـثف ؼـغ‬ٝٔ‫ؼـ ایٗ ٔثبَ ثف٘ب‬
)‫٘ؽ‬ٌٛ ‫ ٔی‬ٜ‫ ؾغیف‬s_list ٝ‫ ؼـ آـای‬ٜ‫اـؼ ٌؽ‬ٚ ‫بیز اوبٔی‬ٟ٘ ‫ ؼـ‬ٚ
5,+(.1 َ‫ٔثب‬
)‫ی ثیىز‬ٚ‫زىشفٔىب‬ٛ‫ و‬ٚ ‫ج ثكـي سف اق ِفف‬ٚ‫ ٕ٘بیً اػؽاؼ ق‬ٚ ‫بوبیی‬ٌٙ ‫ ثفای‬ٝٔ‫ثف٘ب‬
var even_nums = new Array(10);

var a_count = 0;
for (var count=0;count<20;count+=2) {
even_nums[a_count] = count+2;
a_count ++;
}
document.write(even_nums);
5,+(.2 َ‫ٔثب‬
‫٘ی‬ٛ‫ـر وش‬ّٛ‫قاٖ ث‬ٛٔ‫ٕ٘بیً اوٓ ؼاً٘ آ‬
<body>
<h1>Student Names</h1>

s_list[0]="Thomas";
s_list[1]="Roger";
s_list[2]="Amber";
for(var count=0;count<4;count++) {
document.write(s_list[count]+ "<br />");
}
</script>
</body
)ٓ‫ ٕ٘بیی‬ٜ‫ اوشفبؼ‬for ٝ‫ی ضّم‬ٙ‫ وؽ قیف ثفای خبیٍكی‬ٝ‫ؼ‬ٙ‫ا٘یٓ اق ل‬ٛ‫ ثبال ٔی س‬ٝٔ‫ؼـ ثف٘ب‬
for(var count=0;count<s_list.length;count++)
5,+(.3 َ‫ٔثب‬
ٖ‫قا‬ٛٔ‫ٔفست وفؼٖ اوٓ ؼاً٘ آ‬

s_list[0]="Thomas";
s_list[1]="Roger";
s_list[2]="Amber";
s_list[4]="Pat";
s_list[5]="Kelly";
s_list[6]="Jerry";
s_list.sort();
for(count=0;count<s_list.length;count++) {
document.write(s_list[count]+ "<br />");
}
</script>
5,+(.4 َ‫ٔثب‬

s_list[0]="Thomas";
s_list[1]="Roger";
s_list[2]="Amber";

for (student in s_list) {
document.write(s_list[student] + "<br />");
}
for each ّٝ‫وی‬ٚ ٝ‫یىی وؽ ثبال ث‬ٛ٘‫ثبق‬

s_list[0]="Thomas";
s_list[1]="Roger";
s_list[2]="Amber";
for each (student in s_list) {
document.write(student + "<br />");
}
)Associative Arrays(‫آرایِ ّای ضزکت پذیز‬
‫تؼزیف‬
ٝ‫یٓ) ایٗ آـای‬ٙ‫ی ـا ٔؼففی ٔی و‬ٕٙ‫بی ٌفوز دؿیف یب ا٘د‬ٞ ٝ‫' آـای‬ٝ‫ـؼ آـای‬ٛٔ ‫اٖ آغفیٗ ٔجطث ؼـ‬ٛٙ‫ ػ‬ٝ‫ث‬
)‫ ٔمؽاـ ٔدكایی ـا اغشّبَ ؼاؼ‬ٚ ْ‫ف یه اق اخكای آٖ ٘ب‬ٞ ٝ‫اٖ ث‬ٛ‫ ٔی س‬ٝ‫ؽ و‬ٌٙ‫ب ؼاـای ایٗ غبِیز ٔی ثب‬ٞ
5,+(/+ َ‫ٔثب‬

s_list["tall"]="Thomas";
s_list["cool"]="Roger";
s_list["clever"]="Amber";
s_list["attentive"]="Jennifer";

‫دستزسی تِ آرایِ ّای اًجوٌی‬

)‫ِی ٔی ثبٌؽ‬ٕٛ‫بی ٔؼ‬ٞ ٝ‫ آـای‬ٝ‫بی ؼوشفوی ث‬ٟٞ‫ؽ وبیف ـا‬ٙ٘‫ٓ ٔب‬ٞ ‫ب‬ٞ ٝ‫ اخكای ایٗ آـای‬ٝ‫ؼوشفوی ث‬
5,+(/, َ‫ٔثب‬
<body>
<h1>Student Names</h1>
s_list["tall"]="Thomas";
s_list["cool"]="Roger";
s_list["clever"]="Amber";
s_list["attentive"]="Jennifer";
document.write("The tall one is " +s_list["tall"]+ "<br />");
document.write("The cool one is " +s_list["cool"]+ "<br />");
document.write("The clever one is " +s_list["clever"]+ "<br
/>");
document.write("The attentive one is " +s_list["attentive"]+
"<br />");
</script>
</body>


‫اضیاء ریاضی‬: ‫فصل یاسدّن‬

‫اضیا ریاضی‬
‫ؽ ٌٕب ـا ؼـ‬ٙ٘‫ا‬ٛ‫ ٔی س‬ٝ‫ اوز و‬ٜ‫ ٌؽ‬ٜ‫ ای سؽاـن ؼیؽ‬ٝ‫اثغ اق دیً وبغش‬ٛ‫ س‬ٚ ‫ااوىفیذز اٌیب‬ٚ‫ؼـ خب‬
)‫ؽ‬ٙ‫ؼ یبـی ٕ٘بی‬ٛ‫ٔطبوجبر غ‬
Properties
‫ب ـا ؼـ قیف‬ٟ٘‫ ِیىشی اق آ‬ٝ‫ؽ و‬ٙٞ‫بی قیبؼی ـا ؼـ اغشیبـ ٌٕب لفاـ ٔی ؼ‬ٞ ‫ غبِیز‬ٚ ‫ب‬ٞ ‫یمٌی‬ٚ ‫اٌیب ـیبٔی‬
)‫ ٔی ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫ٍٔب‬
Property Value
E Value of Euler’s constant (E), which is about 2.71828…
LN10 Value of the natural logarithm of 10, which is about 2.302585…
LN2 Value of the natural logarithm of 2, which is about 0.693147…
LOG10E Value of the base 10 logarithm of E, which is about 0.43429…
LOG2E Value of the base 2 logarithm of E, which is about 1.442695…
PI Value of pi, often used with circles, which is about 3.14159…
SQRT2 Value of the square root of 2, which is about 1.4142…
SQRT1_2 Value of the square root of one half, which is about 0.7071…
‫استفادُ اس ٍیژگی ّا‬

‫ ثؼؽ‬ٝ‫یٓ و‬ٙ‫یىی و‬ٛ٘ ٝٔ‫یٓ اوىفیذشی ـا ثف٘ب‬ٞ‫ا‬ٛ‫َ ثبال ٔی غ‬ٚ‫ ؼـ خؽ‬ٜ‫ ٌؽ‬ٝ‫بی ٌفش‬ٞ ‫ یمٌی‬ٚ ‫ اق‬ٜ‫ثب اوشفبؼ‬
)‫ؽ‬ٙ‫ و‬ٝ‫ ٔطیٗ آٖ ـا ٔطبوج‬ٜ‫اـؼ وفؼٖ ٌؼبع یه ؼایف‬ٚ ‫اق‬
5,,(, َ‫ٔثب‬
<body>
<form>
To find the area of a circle, input a radius:<br />
<input type="text" id="radius" />
<input type="button" value="Get the Area!" id="getarea" />
</form>
var area_button = document.getElementById("getarea");
area_button.onclick = function() {
var rad = document.getElementById("radius").value;
if (rad.length < 1) {
window.alert("Please enter a radius!");

return false;
}
else if (rad != (rad*1)) {
window.alert("Radius must be numeric!");
return false;
}
else {
var the_area = Math.PI * (rad * rad);
window.alert("The area is " + the_area + " square units.
");
return false;
}
};
</script>
</body>
ٖ‫اـؼ وفؼ‬ٚ ‫ـر‬ِٛ ‫ ؼـ‬ٚ ‫اوز یه ػؽؼ ٔی ٕ٘بیؽ‬ٛ‫ اق ٌٕب ؼـغ‬ٝ‫ؼ و‬ٌٛ ‫ ثبال اثشؽا وبؼـی ثبق ٔی‬ٝٔ‫ؼـ ثف٘ب‬
‫اـؼ ٍ٘ؽٖ ػؽؼ ِطیص‬ٚ ‫ـر‬ِٛ ‫ ؼـ‬ٝ‫ ٕ٘بیً ؼـ ٔی آیؽ) لبثُ ؾوف اوز و‬ٝ‫آٖ ؼـ وبؼـ ؼیٍفی ٔطیٗ آٖ ث‬
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫بوت ثب آٖ ٕ٘بیً ؼاؼ‬ٙ‫دیبْ ٔش‬
Methods
‫ؼیؽ‬ٛ‫ب ٘ج‬ٟ٘‫ ا٘دبْ آ‬ٝ‫ لجال لبؼـ ث‬ٝ‫ؽ سب ٔطبوجبسی ـا و‬ٙٙ‫ ٌٕب وٕه ٔی و‬ٝ‫ؼ ؼـ ٌی ـیبٔی ث‬ٛ‫خ‬ٛٔ ‫بی‬ٞ‫ٔشؽ‬
)‫یؽ‬ٞ‫ؼ ا٘دبْ ؼ‬ٛ‫بی غ‬ٞ ‫ـا ؼـ اوىفیذز‬
)‫ ٔی ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫ب ـا ٍٔب‬ٟ٘‫فیه اق آ‬ٞ ‫ـؼ‬ٛٔ ‫ٔیطبسی ؼـ‬ٛ‫ س‬ٜ‫ٕفا‬ٞ ٝ‫ب ث‬ٞ‫َ قیف ِیىشی اق ایٗ ٔشؽ‬ٚ‫ؼـ خؽ‬
Method Purpose
abs() Returns the absolute value of the number sent as a parameter
acos() Returns the arccosine of the number sent as a parameter, in radians
asin() Returns the arcsine of the number sent as a parameter, in radians
atan() Returns the arctangent of the number sent as a parameter, in radians
Returns the arctangent of the quotient of two numbers sent as parameters, in
atan2()
radians
Returns the smallest integer greater than or equal to the number sent as a
ceil()
parameter
cos() Returns the cosine of the number sent as a parameter, in radians
Returns the value of E to the power of the number sent to the method as a
exp()
parameter
Returns the largest integer less than or equal to the number sent as a
floor()
parameter
log() Returns the natural logarithm of the number sent as a parameter
max() Returns the larger of the two numbers that are sent as parameters
min() Returns the smaller of the two numbers that are sent as parameters
Returns the numeric value of the first parameter raised to the power of the
pow()
second parameter
random() Returns a random number between 0 and 1; does not require a parameter
Returns the value of the number sent as a parameter rounded to the nearest
round()
integer
sin() Returns the sine of the number sent as a parameter, in radians
sqrt() Returns the square root of the number sent as a parameter
tan() Returns the tangent of the number sent as a parameter, in radians
‫هتذّای اصلی‬
ٝ‫ٖ ٘یبق ث‬ٚ‫ ثؽ‬ٚ ‫اـؼ وفؼٖ یه ػؽؼ‬ٚ ‫ب ثب‬ٟٙ‫ س‬ٝ‫ و‬ٝ‫ؽ و‬ٙ‫ىش‬ٞ ‫بیی‬ٞ‫بی اِّی ؼـ ایٗ وشبة' ٔشؽ‬ٞ‫ـ اق ٔشؽ‬ٛ‫ظ‬ٙٔ
)‫یؽ‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ب ـا ؼـ قیف ٍٔب‬ٞ‫ؽ)ِیىشی اق ایٗ ٔشؽ‬ٙ٘‫ ـا ثفٔی ٌفؼا‬ٝ‫یه ٘شید‬ٛ٘ ٝٔ‫ غبِی ثفای ثف٘ب‬ٝ‫ٔطبوج‬
● abs()
● acos()
● asin()
● atan()
● cos()
● exp()
● log()
● sin()
● sqrt()
● tan()
5,,(- َ‫ٔثب‬
sqrt() ‫ اق سبثغ‬ٜ‫ـ اػؽاؼ ثب اوشفبؼ‬ٚ‫ ٔدؿ‬ٝ‫ؽ ثفای ٔطبوج‬ٙ‫اوىفیذشی وبـثفدى‬
<body>
<form>
Enter a (positive) number or zero: <br />
<input type="text" id="sr_num" />
<input type="button" value="Get a Square Root" id="getroot" />
</form>
var root_button = document.getElementById("getroot");
root_button.onclick = function() {
var thenum = document.getElementById("sr_num").value
if (thenum < 0) {
window.alert("Hey! I said to enter a positive number! Try
again.");
return false;

}
else if (thenum != (thenum*1)) {
window.alert("Input must be numeric!");
return false;
}
else {
var theroot = Math.sqrt(thenum);
window.alert("The square root of "+thenum+" is "+theroot);
return false;
}
};
</script>
</body
‫هتذّای دٍ پاراهتزی‬
‫ اق‬ٝ‫ دبـأشف ؼاـ٘ؽ' و‬ٚ‫ ؼـیبفز ؼ‬ٝ‫ ثفای ِطیص اخفا ٌؽٖ ٘یبق ث‬ٝ‫بیی اوز و‬ٞ‫ـؼ ٔشؽ‬ٛٔ ‫ایٗ ٔجطث ؼـ‬
)‫ وفؼ‬ٜ‫اٖ اٌبـ‬ٛ‫ یب س‬ٚ ‫زه سف‬ٛ‫ و‬ٚ ‫ ای ثكـي سف‬ٝ‫بی ٔمبیى‬ٞ‫ ٔشؽ‬ٝ‫اٖ ث‬ٛ‫ب ٔی س‬ٞ‫ ایٗ ٔشؽ‬ّٕٝ‫خ‬
● atan2()
● max()
● min()
● pow()
5,,(. َ‫ٔثب‬
‫ ثفٌفؼا٘ؽٖ ػؽؼ ثكـي سف‬ٚ ‫ ػؽؼ‬ٚ‫ ؼ‬ٝ‫اوىفیذشی ثفای ٔمبیى‬
<body>
<form>
<input type="button" value="Which Number is Bigger?" id="getmax"
/>
</form>
var max_button = document.getElementById("getmax");
max_button.onclick = function() {
var num1 = window.prompt("Enter a number.","");
var num2 = window.prompt("Enter another number","");
var largenum = Math.max(num1,num2);
var smallnum = Math.min(num1,num2);
if (largenum == smallnum) {
window.alert("Those two numbers are equal!");

}
else {
window.alert(largenum+" is larger than "+smallnum);
}
};
</script>
</body>
ٖ‫ؽ ٌؽ‬ٙ‫یٗ ثفای وبـثف دى‬ٙ‫ٕس‬ٞ ٚ ‫ ٔی ثبٌؽ‬ٚ min() ٚ max() ‫بی‬ٞ‫ اق ٔشؽ‬ٜ‫اوبن وبـ سبثغ ثبال اوشفبؼ‬
‫ب اق‬ٟ٘‫ خبی آ‬ٝ‫ا٘یؽ ث‬ٛ‫ ٌٕب ٔی س‬ٝ‫ ایٓ و‬ٜ‫ وفؼ‬ٜ‫ز ؼـیبفز اػؽاؼ اوشفبؼ‬ٟ‫ خ‬prompt ‫بی‬ٞ‫ اق وبؼـ‬ٝٔ‫ف ثف٘ب‬ٞ‫ظب‬
)‫ ٕ٘بییؽ‬ٜ‫ی اوشفبؼ‬ٙ‫بی ٔش‬ٞ‫وبؼـ‬
pow() ‫تَاى‬
)‫ْ ٔی ـوب٘ؽ‬ٚ‫اٖ ٔمؽاـ ؼ‬ٛ‫ س‬ٝ‫َ ـا ث‬ٚ‫ وذه ٔمؽاـ ا‬ٚ ‫اٖ دبـأشف ٔی ٌیفؼ‬ٛٙ‫ ػ‬ٝ‫ ٔمؽاـ ـا ث‬ٚ‫ایٗ ٔشؽ ؼ‬
Math.pow(2,3); 5 ‫ؽ‬ٙ٘‫ٔب‬
5,,(/ َ‫ٔثب‬
<body>
<form>
<input type="button" value="Find a Power" id="getpow" />
</form>
var pow_button = document.getElementById("getpow");
pow_button.onclick = function() {
var num1 = window.prompt("Enter a base number.","");
var num2 = window.prompt("What power should we set it to (a
number)?","");
var theresult = Math.pow(num1,num2);
window.alert(num1+" to the power of "+num2+" is "+theresult);
};
</script>
</body>

‫دیگز هتذّا‬
● ceil()
● floor()
● round()
The ceil() Method
‫ـ ٔثبَ اٌف ٌٕب ػؽؼ‬ٛ٘ ٝ‫ؽ) ث‬ٞ‫ ـا ٍ٘بٖ ٔی ؼ‬ٝ٘ٛ‫ ػؽؼ ٔفث‬ٝ‫ایٗ ٔشؽ ثكـي سفیٗ ػؽؼ ِطیص ٘كؼیه ث‬
)‫ ـا ثفٔی ٌفؼا٘ؽ‬,, ٝ‫اـؼ ٕ٘بییؽ ایٗ سبث‬ٚ ‫ٓ_ ـا‬ٞ‫ ٕٔیك یه ؼ‬ٜ‫_ؼ‬,+),
5,,(0 َ‫ٔثب‬
<body>
<form>
<input type="button" value="Find a Ceiling" id="getceiling" />
</form>
<script type="text/javascript>
var ceil_button = document.getElementById("getceiling");
ceil_button.onclick = function() {
var num1= window.prompt("Enter a number.","");
var theceil= Math.ceil(num1);
window.alert("The ceiling of "+num1+ " is "+theceil);
};
</script>
</body>
The floor() Method

‫ـ ٔثبَ اٌف ٌٕب ػؽؼ‬ٛ٘ ٝ‫ؽ) ث‬ٞ‫ ـا ٍ٘بٖ ٔی ؼ‬ٝ٘ٛ‫ ػؽؼ ٔفث‬ٝ‫زه سفیٗ ػؽؼ ِطیص ٘كؼیه ث‬ٛ‫ایٗ ٔشؽ و‬
)‫ ـا ثفٔی ٌفؼا٘ؽ‬,+ ٝ‫اـؼ ٕ٘بییؽ ایٗ سبث‬ٚ ‫ٓ_ ـا‬ٞ‫ ٕٔیك یه ؼ‬ٜ‫_ؼ‬,+),
The round() Method

ٝ‫ب ـا ؼاـؼ) ؼـ ایٗ سبثغ اػؽاؼی و‬ٞ ٖ‫ آ‬ٝ‫ ٘كؼیىشفیٗ ػؽؼ ِطیص ث‬ٝ‫ ٌفؼوفؼٖ اػؽاؼ اػٍبـی ث‬ٝ‫ظیف‬ٚ ‫ایٗ ٔشؽ‬
‫ ٔمؽاـ‬ٝ‫ اػؽاؼی و‬ٚ ‫ب‬ٟ٘‫ آ‬ٝ‫زه سفیٗ ػؽؼ ِطیص ٘كؼیه ث‬ٛ‫)_٘یٓ_ثبٌؽ ثب و‬0 ‫زىشف اق‬ٛ‫ب و‬ٞ ٖ‫ٔمؽاـ اػٍبـ آ‬
)‫٘ؽ‬ٌٛ ‫ب خٕغ ٔی‬ٟ٘‫ آ‬ٝ‫)_٘یٓ_ ثبٌؽ ثب ثكـي سفیٗ ػؽؼ ِطیص ٘كؼیه ث‬0 ‫ی‬ٚ‫ب ثكـي سف یب ٔىب‬ٟ٘‫اػٍبـی آ‬
5,,(1 َ‫ٔثب‬
10.2  10
10.5  11
10.6  11
The random() Method
‫ ـا‬, ٚ + ٗ‫ یه ػؽؼ اسفبلی ثی‬ٜ‫اـ‬ٕٛٞ ٝ‫ْ ٔی ثبٌؽ)زفا و‬ٚ‫بی ٌی ـیبٔی ٔشؽ ـا٘ؽ‬ٞ‫یىی اق ٔفیؽسفیٗ ٔشؽ‬
‫ؼ ا٘شٍبـ‬ٛ‫ة غ‬ٚ ‫ـر اسفبلی ؼـ‬ّٛ‫فزیك ؼثٍفی ـا ث‬ٞ ‫یٓ ٔشٗ ػىه یب‬ٞ‫ا‬ٛ‫ ثػ‬ٝ‫الؼی و‬ٛٔ ‫ ثفای‬ٚ‫ثفٔیٍفؼا٘ؽ‬
)‫ؼ‬ٚ‫ا٘ؽ ثىبـ ـ‬ٛ‫یٓ ٔی س‬ٞ‫ؼ‬
5,,(2 َ‫ٔثب‬
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫اَ اسفبلی اق وبـثف دفویؽ‬ٛ‫ یه و‬ٝ‫فثبـ ـففي ٌؽٖ ِفط‬ٞ ‫ؼـ ٔثبَ قیف ثب‬
<body>
<h1>My Random Quote for You:</h1>
<div id="my_quote">
Look in the mirror. Are you looking at me?
</div>
var quotes= new Array(10);
quotes[0]="Look in the mirror. Are you looking at me?";
quotes[1]="It is time for a rhyme, I guess.";
quotes[2]="Where is my JavaScript book?";
quotes[3]="If I had a buck for every dollar I spent--Oops, never
mind.";
quotes[4]="I suppose you were expecting a real quote here.";
quotes[5]="Quotes are great, but don't quote me on that.";
quotes[6]="What should I write here?";
quotes[7]="Wut hapns iff eye miss spel ohn purpas?";
quotes[8]="Mark my words, I will mark my words.";
quotes[9]="This spot reserved for a better quote.";
var q_div = document.getElementById("my_quote");
var rand_int = Math.floor(Math.random()*10);
q_div.innerHTML = quotes[rand_int];
</script>
</body>

‫اضیای ػذدی‬
ٗ‫ؽ ؼـ ای‬ٌٙ‫ ٔشؽ ٔفیؽ ثفای ؼوشىبـی اػؽاؼ ٔی ثب‬ٚ ‫یمٌی‬ٚ ٗ‫ؽی‬ٙ‫ااوىفیذز ٌبُٔ ز‬ٚ‫اٌیبی ػؽؼی ؼـ خب‬
)ٓ‫ی‬ٞ‫ـؼ ثفـوی لفاـ ؼ‬ٛٔ ‫ب ـا‬ٟ٘‫یٓ سؼؽاؼی اق آ‬ٙ‫ثػً وؼی ٔی و‬
‫ٍیژگی ّا‬
)‫یؽ‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ اٌیب ػؽؼی ـا ٍٔب‬ٝ‫ٖ ث‬ٛ‫بی ٔفث‬ٞ ‫یمٌی‬ٚ ‫َ قیف ِیىشی اق‬ٚ‫ؼـ خؽ‬
Property Purpose
constructor Holds the value of the constructor function that created the object
Holds a constant number value, representing the largest value
MAX_VALUE
before JavaScript interprets a number as infinity
Holds a constant number value, representing the smallest value
MIN_VALUE
before JavaScript interprets a number as negative infinity
NaN Represents the value of “Not a Number”
NEGATIVE_INFINITY Represents the value of negative infinity
POSITIVE_INFINITY Represents the value of infinity
prototype Enables you to add properties to the object if you wish
‫هتذّا‬
)‫ ٔی ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫ب ـا ٍٔب‬ٞ‫َ قیف ِیىشی اق ایٗ ٔشؽ‬ٚ‫ؼـ خؽ‬
Method Purpose
Returns a string value that represents the number in exponential
toExponential()
notation
Returns a string value that represents the number rounded to the
toFixed()
specified number of digits after the decimal
Returns a string value that represents the number rounded to the
toPrecision()
specified number of significant digits
toSource() Returns a string value that represents the source code of the object
toString() Returns a string value for a Number object
valueOf() Used by JavaScript internally most often
The toExponential() Method

)‫ؽ‬ٞ‫ـر ٕ٘بؼ ػّٕی ٍ٘بٖ ٔی ؼ‬ِٛ ٝ‫ایٗ ٔشؽ ػؽؼ ؼـیبفشی ـا ث‬
5,,(3 َ‫ٔثب‬

‫;‪var the_num = 100‬‬

‫;))(‪document.write(the_num.toExponential‬‬
‫‪1e+2‬‬
‫‪The toFixed() Method‬‬

‫ایٗ ٔشؽ ثفای ضؿف سؼؽاؼ اـلبْ اػٍبـ ثؼؽ اق ٕٔیك ث‪ ٝ‬وبـ ٔی ـ‪ٚ‬ؼ)ؼـ ‪ٚ‬الغ ث‪ ٝ‬ا٘ؽاق‪ ٜ‬دبـأشفی و‪ ٝ‬ث‪ ٝ‬آٖ‬
‫ٔی ؼ‪ٞ‬یٓ اق ثؼؽ اق ٕٔیك ‪ ٚ‬ث‪ ٝ‬وٕز ـاوز ٌف‪ٚ‬ع ث‪ٌٕ ٝ‬بـٔی ٕ٘بیؽ ‪ ٚ‬ث‪ ٝ‬ا٘ؽاق‪ ٜ‬دبـأشف خّ‪ٔ ٛ‬ی ـ‪ٚ‬ؼ' وذه‬
‫اػؽاؼی و‪ٌٕ ٝ‬بـي ٕ٘ؽ‪ ٜ‬ـا ثفٔی ٌفؼا٘ؽ ‪ ٚ‬ثمی‪ ٝ‬ـا ضؿف ٔی ٕ٘بیؽ)‬
‫ٔثبَ ‪5,,(4‬‬
‫ؼـ ٔثبَ قیف سمفیت ضؿف اػؽاؼ اػٍبـی ـا ‪ -‬ؼـ ٘ظف ٌففش‪ ٝ‬ایٓ ثؽیٗ ٔؼ‪ٙ‬ب و‪ ٝ‬سب ؼ‪ ٚ‬ـلٓ اق اػؽاؼ اػٍبـی‬
‫ـا ضفظ ٕ٘بیؽ ‪ ٚ‬ثمی‪ ٝ‬ـا ضؿف و‪ٙ‬ؽ)‬
‫;‪var mymoney = 2000‬‬

‫;‪var mykids = 7‬‬
‫;‪var one_share = mymoney/mykids‬‬
‫‪document.write("One share of my money is $"+‬‬
‫;))‪one_share.toFixed(2‬‬
‫٘شید‪5ٝ‬‬
‫‪One share of my money is $285.71‬‬
‫ؼـ ِ‪ٛ‬ـر اوشفبؼ‪٘ ٜ‬ىفؼٖ اق ٔشؽ )(‪ toFixed‬ؼـ ٔثبَ ثبال ٘شید‪ ٝ‬ث‪ِٛ ٝ‬ـر قیف ٔی ٌ‪ٛ‬ؼ‪5‬‬
‫‪One share of my money is $285.7142857142857‬‬

‫‪The toPrecision() Method‬‬

‫ایٗ ٔشؽ ٘یك یىی ؼیٍف اق ٔشؽ‪ٞ‬بی ضؿف اـلبْ اػٍبـی ٔی ثبٌؽ ‪ٔ ٚ‬ب٘‪ٙ‬ؽ ٔشؽ )(‪ toFixed‬ثب ایٗ سفب‪ٚ‬ر‬
‫و‪ٌٕ ٝ‬بـي اـلبْ ـا اق وٕز زخ سفیٗ ػؽؼ ٌف‪ٚ‬ع ٔی ٕ٘بیؽ ‪ ٚ‬ث‪ ٝ‬ا٘ؽاق‪ ٜ‬دبـأشف ؼاؼ‪ٌ ٜ‬ؽ‪ ٜ‬ث‪ ٝ‬وٕز ـاوز‬
‫ضفوز ٔی و‪ٙ‬ؽ ‪ ٚ‬ثمی‪ ٝ‬اػٍبـ ثبلیٕب٘ؽ‪ ٜ‬ـا ثب آغفیٗ ػؽؼ اػٍبـی ٌفؼ ٔی و‪ٙ‬ؽ)‬
‫ٔثبَ ‪5,,(,+‬‬
‫;‪var the_num = 45.57689349‬‬

‫;))‪document.write(the_num.toPrecision(5‬‬
‫‪45.57‬‬
‫‪The toString() Method‬‬
‫‪ٕٞ‬ب٘‪ٛٙ‬ـ و‪ ٝ‬اق ٘بْ آٖ دیؽا اوز ثفای سجؽیُ اػؽاؼ ث‪ ٝ‬ـٌش‪ٞ ٝ‬بی ٔش‪ٙ‬ی ث‪ ٝ‬وبـ ٔی ـ‪ٚ‬ؼ)‬
‫اضیای سهاى‬
‫ایٗ اٌیب ٘یك یىی ؼیٍف اق اٌیبی اق دیً سؼفیف ٌؽ‪ ٜ‬ؼـ خب‪ٚ‬ااوىفیذز ‪ٞ‬ىش‪ٙ‬ؽ و‪ ٝ‬ث‪ٌٕ ٝ‬ب س‪ٛ‬ا٘بیی‬
‫ؼاؼٖ*ٌففشٗ یه قٔبٖ ٍٔػُ ث‪*ٝ‬اق اوىفیذز غ‪ٛ‬ؼ ٔی ٕ٘بی‪ٙ‬ؽ)‬
‫ٍیژگی ّا‬
‫ؼـ خؽ‪ َٚ‬قیف ایٗ ‪ٚ‬یمٌی ‪ٞ‬ب ـا ٍٔب‪ٞ‬ؽ‪ٔ ٜ‬ی ٕ٘بییؽ‬
‫‪Property‬‬ ‫‪Purpose‬‬
‫‪constructor‬‬ ‫‪Holds the value of the constructor function that created the object‬‬
‫‪prototype‬‬ ‫‪Enables you to add properties to the object if you wish‬‬
‫‪The constructor Property‬‬
‫ث‪ٔ ٝ‬جطثی ثب ‪ٕٞ‬یٗ ٘بْ ؼـ آـای‪ٞ ٝ‬ب ٔفاخؼ‪ٕ٘ ٝ‬بییؽ)‬
‫‪The prototype Property‬‬
‫ث‪ٌٕ ٝ‬ب ایٗ لبثّیز ـا ٔی ؼ‪ٞ‬ؽ و‪ٚ ٝ‬یمٌی یب ٔشؽ خؽیؽی ـا ث‪ٌ ٝ‬ی ‪ Date‬أبف‪ ٝ‬و‪ٙ‬یؽ)‬

5,,(,, َ‫ٔثب‬
Date.prototype.morning="a.m.";
var rightnow= new Date();
window.alert("This date is "+rightnow.morning);
‫هتذّا‬
‫ سؼؽاؼ قیبؼی‬ّٝ‫وی‬ٚ ٝ‫ؽ أب ایٗ ٌی ث‬ٞ‫بی قیبؼی ـا ؼـ اغشیبـ ٌٕب لفاـ ؼ‬ٞ ‫ا٘ؽ لبثّیز‬ٛ‫ٌی قٔبٖ ٕ٘ی س‬
)‫ؽ‬ٙٞ‫بی قیبؼی ـا ؼـ اغشیبـ ٌٕب لفاـ ٔی ؼ‬ٟ‫ لبثّیش‬ٚ ‫ب‬ٞ ‫یمٌی‬ٚ ‫ب‬ٞ‫ ایٗ ٔشؽ‬ٝ‫ؼ و‬ٌٛ ‫ٔشؽ دٍشیجب٘ی ٔی‬
)‫ ٔی ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫َ قیف ٍٔب‬ٚ‫ب ـا ؼـ خؽ‬ٞ‫ِیىشی اق ایٗ ٔشؽ‬
Method Purpose
getDate() Returns the day of the month based on the viewer’s local time
Returns the number of days into the week based on the viewer’s
getDay()
local time (0–6)
Returns the number of hours into the day based on the viewer’s local
getHours()
time (0–23)
Returns the number of milliseconds into the second based on the
getMilliseconds() viewer’s local
time (0-999)
Returns the number of minutes into the hour based on the viewer’s
getMinutes()
local time (0–59)
Returns the number of months into the year based on the viewer’s
getMonth()
local time (0–11)
Returns the seconds into the minute based on the viewer’s local time
getSeconds()
(0–59)
Returns the number of milliseconds since 1/1/1970 for the Date
getTime()
object
Returns the time-zone offset (from Greenwich Mean Time) in
getTimezoneOffset()
minutes based on the viewer’s local time zone
getYear() Returns the year based on the viewer’s local time (two digits)
getFullYear() Returns the full year based on the viewer’s local time (four digits)
getUTCDate() Returns the day of the month in Coordinated Universal Time
Returns the number of days into the week in Coordinated Universal
getUTCDay()
Time (0-6)
getUTCFullYear() Returns the full year in Coordinated Universal Time (four digits)
Returns the number of hours into the day in Coordinated Universal
getUTCHours()
Time (0–23)
Returns the number of milliseconds into the current second in
getUTCMilliseconds()
Coordinated Universal Time (0-999)
Returns the number of minutes into the hours in Coordinated
getUTCMinutes()
Universal Time (0–59)

Returns the number of months into the current year in Coordinated

getUTCMonth()
Returns the number of seconds into the current minute in
getUTCSeconds()
Returns the number of milliseconds since 1/1/1970 of a date sent as
parse()
a parameter based on the viewer’s local time
setDate() Sets the day of the month for an instance of the Date object
setHours() Sets the hours for an instance of the Date object
setMilliseconds() Sets the milliseconds for an instance of the Date object
setMinutes() Sets the minutes for an instance of the Date object
setMonth() Sets the month for an instance of the Date object
setSeconds() Sets the seconds for an instance of the Date object
Sets the time (in milliseconds since January 1, 1970, at midnight) for
setTime()
an instance of the Date object
setYear() Sets the year for an instance of the Date object (two digits)
setFullYear() Sets the full year for an instance of the Date object (four digits)
setUTCDate() Sets the day of the month in Coordinated Universal Time
setUTCFullYear() Sets the full year in Coordinated Universal Time (four digits)
Sets the number of hours into the day in Coordinated Universal
setUTCHours()
Time (0–23)
Sets the number of milliseconds into the current second in
setUTCMilliseconds()
Sets the number of minutes into the hours in Coordinated Universal
setUTCMinutes()
Time (0–59)
Sets the number of months into the current year in Coordinated
setUTCMonth()
Sets the number of seconds into the current minute in Coordinated
setUTCSeconds()
Universal Time (0-59)
Returns the date portion of the Date object as a string in American
toDateString()
English
Returns a string that is the date in Greenwich Mean Time (GMT)
toGMTString()
format (toUTCString() is now used instead)
toLocaleString() Returns a string that is the date in a format based on the locale
Returns the date portion of the Date object as a string based on the
toLocaleDateString()
locale
Returns the time portion of the Date object as a string based on the
toLocaleTimeString()
locale
toString() Returns a string that is the date in American English
Returns the time portion of the Date object as a string in American
toTimeString()
English

‫هتذّای تزگزداًٌذُ ی هقذار‬

‫ ٌٕب ـا لبؼـ ٔی وبق٘ؽ سب‬ٝ‫ؽ و‬ٙ٘‫ب ٔمؽاـی ـا ثفٔی ٌفؼا‬ٞ‫ب دیؽاوز ایٗ ٔشؽ‬ٞ‫ اق ٘بْ ایٗ ٔشؽ‬ٝ‫ـ و‬ٛٙ٘‫ٕب‬ٞ
)‫ ٔی ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫ب ـا ؼـ قیف ٍٔب‬ٞ‫ؼ ثىبـ ثجفیؽ) ٘بْ ایٗ ٔشؽ‬ٛ‫ یب خبـی ـا ؼـ اوىفیذز غ‬ٜ‫ا‬ٛ‫قٔبٖ ؼِػ‬
● getDate()
● getDay()
● getHours()
● getMilliseconds()
● getMinutes()
● getMonth()
● getSeconds()
● getTime()
● getTimezoneOffset()
● getYear()
● getFullYear()
● getUTCDate()
● getUTCDay()
● getUTCFullYear()
● getUTCHours()
● getUTCMilliseconds()
● getUTCMinutes()
● getUTCMonth()
● getUTCSeconds()
5‫ؽ‬ٙ٘‫یؽ ٔب‬ٙ‫ب ٌٕب ثبیؽ ؼـ اثشؽا یه ٌی قٔب٘ی ایدبؼ و‬ٞ‫ اق ایٗ وشؽ‬ٜ‫ثفای اوشفبؼ‬
The getDate() Method

ٜ‫ق ٔب‬ٚ‫دٕیٗ ـ‬ٙ‫ق د‬ٚ‫یٓ ویىشٓ ٌٕب ـا ثفٔی ٌفؼا٘ؽ) ٔثال اٌف أف‬ٛ‫ق خبـی ثفاوبن سم‬ٚ‫ ـ‬ٜ‫ایٗ ٔشؽ ٌٕبـ‬
)‫ ـا ثفٔی ٌفؼا٘ؽ‬0 ‫ثبٌؽ ایٗ ٔشؽ ٔمؽاـ ػؽؼی‬
5,,(,- َ‫ٔثب‬

var theday= rightnow.getDate();
document.write(theday);
The getDay() Method
‫ق خبـی ـا ثفٔی‬ٚ‫ اوٓ ـ‬ٜ‫ خبی ٌٕبـ‬ٝ‫ ث‬ٝ‫ر و‬ٚ‫ؽ ثب ایٗ سفب‬ٙ‫ؽ ٔشؽ ثبال ػُٕ ٔی و‬ٙ٘‫ٕب‬ٞ ‫ایٗ ٔشؽ‬
)friday ‫ؽ‬ٙ٘‫ٌفؼا٘ؽ)ٔب‬
5,,(,. َ‫ٔثب‬

var theday= rightnow.getDay();
The getHours() Method
)ٝ‫بـ وبػش‬ٟ‫ ز‬ٚ ‫ـر ثیىز‬ِٛ ٝ‫ق خبـی ث‬ٚ‫ثفٌفؼا٘ؽٖ وبػز ـ‬

range 0-23
5,,(,/ َ‫ٔثب‬

var theday= rightnow.getHours();
The getMilliseconds() Method
)‫ ؼـ ٌی قٔبٖ ـا ثفٔی ٌفؼا٘ؽ‬ٜ‫ ٌؽ‬ٜ‫ؽ ؾغیف‬ٙ‫ایٗ ٔشؽ ٔیّی وى‬

range 0-999
5,,(,0 َ‫ٔثب‬

var theday= rightnow.getMilliseconds();
The getMinutes() Method
) ‫ ثف اوبن ویىشٓ ٌٕب‬ٝ‫ثفٌفؼا٘ؽٖ ؼلیم‬
range 0-59
5,,(,1 َ‫ٔثب‬

var theday= rightnow.getMinutes();
The getMonth() Method

)‫ خبـی ثف اوبن ویىشٓ ٌٕب‬ٜ‫ثفٌفؼا٘ؽٖ ٘بْ ٔب‬
january 5 ‫ؽ‬ٙ٘‫ٔب‬
5,,(,2 َ‫ٔثب‬

var theday= rightnow.getMonth();
The getSeconds() Method
) ‫ ثف اوبن ویىشٓ ٌٕب‬ٝ‫ثفٌفؼا٘ؽٖ ثب٘ی‬

range 0-59
5,,(,3 َ‫ٔثب‬


var theday= rightnow.getSeconds();
The getTime() Method
)ٖ‫ؼ ؼـ ٌی قٔب‬ٛ‫خ‬ٛٔ ‫ سب سبـیع‬,42+ ٝ‫ی‬ٛ٘‫ لا‬, ‫ب اق سبـیع‬ٞ ٝ‫ثفٌفؼا٘ؽٖ سؼؽاؼ ٔیّی ثب٘ی‬
5,,(,4 َ‫ٔثب‬

var theday= rightnow.getTime();
The getTimezoneOffset() Method
‫ اغشالف ؼاـیؽ ـا ثفٔی ٌفؼا٘ؽ)ٔثال اغشالف قٔب٘ی ٔب ثب‬GMT ‫ قٔب٘ی‬ٝ‫م‬ٙٙٔ ‫ ٌٕب ثب‬ٝ‫سؼؽاؼ ؼلبیمی و‬
)‫ ـا ثف ٔی ٌفؼا٘ؽ‬/-+ ‫ وفؼٖ اق ایٗ سبثغ‬ٜ‫ـر اوشفبؼ‬ِٛ ‫ ؼـ‬ٝ‫ وبػز اوز و‬2 GMT
5,,(-+ َ‫ٔثب‬

var theday= rightnow.getTimezoneOffest();
The getFullYear() Method
)‫ثفٌفؼا٘ؽٖ وبَ ٔیالؼی ثف اوبن سبـیع ویىشٓ وبـثف‬
5,,(-, َ‫ٔثب‬


var theyear= rightnow.getFullYear();
‫هتذّای ًطاًٌذُ ی هقذار‬

‫ب ـا ؼـ قیف‬ٞ‫٘ؽ)ِیىز ایٗ ٔشؽ‬ٚ‫ب ثفای ٍ٘ب٘ؽٖ یه ٔمؽاـ قٔب٘ی ؼـ اوىفیذز ٌٕب ثىبـ ٔی ـ‬ٞ‫ایٗ ٔشؽ‬
)‫یؽ‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ٍٔب‬
● setDate()
● setHours()
● setMilliseconds
● setMinutes()
● setMonth()
● setSeconds()
● setTime()
● setYear()
● setFullYear()
● setUTCDate()
● setUTCFullYear()
● setUTCHours()
● setUTCMilliseconds()
● setUTCMinutes()
● setUTCMonth()
● setUTCSeconds()
)‫ب اـوبَ ٕ٘بییؽ‬ٟ٘‫ آ‬ٝ‫ب ٌٕب ثبیؽ یه دبـأشف ػؽؼی ـا ث‬ٞ‫ثفای ثىبـ ثفؼٖ ایٗ ٔشؽ‬
5,,(-- َ‫ٔثب‬

rightnow.setDate(22);

‫دیگز هتذّا‬
)‫بی ثبال لفاـ ٕ٘ی ٌیف٘ؽ‬ٞ ٝ‫یر یه اق ؼوش‬ٞ ‫ ؼـ‬ٝ‫بیی اوز و‬ٞ‫ایٗ لىٕز ٌبُٔ ٔشؽ‬
The parse() Method
ٖ‫ آ‬ٝ‫اٖ دبـأشف ث‬ٛٙ‫ ػ‬ٝ‫ ث‬ٝ‫ قٔب٘ی ـا و‬ٚ_,42+ ٝ‫ی‬ٛ٘‫ لا‬,_ ‫بی ثیٗ قٔبٖ ٔجؽا‬ٞ ٝ‫ایٗ ٔشؽ سؼؽاؼ ٔیّی ثب٘ی‬
)‫یٓ ـا ثفٔی ٌفؼا٘ؽ‬ٙ‫اـؼ ٔی و‬ٚ
5,,(-. َ‫ٔثب‬
var thenum= Date.parse("Dec 12, 1999")
var theday = rightnow.setTime(thenum);

</script>
)ٓ‫ ای‬ٜ‫اـؼ وفؼ‬ٚ ‫اٖ دبـأشف‬ٛٙ‫ ػ‬ٝ‫ ـا ث‬Dec 12, 1999 ٖ‫ؼـ ٔثبَ ثبال قٔب‬
toLocaleTimeString()
toDateString()
toTimeString()
toLocaleDateString()
toString()
toGMTString()
oLocaleString()
‫ی‬ٙ‫بی ٔش‬ٞ ٝ‫ع ـٌش‬ٛ٘ ‫ب اق‬ٟ٘‫خی آ‬ٚ‫ غف‬ٝ‫ر و‬ٚ‫ؽ ثب ایٗ سفب‬ٙٞ‫بی ثبال ـا ا٘دبْ ٔی ؼ‬ٞ‫ب وبـ ٔشؽ‬ٞ‫ایٗ ٔشؽ‬
)‫ب ٔی ثبٌؽ‬ٞ‫ؽ ؼیٍف ٔشؽ‬ٙ٘‫ب ٘یك ٔب‬ٟ٘‫ ثىبـٌیفی آ‬ٝ‫ ٘فیم‬ٚ ‫اوز)ؼـ‬
5,,(-/ َ‫ٔثب‬
‫یٓ) القْ ثؿوف اوز‬ٞ‫قي ٔی ؼ‬ٛٔ‫ ٌٕب آ‬ٝ‫دب ث‬ٙ‫بٔیه ـا ؼـ ای‬ٙ‫اٖ ٔثبَ دبیب٘ی وبغز یه وبػز ؼی‬ٛٙ‫ ػ‬ٝ‫ث‬
)‫ اوز‬ٜ‫ ٌؽ‬ٜ‫دب٘ؽ‬ٌٙ ‫ ایٗ وشبة ٘یك‬ٜ‫ٕفا‬ٞ ٕٝ‫بی ٕٔی‬ٞ ٜ‫ل‬ٚ‫ ایٗ وبػز ؼـ دف‬ٝ‫و‬
<body>
<h1>Current Time:</h1>
<div id="my_clock">

</div>
function startclock() {
var thetime = new Date();
var hours = thetime.getHours();
var mins = thetime.getMinutes();
var secn = thetime.getSeconds();
var ap = (hours >= 12) ? "p.m." : "a.m.";
if (hours >= 13) {
hours -= 12;
}
if (hours < 1) {
hours = 12;
}
if (mins < 10) {
mins = "0" + mins;
}
if (secn < 10) {
secn = "0" + secn;
}
var clock_div = document.getElementById("my_clock");
clock_div.innerHTML = hours + ":" + mins + ":" + secn + " " +
ap;
setTimeout("startclock()", 1000);
}
startclock();
</script>
</body>
‫ اق‬ٜ‫ اوز اوشفبؼ‬ٜ‫یبیی آٖ ٌؽ‬ٛ‫ ثبػث د‬ٚ ‫ اوز‬ٝ‫ ؼـ وبغز ایٗ وبػز ثىبـ ـفش‬ٝ‫ ای و‬ٝ‫٘ىش‬
)‫ظف ثیبیؽ‬ٙ‫ؼ سب وبػز ٔشطفن ث‬ٌٛ ‫ ثبػث ٔی‬ٝ‫ ٔی ثبٌؽ و‬innerHTML

‫ رضتِ ّای هتٌی‬: ‫فصل دٍاسدّن‬

‫رضتِ ّای هتٌی‬
‫ثفای وبـ ثب ـٌش‪ٞ ٝ‬بی ٔش‪ٙ‬ی ؼـ خب‪ٚ‬ا اوىفیذز ٌٕب ثبیؽ ثب زٍ‪ٍ٘ٛ‬ی ثىبـثفؼٖ ‪ٚ‬یمٌی ‪ٞ‬ب ‪ٔ ٚ‬شؽ‪ٞ‬بی ٔفث‪ٖٛ‬‬
‫ث‪ ٝ‬آ٘‪ٟ‬ب آٌ‪ٙ‬بیی ؼاٌش‪ ٝ‬ثبٌیؽ)ؼـ ایٗ فُّ ا‪ َٚ‬ثب وبغشبـ ‪ ٚ‬سؼفیف ـٌش‪ٞ ٝ‬ب ؼـ خب‪ٚ‬ااوىفیذز آٌ‪ٙ‬ب ٔی ٌ‪ٛ‬یؽ‬
‫وذه ثىبـٌیفی ٔشؽ‪ٞ‬ب ‪ٚ‬ـٌش‪ٞ ٝ‬ب ـا غ‪ٛ‬ا‪ٞ‬یؽ آٔ‪ٛ‬غز)‬
‫‪The String Object‬‬

‫ؼـ ٌبْ ا‪ٌٕ َٚ‬ب ثبیؽ لبؼـ ث‪ ٝ‬وبغشٗ یه ٌی ٔش‪ٙ‬ی ثبٌیؽ ثفای ایٗ وبـ اق وّٕ‪ ٝ‬وّیؽی ‪ ٚ new‬ث‪ ٝ‬ؼ٘جبَ‬
‫آٖ ‪ string‬اوشفبؼ‪ٔ ٜ‬ی و‪ٙ‬یؽ ث‪ٌ ٝ‬ىُ قیف ‪5‬‬
‫;)"‪var instance_name = new String("string value here‬‬
‫س‪ٔٛ‬یطبر ‪5‬‬
‫‪ 5 var‬ثفای ایدبؼ یه ٔشغییف ثفای ٍ٘‪ٟ‬ؽاـی ـٌش‪ٔ ٝ‬ش‪ٙ‬ی‬
‫‪٘ 5 instance_name‬بٔی و‪ٌٕ ٝ‬ب ث‪ ٝ‬ـٌش‪ٔ ٝ‬ش‪ٙ‬ی اغشّبَ غ‪ٛ‬ا‪ٞ‬یؽ ؼاؼ)‬
‫‪ 5 new‬یه ِغز وّیؽی ؼـ خب‪ٚ‬ااوىفیذز ثفای ایدبؼ ‪ٞ‬ف ٌی خؽیؽ)‬
‫‪ِ 5 String‬غز وّیؽی ثفای ایدبؼ ـٌش‪ٔ ٝ‬ش‪ٙ‬ی)‬
‫)"‪ٔ :("string value here‬طش‪ٛ‬ای ـٌش‪ٔ ٝ‬ش‪ٙ‬ی ٌٕب ؼـ ای‪ٙ‬دب ‪ ٚ‬ثیٗ ("") قزار هی گیزد‪.‬‬
‫ٔثبَ ‪5,-(,‬‬
‫;)"‪var guitar_string = new String("G‬‬
‫وؽ ثبال یه ـٌش‪ٔ ٝ‬ش‪ٙ‬ی ثب ٘بْ ‪ ٚ guitar_string‬ثب ٔطش‪ٛ‬ای ‪ G‬ایدبؼ ٔی و‪ٙ‬ؽ)‬

‫ساخت لیتزال هتٌی‬
ٗ‫یؽ' ای‬ٙ‫ یه ٔشغییف ایدبؼ و‬ٝ‫ اق ٘ىجز ؼاؼٖ آٖ ث‬ٜ‫ب ثب اوشفبؼ‬ٟٙ‫ی ـا س‬ٙ‫ا٘یؽ یه ِیشفاَ ٔش‬ٛ‫ٌٕب ٔی س‬
5 ‫ؽ قیف‬ٙ٘‫ؽ ٔب‬ٙ‫ٌشبـی ّٔفف ٔی و‬ٛ٘ ‫ ٌی‬ٝ‫یه ٔمؽاـ فٕبی وٕشفی ـا ٘ىت ث‬ٙ‫سى‬
5,-(- َ‫ٔثب‬
var guitar_string = "G";
‫یؽ ؼاٌز‬ٞ‫ا‬ٛ‫یمٌی ٔفیؽ ـا غ‬ٚ ٚ ‫ سؼؽاؼ قیبؼی ٔشؽ‬ٝ‫ ؼوشفوی ث‬ٜ‫ ٕ٘بییؽ اخبق‬ٜ‫ي لجّی اوشفبؼ‬ٚ‫أب اٌف اق ـ‬
‫ي‬ٚ‫ وفؼٖ اق ـ‬ٜ‫ـر اوشفبؼ‬ِٛ ‫ ؼـ‬ٝ‫ؽ' أفی و‬ٙ‫ؼ یبـی ٕ٘بی‬ٛ‫شف وفؼٖ اوىفیذز غ‬ٟ‫ؽ ٌٕب ـا ؼـ ث‬ٙ٘‫ا‬ٛ‫ ٔی س‬ٝ‫و‬
)‫ؼ‬ٌٛ ‫شفی ٔی‬ٙٔ ‫ْ سمفیجب‬ٚ‫ؼ‬
‫ٍیژگی ّای ضی هتٌی‬
) ‫ؽ ٔی ٕ٘بییؽ‬ٞ‫َ قیف ٍٔب‬ٚ‫ ؼـ خؽ‬ٝ‫یمٌی ـا ؼاـا ٔی ثبٌؽ و‬ٚ ٝ‫ی فمٗ و‬ٙ‫ٌی ٔش‬
Property Purpose
constructor Holds the value of the constructor function for an instance of the object
length Holds the numeric value of the length of the string (its number of
characters)
prototype Allows you to add properties to the object
The constructor Property
‫بی‬ٞ‫ وؽ‬ٜ‫ی ثفٌفؼا٘ؽٖ وبق٘ؽ‬ٙ‫ااوىفیذز) یؼ‬ٚ‫ ؼـ اٌیب ؼیٍف خب‬ٝ‫ؽ و‬ٙ‫ٕبٖ وبـی ـا ٔی و‬ٞ ‫یمٌی‬ٚ ٗ‫ای‬
)‫ی‬ٙ‫ٔطّی ٌی ٔش‬
5,-(. َ‫ٔثب‬
<body>
var guitar_string = new String("G");
document.write(guitar_string.constructor);

</script>
</body>
var guitar_string = new String("G");

)ُ‫ ٔمؽاـ ٍٔػ‬ٚ ْ‫ی خؽیؽ ثب ٘ب‬ٙ‫ایدبؼ یه ٌی ٔش‬
document.write(guitar_string.constructor);
)ً‫ ٕ٘بی‬ٝ‫ ؼـ ِفط‬constructor ‫یمٌی‬ٚ ‫زبح وفؼٖ ٔمؽاـ‬
The length Property
‫ی) ٌٕب‬ٙ‫ ٔش‬ٝ‫ؼ ؼـ ـٌش‬ٛ‫خ‬ٛٔ ‫بی‬ٞ‫ی سؼؽاؼ وبـوشف‬ٙ‫ی ـا ثفٔی ٌفؼا٘ؽ' یؼ‬ٙ‫ ٔش‬ٝ‫َ ـٌش‬ٛ٘ ‫یمٌی‬ٚ ٗ‫ای‬
)‫ ٕ٘بییؽ‬ٜ‫ ِیشفاِی اوشفبؼ‬ٝ‫ٓ اق ـٌش‬ٞ ٚ ‫ی‬ٙ‫ٓ اق ٌی ٔش‬ٞ ‫ا٘یؽ‬ٛٙ‫ٔی‬
5,-(/ َ‫ٔثب‬
<body>
var myname="John";
document.write("The name has "+myname.length+" characters.");
</script>
</body>
var myname="John";
‫ی‬ٙ‫وبغز یه ِیشفاَ ٔش‬
document.write("The name has "+myname.length+" characters.");

)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ ٕ٘بیً ٍ٘بٖ ؼاؼ‬ٝ‫ب ؼـ ِفط‬ٞ‫ سؼؽاؼ وبـوشف‬ٝ‫ٖ ث‬ٛ‫ػؽؼ ٔفث‬

The prototype Property
)‫یؽ‬ٞ‫ی اغشّبَ ؼ‬ٙ‫ ٌی ٔش‬ٝ‫بی ؼٌفی ـا ث‬ٞ ‫یمٌی‬ٚ ٚ ‫ب‬ٞ‫یمٌی' ٔشؽ‬ٚ ٗ‫ اق ای‬ٜ‫ا٘یؽ ثب اوشفبؼ‬ٛ‫ٌٕب ٔی س‬
5,-(0 َ‫ٔثب‬
String.prototype.attitude="cool";
var rightnow= new String("Joe");
window.alert("This string is "+rightnow.attitude);
String.prototype.attitude="cool";
)‫ؽ‬ٙ‫ ٔیى‬ٝ‫ی أبف‬ٙ‫ ٌی ٔش‬ٝ‫ یه غبِیز خؽیؽ ـا ث‬prototype ‫یمٌی‬ٚ
var rightnow= new String("Joe");

‫ی‬ٙ‫وبغز یه ٌی ٔش‬
window.alert("This string is "+rightnow.attitude);

)‫ زبح آٖ ؼـ ٕ٘بیٍٍف‬ٚ Joe ‫ خبی‬ٝ‫ ث‬cool ‫ی‬ٙ‫خبیٍكی‬
‫هتذّای ضی هتٌی‬
‫ب‬ٞ‫ اق ایٗ ٔشؽ‬ٜ‫ ٔی ٕ٘بییؽ) اوشفبؼ‬ٜ‫ؽ‬ٞ‫َ قیف ٍٔب‬ٚ‫ب ـا ؼـ خؽ‬ٟ٘‫ آ‬ٝ‫بی ثىیبـ قیبؼی ؼاـؼ و‬ٞ‫ی ٔشؽ‬ٙ‫ٌی ٔش‬
)‫ؽ ثبٌؽ‬ٙٙ‫ا٘ؽ ثىیبـ وٕه و‬ٛ‫ قیجب ٔی س‬ٚ ‫یب‬ٛ‫ د‬ٝ‫ ثفای وبغز یه ِفط‬ٚ ‫بی ٔػشّف‬ٞ ‫لؼیز‬ٛٔ ‫ؼـ‬
Method Purpose
anchor() Creates an HTML anchor tag with a target on a page
big() Adds <big> and </big> tags around a string value
blink() Adds <blink> and </blink> tags around a string value
bold() Adds <b> and </b> tags around a string value
charAt() Finds out which character is at a given position in a string
charCodeAt() Finds the character code of a character at a given position in a string
concat() Adds two or more strings together and returns the new combined string
value
fixed() Adds <tt> and </tt> tags around a string value
fontcolor() Adds <font color=“color”> and </font> tags around a string value, which
change the color of the string to a specified color

fontsize() Adds <font size=“number”> and </font> tags around a string value,
which change the size of the string to a specified size given as a number
fromCharCode() Uses character codes sent as parameters to create a new string
indexOf() Searches for a character sent as a parameter in a string: if it’s found, the
position of the first instance of the character is returned; otherwise, it
returns –1
italics() Adds <i> and </i> tags around a string value
lastIndexOf() Searches for a character sent as a parameter in a string: if it’s found, the
position of the last instance of the character is returned; otherwise, it
returns –1
link() Creates HTML links using the string as the link text and linking to the
URL sent as a parameter
match() Compares a regular expression and a string to see if they match
replace() Finds out if a regular expression matches a string and then replaces a
matched string with a new string
search() Executes the search for a match between a regular expression and a
specified string
slice() Pulls out a specified section of a string value and returns a new string
small() Adds <small> and </small> tags around a string value
split() Separates a string into an array of strings based on a character sent as a
parameter to the method
strike() Adds <strike> and </strike> tags around a string value
sub() Adds <sub> and </sub> tags around a string value
substr() Allows a portion of the string specified with a starting position and
ending after a certain number of characters to be returned
substring() Allows a portion of the string specified with a starting position and an
ending position to be returned
sup() Adds <sup> and </sup> tags around a string value
toString() Returns the string literal value of a String object
toLowerCase() Converts a string to all lowercase letters and returns the result
toUpperCase() Converts a string to all uppercase letters and returns the result
The big() Method
‫ی ؼـٌز سف‬ٙ‫ؽ) یؼ‬ٙٞ‫ ا٘دبْ ٔی ؼ‬html ‫< ؼـ ِفطبر‬big></big> ‫بی‬ٞ ً‫ٕبٖ وبـ س‬ٞ ‫ایٗ ٔشؽ‬
)ٖٛ‫ وبیف ٔش‬ٝ‫' ٘ىجز ث‬ّٕٝ‫وفؼٖ خ‬
5,-(0 َ‫ٔثب‬
var little_bit = "I only want a little bit of cake.";

var tagged_phrase = little_bit.small();
document.write(tagged_phrase);

5 َ‫ٔؼبؼ‬
<small>I only want a little bit of cake.</small>
The blink() Method
‫ی‬ٙ‫ؽ) یؼ‬ٙٞ‫ ا ا٘دبْ ٔی ؼ‬html ‫ < ؼـ ِفطبر‬blink ></ blink > ‫بی‬ٞ ً‫ٕبٖ وبـ س‬ٞ ‫ایٗ ٔشؽ‬
ٕٝٞ ‫ ایٗ ٔشؽ ؼـ‬ٝ‫ـؼ)اِیش‬ٚ‫ـر زٍٕه قٖ ؼـ ٔی آ‬ِٛ ٝ‫بی آٖ لفاـ ٔیٍیفؼ ـا ث‬ٞ ً‫ ؼـ ثیٗ س‬ٝ‫ی و‬ٙ‫ٔش‬
)‫ؼ‬ٌٛ ‫ب اخفا ٕ٘ی‬ٞ‫ـٌف‬ٚ‫ٔف‬
5,-(1 َ‫ٔثب‬
var little_bit = "I only want a little bit of cake.";

var tagged_phrase = little_bit.blink();
document.write(tagged_phrase);
5 َ‫ٔؼبؼ‬
<blink>I only want a little bit of cake.</blink>
ٚ bold(), fixed(), italics(), small(), strike(), sub(),ٝ‫اٖ ث‬ٛ‫ ٔی س‬ٜٚ‫بی ایٗ ٌف‬ٞ‫اق ؼیٍف ٔشؽ‬
ٗ‫ ٔش‬ٝ‫ اوشبِی غبِی ـا ث‬ٚ ‫فوؽاْ وجه‬ٞ ٚ ‫بی لجّی ٔی ثبٌؽ‬ِٟ‫ٕبٖ ٔثب‬ٞ ‫ب‬ٟ٘‫ ٘فق وبـ آ‬ٝ‫ وفؼ) و‬ٜ‫ اٌبـ‬sup()
)‫ؽ‬ٍٙ‫ٔی ثػ‬
The anchor() method
‫ب ثفای اـسجبٖ لىٕز‬ٟ٘‫ اق آ‬ٝ‫بیی و‬ٞ ً‫بیی ؼاـیؽ' س‬ٌٙ‫ ؼـ اذ سی اْ اَ آ‬#‫ٍف‬ِٙ$‫ـ‬ٛ‫بی آ٘س‬ٞ ً‫ضشٕب ثب س‬
‫ه‬ٙ‫ لىٕز ؼیٍف ِی‬ٝ‫ لىٕشی اق یه ٔشٗ ث‬ٝ‫ـر و‬ِٛ ٗ‫ؼ' ثؽی‬ٌٛ ‫ ٔی‬ٜ‫ یه ؼیٍف اوشفبؼ‬ٝ‫بی ٔػشّف ٔشٗ ث‬ٞ

‫ٌؽ‪ ٚ ٜ‬ثب وّیه ثفـ‪ٚ‬ی ِی‪ٙ‬ه ٔجؽا ث‪ِ ٝ‬ی‪ٙ‬ه ٔمّؽ' و‪ٔ ٝ‬ی س‪ٛ‬ا٘ؽ ٔشٗ' ػىه ‪ ٚ‬یب غیف‪ ٜ‬ثبٌؽ ؼوشفوی دیؽا‬
‫ٔی و‪ٙ‬یٓ) ؼـ ایٗ لىٕز ٔی غ‪ٛ‬ا‪ٞ‬یٓ ٔشؽی ـا ٔؼففی و‪ٙ‬یٓ و‪ ٝ‬ایٗ وبـ ـا ثفای ٔب ‪ ٚ‬ایٗ ثب ث‪ٚ ٝ‬ویّ‪ ٝ‬وؽ‪ٞ‬بی‬
‫خب‪ٚ‬ااوىفیذز ا٘دبْ ٔی ؼ‪ٞ‬ؽ ‪ 5‬یؼ‪ٙ‬ی ‪ٔ 5‬شؽ )(‪anchor‬‬
‫ٔثبَ ‪5,-(2‬‬
‫ٔی غ‪ٛ‬ا‪ٞ‬یٓ یه سً آ٘س‪ٛ‬ـ ثفای ؼوشفوی ث‪ part 1 ٝ‬ایدبؼ و‪ٙ‬یٓ ) اثشؽا ثبیؽ ‪ part 1‬ـا ث‪ ٝ‬ث‪ ٝ‬ؼـوشی ‪ٚ‬‬
‫ث‪ٚ ٝ‬ویّ‪ ٝ‬قیف سؼفیف و‪ٙ‬یٓ ‪5‬‬
‫>‪<a name="part1">Part 1</a‬‬
‫وذه ٘‪ٛ‬ثز ث‪ ٝ‬وؽ٘‪ٛ‬یىی ٔشؽ ‪ٔ anchor‬ی ٌ‪ٛ‬ؼ ‪5‬‬
‫;"‪var anchor_text = "Part 1‬‬

‫;)"‪var full_anchor = anchor_text.anchor("part1‬‬
‫;)‪document.write(full_anchor‬‬
‫‪The fontcolor() Method‬‬
‫اٌف ثػ‪ٛ‬ا‪ٞ‬یٓ ث‪ ٝ‬یه ٔشٗ ؼـ ‪ html‬ـً٘ غبِی ثجػٍیٓ ثبیؽ زیكی ‪ٕٞ‬ب٘‪ٙ‬ؽ وؽ قیف ـا ثىبـ ثجفیٓ' اِجش‪ٝ‬‬
‫ؼـ ای‪ٙ‬دب ٔ‪ٙ‬ظ‪ٛ‬ـ س‪ٟٙ‬ب اوشفبؼ‪ ٜ‬اق وؽ‪ٞ‬بی ‪ ٚ html‬ثؽ‪ ٖٚ‬وٕه ٌففشٗ اق ‪ٔ Css‬ی ثبٌؽ ‪5‬‬
‫>‪<font color="color_value">text_string</font‬‬
‫أب اٌف ثػ‪ٛ‬ا‪ٞ‬یٓ ‪ٕٞ‬یٗ ػُٕ ـا ث‪ٚ ٝ‬ویّ‪ ٝ‬خب‪ٚ‬ااوىفیذز ٌجی‪ ٝ‬وبقی و‪ٙ‬یٓ ٔی س‪ٛ‬ا٘یٓ اق ٔشؽ‬
‫)(‪ fontcolor‬ث‪ٟ‬ف‪ ٜ‬ثجفیٓ ‪ٕٞ‬ب٘‪ٙ‬ؽ ٔثبَ قیف)‬
‫ٔثبَ ‪5,-(3‬‬
‫>‪<body‬‬
‫;"!‪var the_text = "I am so mad I am red‬‬
‫;))"‪document.write(the_text.fontcolor("red‬‬
</script>
</body>
5 َ‫ٔؼبؼ‬
<font color="red">I am so mad I am red!</font>
)ٓ‫ ٕ٘بیی‬ٜ‫ٓ اوشفبؼ‬ٞ ‫ب‬ٞ ً٘‫ٍكاؼویٕبَ ـ‬ٞ َ‫ا٘یٓ اق ٔؼبؼ‬ٛ‫ اق ٔشؽ ثبال ٔی س‬ٜ‫ٍبْ اوشفبؼ‬ٙٞ ‫ؼـ‬
5,-(4 َ‫ٔثب‬
<body>
var the_text = "I am so mad I am red!";
document.write(the_text.fontcolor("#FF0000"));
</font>
5َ‫ٔؼبؼ‬
<font color= "#FF0000">I am so mad I am red!</font>
The fontsize() Method
‫ اق ٘بْ آٖ ثفٔی‬ٝ‫ـ و‬ٛٙ٘‫ٕب‬ٞ ٝ‫ ٔی ثبٌؽ' و‬fontsize() ‫ااوىفیذز‬ٚ‫ؼ ؼـ خب‬ٛ‫خ‬ٛٔ ‫بی‬ٞ‫یىی ؼیٍف اق ٔشؽ‬
)‫ؼ‬ٚ‫ وبـ ٔی ـ‬ٝ‫ ٔشٗ ث‬ٜ‫ظیٓ وفؼٖ ا٘ؽاق‬ٙ‫آیؽ ثفای س‬
5,-(,+ َ‫ٔثب‬
<body>

var the_text = "I am pretty small!";

document.write(the_text.fontsize(2));
</script>
</body>
5 َ‫ٔؼبؼ‬
<font size="2">I am pretty small!</font>
The link() Method
)ٓ‫ ٔی ٕ٘بیی‬ٜ‫ اق ایٗ ٔشؽ اوشفبؼ‬ٝ‫بی ٔػشّف ؼـ ِفط‬ٞ ‫ه‬ٙ‫ثفای لفاـ ؼاؼٖ ِی‬
5,-(,, َ‫ٔثب‬
<body>
var link_text = "A Web Site";
var full_link = link_text.link("http://www.dlp.lxb.ir");
document.write(full_link);
</script>
</body>
5 َ‫ٔؼبؼ‬
<a href="http://www.www.dlp.lxb.ir">A Web Site</a>
5,-(,- َ‫ٔثب‬
5 ‫غز‬ٛٔ‫یؽ آ‬ٞ‫ا‬ٛ‫ـ ـا غ‬ٛ‫ آ٘س‬ٚ ‫ه‬ٙ‫بی ِی‬ٞ‫ وبـ ٔشؽ‬ٜٛ‫ؼـ ٔثبَ قیف ٘ط‬
<body>
<p>
var anchor_text = "Part 1";
var full_anchor = anchor_text.anchor("part1");
document.write(full_anchor);
</script>

</p>
<p>
Part 1 is about this, that and the other thing.<br />
<br /><br /><br /><br />
This is irrelevant text in this case used for filler.
</p>
<p>
<p>This is irrelevant text in this case used for
filler.</p><br />
<br />
<br />
filler.</p><br />
<br />
<br />
filler.</p><br />
<br />
<br /><p>This is irrelevant text in this case used for
filler.</p><br />
<br />
filler.</p><br />
<br />
filler.</p><br />
<br />
filler.</p><br />
<br />
filler.</p><br />
<br />
filler.</p><br />
<br />
filler.</p><br />
<br />
filler.</p><br />
<br />
filler.</p><br />
<br />
filler.</p><br />
<br />


filler.</p><br />
<br />
filler.</p><br />
<br />
filler.</p><br />
<br />
filler.</p><br />
<br />
var link_text="Back to Beginning of Part 1";
var full_link= link_text.link("#part1");
document.write(full_link);
</script>
</p>
</body>
The charAt() Method
ٖ‫ ٌٕب ثب ؼاؼ‬ٝ‫ب و‬ٙ‫ؼ) ثؽیٗ ٔؼ‬ٚ‫ ثىبـ ٔی ـ‬ٝ‫لؼیز ؼـ ـٌش‬ٛٔ ‫بظف ثب یه‬ٙ‫ایٗ ٔشؽ ثفای دیؽا وفؼٖ ضفف ٔش‬
ٗ‫ اق ای‬ٜ‫یؽ وفؼ) ؼـ اوشفبؼ‬ٞ‫ا‬ٛ‫ؽ ـا ؼـیبفز غ‬ٙ‫ىش‬ٞ ‫بظف ثب آٖ ػؽؼ‬ٙ‫ ٔش‬ٝ‫ ؼـ ـٌش‬ٝ‫فی ـا و‬ٚ‫ ضف‬ٝ‫دبـأشف ػؽؼی ث‬
)‫ یه‬ٝ٘ ‫٘ؽ‬ٌٛ ‫ع ٔی‬ٚ‫لؼیز ِفف ٌؿ‬ٛٔ ‫ اق‬ٝ‫ف یه ـٌش‬ٚ‫ ضف‬ٝ‫ ثبٌیؽ و‬ٝ‫ٔشؽ ثبیؽ ؼلز ؼاٌش‬
5,-(,. َ‫ٔثب‬
var the_text = "Character";

var first_char = the_text.charAt(0);
window.alert("The first character is "+first_char);
.charAt() ‫ وٕه ٔشؽ‬ٝ‫ ث‬ٚ length ‫ اق غبِیز‬ٜ‫ ثب اوشفبؼ‬ّٕٝ‫دیؽا وفؼٖ ضفف آغف یه و‬
‫ ثبٌیؽ أب دیؽا‬ٝ‫ ؼوشفوی ؼاٌش‬ٝ‫َ یه ـٌش‬ٚ‫ ضفف ا‬ٝ‫ ث‬charAt() ‫ اق ٔشؽ‬ٜ‫ا٘یؽ ثب اوشفبؼ‬ٛ‫ ٔی س‬ٍٝ‫ٕی‬ٞ ‫ٌٕب‬
)‫ ثىیب ـاضز سف ٔی ثبٌؽ‬length ‫ اق غبِیز‬ٜ‫وفؼٖ ضفف آغف ثب اوشفبؼ‬
5,-(,/ َ‫ٔثب‬
var the_text = "Character";

var position = the_text.length-1;
var last_char = the_text.charAt(position);
window.alert("The last character is "+last_char);
The concat() Method
‫ؽ‬ٙ‫ یب ز‬ٚ‫ زىجب٘ؽٖ ؼ‬ٝ‫ی ث‬ٙ‫غشیٓ) یؼ‬ٛٔ‫ب آ‬ٞ ٝ‫ آـای‬ٝ‫ٖ ث‬ٛ‫ ؼـ فُّ ٔفث‬ٝ‫ؽ و‬ٞ‫ٕبٖ وبـی ـا ا٘دبْ ٔیؽ‬ٞ ‫ایٗ ٔشؽ‬
)ٝ‫ـٌش‬
5,-(,0 َ‫ٔثب‬
var string1 = "I went to the store ";

var string2 = "then ";
var string3 = "I played a video game";
window.alert(string1.concat(string2,string3));
5 ٝ‫٘شید‬
I went to the store then I played a video game
5,-(,1 َ‫ٔثب‬
var string1 = "I went to the store ";

var string2 = " then ";
var string3 = "I played a video game";
window.alert(string3.concat(string2,string1));
5 ٝ‫٘شید‬

I played a video game then I went to the store
The fromCharCode() Method
)‫ؽ‬ٞ‫ف وبـوشف ػّٕی ـا ا٘دبْ ٔیؽ‬ٞ ٝ‫ٖ ث‬ٛ‫ اق وؽ ٔفث‬ٜ‫ایٗ ٔشؽ ثب اوشفبؼ‬
5,-(,1 َ‫ٔثب‬
window.alert(String.fromCharCode(72,73));
ٗ‫ٕی‬ٞ ‫ وذه‬ٜ‫ؼ‬ٕٛ٘ ُ‫ سجؽی‬H ‫ی‬ٙ‫ ٔؼبؼَ آٖ یؼ‬ٝ‫ آٖ ـا ث‬ٚ ٝ‫ ـا ٌففش‬2- ‫ی‬ٙ‫ِیٗ دبـأشفیؼ‬ٚ‫ایٗ وؽ اثشؽا ا‬
ٖ‫ا‬ٛٙ‫ ػ‬ٝ‫ ـا ث‬HI ‫بیز‬ٟ٘ ‫ ؼـ‬ٚ ‫ ٔی ٕ٘بیؽ‬ٕٝ‫ سفخ‬I ٝ‫ آٖ ـا ث‬ٚ ٜ‫ٓ ا٘دبْ ؼاؼ‬ٞ 2. ‫ی‬ٙ‫ْ یؼ‬ٚ‫وبـ ـا ثب دفأشف ؼ‬
)‫خی ثفٔی ٌفؼا٘ؽ‬ٚ‫غف‬
The indexOf() Method
‫( ـا‬, ‫ؼ ٔمؽاـ‬ٍٛ٘ ‫ـؼ ٘ظف دیؽا‬ٛٔ ‫اٌف ضفف‬ٚ)‫ ـا ثفٔی ٌفؼا٘ؽ‬ٝ‫ یب ـٌش‬ّٕٝ‫ِیٗ ضفف یه و‬ٚ‫لؼیز ا‬ٛٔ ‫ایٗ ٔشؽ‬
)‫ثفٔی ٌفؼا٘ؽ‬
5,-(,2 َ‫ٔثب‬
var the_text = "Cool";

var position = the_text.indexOf("C");
window.alert("Your character is at position "+position);
)‫ ٔی ثبٌؽ‬Cool ّٕٝ‫ِیٗ ضفف و‬ٚ‫ ا‬C ‫ ـا ثفٔی ٌفؼا٘ؽ قیفا ضفف‬0 ‫ؼـ ٔثبَ ثبال‬
5,-(,3 َ‫ٔثب‬

var position = the_text.indexOf("c");

ٝ‫ؼ)ؼلز ٕ٘بییؽ و‬ٌٛ ‫ـؼ ٘ظف یبفز ٕ٘ی‬ٛٔ ّٕٝ‫" ؼـ و‬c" ‫ ـا ثفٔی ٌفؼا٘ؽ قیفا‬-1 ‫ؼـ ٔثبَ ثبال ٔشؽ ٔمؽاـ‬
)‫زه‬ٛ‫ و‬c ٝ٘ ‫ اوز‬ٜ‫ع ٌؽ‬ٚ‫ ثكـي ٌف‬C ‫ ثب‬Cool
5,-(,4 َ‫ٔثب‬

var position = the_text.indexOf("c");
if (position == -1) {
window.alert("Your character is not in the string!");
}
else {
}
‫ـؼ ٘ظف‬ٛٔ ‫ؼ قیفا ضفف‬ٌٛ ‫ ٔی‬ٜ‫ ثفٌفؼا٘ؽ‬Your character is not in the string ّٕٝ‫ؼـ ٔثبَ ثبال خ‬
)‫ؼ‬ٌٛ ‫ یبفز ٕ٘ی‬ّٕٝ‫ؼـ و‬
5,-(-+ َ‫ٔثب‬

var position = the_text.indexOf("o");
if (position == -1) {
window.alert("Your character is not in the string!");
}
else {
}
‫"( ؼـ‬o") ٗ‫ِی‬ٚ‫ ـا ثفٔی ٌفؼا٘ؽ) قیفا ا‬Your character is at position 1 ّٕٝ‫ؼـ ٔثبَ ثبال خ‬
)‫ؼ‬ٌٛ ‫ یبفز ٔی‬Cool ّٕٝ‫ و‬, ‫لؼیز‬ٛٔ
5,-(-, َ‫ٔثب‬
var the_text = "I like fruit!";

if ((the_text.indexOf("fruit") != -1) &&
(the_text.indexOf("candy") ==
-1)) {
window.alert("Yes, fruit is good for you!");

}
else {
window.alert("Please consider fruit rather than candy.");
}
indexOf ‫ؼ قیفا ٔشؽ‬ٌٛ ‫ ٔی‬ٜ‫"( ثفٌٍز ؼاؼ‬Yes, fruit is good for you!") ّٕٝ‫ؼـ ٔثبَ ثبال خ‬
)‫َ ـا ثفٔی ٌفؼا٘ؽ‬ٚ‫ ا‬ّٕٝ‫جیك ؼاؼٖ آٖ خ‬ٙ‫ ثب س‬ٚ ٜ‫بوبیی وفؼ‬ٌٙ ‫ـؼ ٘ظف‬ٛٔ ٝ‫ ـا ؼـ ـٌش‬fruit ّٕٝ‫و‬
The lastIndexOf() Method
‫ وذه‬ٜ‫ ـا دبیً وف‬ّٕٝ‫ اثشؽا سٕبْ خ‬ٝ‫ب و‬ٙ‫ؽ' ثؽیٗ ٔؼ‬ٙ‫ ػُٕ ٔی و‬indexOf() ‫ایٗ ٔشؽ ػىه ٔشؽ‬
)‫ـؼ ٘ظف اوز ـا ثفٔی ٌفؼا٘ؽ‬ٛٔ ٝ‫لؼیشی و‬ٛٔ ٗ‫آغفی‬
5,-(-- َ‫ٔثب‬
var the_text = "Cool Cruising Car";

var position = the_text.indexOf("C");
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ ؼاؼ‬ٝ‫ ٔمؽاـ ِفف ثفٌٍش‬ٝ‫ ایٓ ؼـ ٘شید‬ٜ‫ وفؼ‬ٜ‫ اوشفبؼ‬indexOf ‫ؼـ ٔثبَ ثبال اق ٔشؽ‬
5 ‫ ؼـ وؽ قیف‬ٝ‫ؼـ ضبِی و‬
var the_text = "Cool Cruising Car";

var position = the_text. lastIndexOf("C");
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ ثفٌفؼا٘ؽ‬,/ ‫ ایٓ ٔمؽاـ‬ٜ‫ وفؼ‬ٜ‫ اوشفبؼ‬lastIndexOf() ‫ اق ٔشؽ‬ٝ‫و‬
The replace() Method

‫ایٗ ٔشؽ ؼ‪ ٚ‬دبـأشف ؼـیبفز ٔی و‪ٙ‬ؽ) ‪٘ ٚ‬فیم‪ ٝ‬ػُٕ وفؼٖ آٖ ثؽیٗ ِ‪ٛ‬ـر اوز و‪ ٝ‬اثشؽا دبـأشف ا‪ َٚ‬ـا ثب ٔشٗ‬
‫یب ـٌش‪ ٝ‬س‪ٙ‬جیك ٔی ؼ‪ٞ‬ؽ ‪ ٚ‬ؼـ ِ‪ٛ‬ـر یبفشٗ آٖ ؼـ ٔشٗ یب ـٌش‪ 'ٝ‬دبـأشف ؼ‪ ْٚ‬ـا خبیٍكیٗ آٖ ٔی و‪ٙ‬ؽ)‬
‫ٔثبَ ‪5,-(-.‬‬
‫>‪<body‬‬
‫;"‪var the_text = "Benz Cruising Car‬‬
‫;)"‪var the_text_replace = the_text.replace("Benz","BMW‬‬
‫;)‪window.alert(the_text_replace‬‬
‫>‪</body‬‬
‫‪The slice() Method‬‬
‫ایٗ ٔشؽ ثفای خؽا وفؼٖ لىٕشی اق ٔشٗ یب ـٌش‪ ٚ ٝ‬سجؽیُ آٖ ث‪ ٝ‬ـٌش‪ ٝ‬ای خؽاٌب٘‪ ٝ‬ث‪ ٝ‬وبـ ٔی ـ‪ٚ‬ؼ) ایٗ‬
‫ٔشؽ ؼ‪ ٚ‬دبـأشف ؼـیبفز ٔی و‪ٙ‬ؽ' و‪ ٝ‬دبـأشف ا‪ٛٔ َٚ‬لؼیز وبـوشفی ـا ٍ٘بٖ ٔی ؼ‪ٞ‬ؽ و‪ ٝ‬ػّٕیبر اق آٖ ٌف‪ٚ‬ع‬
‫ٔی ٌ‪ٛ‬ؼ ‪ ٚ‬دبـأشف ؼ‪ٛٔ ْٚ‬لؼیز وبـوشفی ـا ٍ٘بٖ ٔی ؼ‪ٞ‬ؽ و‪ ٝ‬ػّٕیبر ثفي سب آ٘دب اؼأ‪ٔ ٝ‬ی یبثؽ)‬
‫ٔثبَ ‪5,-(-/‬‬
‫;"!‪var the_text = "Do not cut this short‬‬

‫;)‪var shorter_string = the_text.slice(0,7‬‬
‫;)‪window.alert(shorter_string‬‬
‫ؼـ ٔثبَ ثبال ” ‪ “Do not‬ث‪ ٝ‬ػ‪ٛٙ‬اٖ غف‪ٚ‬خی ٘‪ٟ‬بیی ثفٌفؼا٘ؽ‪ٔ ٜ‬ی ٌ‪ٛ‬ؼ)‬
‫‪The split() Method‬‬
‫ایٗ ٔشؽ یه آـای‪ ٝ‬اق اخكایی و‪ ٝ‬ؼـ ـٌش‪ٔ ٝ‬ش‪ٙ‬ی لفاـ ؼاـ٘ؽ ایدبؼ ٔی و‪ٙ‬ؽ)ایٗ ٔشؽ دبـأشفی ـا ث‪ ٝ‬ػ‪ٛٙ‬اٖ‬
‫خؽاو‪ٙٙ‬ؽ‪ ٜ‬ؼـیبفز ٔی ٕ٘بیؽ ‪ ٚ‬ثف اوبن آٖ ػُٕ ‪ split‬وفؼٖ ـا ا٘دبْ ٔی ؼ‪ٞ‬ؽ)‬
‫ٔثبَ ‪5,-(-1‬‬
‫;"‪var the_text = "orange:apple:pear:grape‬‬

var split_text = the_text.split(":");

var end_count = split_text.length;
for (var count=0; count<end_count; count++) {
document.write(split_text[count]+"<br />");
}
The substr() Method
ُٕ‫ دبـأشف ثفای ایٗ ػ‬ٚ‫ؽ) اق ؼ‬ٞ‫خی ٔیؽ‬ٚ‫اٖ غف‬ٛٙ‫ ػ‬ٝ‫ آٖ ـا ث‬ٚ ٜ‫ایٗ ٔشؽ لىٕ شی اق ٔشٗ ـا ضؿف وفؼ‬
)‫ؽ‬ٙ‫لف آٖ ـا اػالْ ٔی و‬ٛ‫ْ س‬ٚ‫ دبـأشف ؼ‬ٚ ‫ع ػّٕیبر‬ٚ‫َ ٌف‬ٚ‫ دبـأشف ا‬ٝ‫ؽ و‬ٙ‫ ٔی و‬ٜ‫اوشفبؼ‬
5,-(-2 َ‫ٔثب‬
var the_text = "Do not cut this short!";

var shorter_string = the_text.substr(0,7);
window.alert(shorter_string);
The substring() Method
‫ب ـا ثفای‬ٞ‫ؽ سب دبـأشف‬ٞ‫ ٔی ؼ‬ٜ‫ ٌٕب اخبق‬ٝ‫ؽ أب ایٗ ٔشؽ ث‬ٙ‫ ػُٕ ٔی و‬substr() ‫ؽ ٔشؽ‬ٙ٘‫ٕب‬ٞ ‫ایٗ ٔشؽ‬
)‫خی ثفٔی ٌفؼا٘ؽ‬ٚ‫اٖ غف‬ٛٙ‫ ػ‬ٝ‫ ـا ث‬ٜ‫بیز ٔشٗ ضؿف ٌؽ‬ٟ٘‫ ؼـ‬ٚ ‫یؽ‬ٙ‫ اـوبَ و‬ّٕٝ‫لؼیز ؼـ خ‬ٛٔ ٗ‫ آغفی‬ٚ ٗ‫ِی‬ٚ‫ا‬
5,-(-3 َ‫ٔثب‬
var the_text = "Do not cut this short!";

var shorter_string = the_text.substring(3,7);
window.alert(shorter_string);
The toString() Method
)‫ؼ‬ٚ‫ وبـ ٔی ـ‬ٝ‫ ث‬string literal ‫ به‬String object ‫ایٗ ٔشؽ ثفای سجؽیُ یه‬
5,-(-4 َ‫ٔثب‬
var string_obj = new String("Cool");

var string_lit = string_obj.toString();

The toLowerCase() Method
‫ ایٗ ٔشؽ ا٘دبْ ٔی‬ٝ‫زه وبـی اوز و‬ٛ‫ف و‬ٚ‫ ضف‬ٝ‫ب ث‬ٟ٘‫ سجؽیُ آ‬ٚ ٗ‫ؼ ؼـ ٔش‬ٛ‫خ‬ٛٔ ‫ف ثكـي‬ٚ‫ٌففشٗ ضف‬
)‫ؽ‬ٞ‫ؼ‬
5,-(.+ َ‫ٔثب‬
<body>
var the_text = "I FEEL CALM, REALLY.";
document.write(the_text.toLowerCase());
</script>
</body>
5ٝ‫٘شید‬
i feel calm, really.
The toUpperCase() Method
)‫ف ثكـي‬ٚ‫ ضف‬ٝ‫زه ث‬ٛ‫ف و‬ٚ‫ی سجؽیُ ضف‬ٙ‫ؽ) یؼ‬ٞ‫ػّٕی ػىه ٔشؽ ثبال ا٘دبْ ٔی ؼ‬
5,-(., َ‫ٔثب‬
<body>
var the_text = "I am yelling!";
document.write(the_text.toUpperCase());
</script>
</body>
5 ٝ‫٘شید‬
I AM YELLING!

ٗ‫ؽ سب اق ای‬ٙ‫ اوز ز‬ٜ‫ ایؽ' ؼـ ٔثبَ قیف وؼی ٌؽ‬ٜ‫ب ٌؽ‬ٌٙ‫ ای آ‬ٝ‫ؼ ؼـ ٌی ـٌش‬ٛ‫خ‬ٛٔ ‫بی‬ٞ‫ضبال ٌٕب ثب ٔشؽ‬
)ٓ‫ وبـ ثجفی‬ٝ‫ٓ ث‬ٞ ‫ب ـا ثب‬ٞ‫ٔشؽ‬
5,-(.- َ‫ٔثب‬
<body>
<h1>Welcome!</h1>
function getname() {
var the_text=window.prompt("Enter your first and last
name","");
if (the_text.indexOf(" ") == -1) {
window.alert("Put a space between your first and last name.
Try again.");
getname();
}
var split_text= the_text.split(" ");
if ((split_text[0].charAt(0) != "Z") ||
(split_text[0].charAt(0) != "z")) {
var shorter_fn_string =
split_text[0].substring(1,split_text[0].length);
new_fn_name = "Z"+shorter_fn_string;
}
else {
var shorter_fn_string =
new_fn_name = "W"+shorter_fn_string;
}
if ((split_text[1].charAt(0)!= "Z") ||
(split_text[1].charAt(0)!= "z")) {
var shorter_ln_string=
new_ln_name="Z"+shorter_ln_string;
}
else {
var shorter_ln_string=
new_ln_name="W"+shorter_ln_string;
}
window.alert("Now your name is "+new_fn_name+"
"+new_ln_name+"!");
}
getname();
</script>
</body>

‫ؼـ ایٗ ٔثبَ اثشؽا اوٓ وبـثف ؼـیبفز ٔی ٌ‪ٛ‬ؼ ‪ ٚ‬وذه ضف‪ٚ‬ف ا‪ َٚ‬ثب ضفف "‪ "Z‬خبیٍكیٗ ٔی ٌ‪ٛ‬ؼ) ‪ٞ‬ف‬
‫ز‪ٙ‬ؽ ٔثبَ ثبال یه ٔثبَ وبـثفؼی ٕ٘ی ثبٌؽ أب ٌٕب ـا ثب اوشفبؼ‪ ٜ‬اق ٔشؽ‪ٞ‬بی ٔ‪ٛ‬خ‪ٛ‬ؼ ؼـ ٌی ـٌش‪ٔ ٝ‬ش‪ٙ‬ی‬
‫ثیٍشف آٌ‪ٙ‬ب ٔی و‪ٙ‬ؽ)‬
‫ضیء ػثارات هٌظن (‪)RegExp Object‬‬
‫‪ RegExp‬چیست‬
‫یه ػجبـر ٔ‪ٙ‬ظٓ (‪ٌ )Regular Expression‬ی ئی اوز و‪ ٝ‬اٍِ‪ٛ‬ی وبـاوشف‪ٞ‬ب ـا ٍٔػُ ٔی و‪ٙ‬ؽ)‬
‫‪ٚ‬لشی و‪ٌٕ ٝ‬ب ؼـ ضبَ خىشد‪ ٛ‬ؼـثبـ‪ ٜ‬ػجبـسی ؼـ یه ٔشٗ ‪ٞ‬ىشیؽ ٍ٘بٖ ؼ‪ٙٞ‬ؽ‪ ٜ‬ایٗ اوز و‪ٌٕ ٝ‬ب ث‪ ٝ‬ؼ٘جبَ‬
‫ز‪ٔ ٝ‬ی ٌفؼیؽ) یه اٍِ‪ٛ‬ی وبؼ‪ٔ ٜ‬ی س‪ٛ‬ا٘ؽ ٌبُٔ فمٗ یه وبـاوشفثبٌؽ)‬
‫اٍِ‪ٞٛ‬بی دیسیؽ‪ ٜ‬سف وبـاوشف‪ٞ‬بی ثیٍشفی ؼاـ٘ؽ ‪ ٚ‬ثفای سدكی‪ ،)Parse( ٝ‬ثفـوی وبغشبـ یب ففٔز‪،‬‬
‫خبٍ٘ی‪ٙ‬ی ‪ ٚ‬یب وبـ‪ٞ‬بی ؼیٍف ٔ‪ٛ‬ـؼ اوشفبؼ‪ ٜ‬لفاـ ٌیفؼ)‬
‫ػجبـار ٔ‪ٙ‬ظٓ اثكاـی لؽـسٕ‪ٙ‬ؽ ثفای اخفای "اٍِ‪ ٛ‬و‪ٙ‬دی ‪ ٚ‬خىشد‪ ٚ ٛ‬خبثدبیی" ؼـ ٔشٗ ‪ٞ‬ب ث‪ ٝ‬وبـ ٔی‬
‫ـ‪ٚ‬ؼ)‬
‫‪var varname = /your_pattern/flags‬‬
‫ٔثبَ ‪5,-(..‬‬
‫;)""‪var thename = window.prompt("Enter your name",‬‬

‫;‪var tomatch = /John/‬‬
‫;)‪var is_a_match = tomatch.test(thename‬‬
‫{ )‪if (is_a_match‬‬
‫;)"!‪window.alert("Wow, we have the same name‬‬
}
else {
window.alert("Not my name, but it will work!");
}
Wow, we have the same name ْ‫ ثبٌؽ دیب‬John ‫ؽ‬ٙ‫اـؼ ٔی و‬ٚ ‫ وبـثف‬ٝ‫ؼـ ٔثبَ ثبال اٌف ٘بٔی و‬
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ ٕ٘بیً ؼاؼ‬Not my name, but it will work ْ‫ـر دیب‬ّٛٙ‫ ٕ٘بیً ؼـ ٔی آیؽ ؼـ غیف ای‬ٝ‫ث‬
Adding Flags
‫جیك ؼاؼٖ ؼـ ایٗ ٔشٗ یب‬ٙ‫ ػّٕیبر س‬ٝ‫یؽ و‬ٙ‫ا٘یؽ ٍٔػُ و‬ٛ‫) ٌٕب ٔی س‬Flags( ‫ب‬ٞ ٓ‫ اق دفز‬ٜ‫ثب اوشفبؼ‬
)‫ف ٔشٗ ؼیٍفی ا٘دبْ ٌیفؼ‬ٞ ‫ؼـ‬
)‫ ٔی ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫ب ـا ؼـ قیف ٍٔب‬ٞ ٓ‫ِیىز دفز‬
Flag(s) Purpose
i Makes the match case insensitive
g Makes the match global
m Makes the match work in multiline mode
: Flag i
‫ف‬ٚ‫زىی ضف‬ٛ‫ظف اق ثكـٌی یب و‬ٙ‫جیك' ِفف‬ٙ‫ؽ ػّٕیبر س‬ٙ‫ ٍٔػُ ٔی و‬ٝ‫ ىز و‬ٙ‫ ای‬Flag ٗ‫غبِیز ای‬
)‫ؼ‬ٚ‫ف اق ثیٗ ٔی ـ‬ٚ‫زىی ضف‬ٛ‫ و‬ٚ ‫ ثكـٌی‬ٝ‫ ضىبویز ث‬ٝ‫ا٘دبْ ٌیفؼ ؼـ ٘شید‬
5,-(./ َ‫ٔثب‬
var thename= window.prompt("Enter your name","");

var tomatch=/John/i;
if (tomatch.test(thename)) {
window.alert("Wow, we have the same name!");
}
else {
window.alert("Not my name, but it will work!");
}

: Flag g
‫ ؼوز‬ٝ‫ا٘ی ٘یك ث‬ٛ‫ٕػ‬ٞ ٗ‫ِی‬ٚ‫ب ـا ثؼؽ اق دیؽا وفؼٖ ا‬ٞ ‫ا٘ی‬ٛ‫ٕػ‬ٞ ْ‫ییٓ سٕب‬ٍٛ‫ ث‬ٝ‫ى‬ٙ‫ ثفای ای‬g (global$ ‫اق‬
‫ؽ‬ٙ٘‫ٕب‬ٞ ‫ؽ‬ٙ‫َ ٕ٘ی و‬ٛ‫ب ـا لج‬ٞ ٖ‫ آ‬ٚ ‫ ثكـي ضىبن اوز‬ٚ ‫زه‬ٛ‫ف و‬ٚ‫ ضف‬ٝ‫ؼ) ایٗ ٔؽیفبیف ث‬ٚ‫ وبـ ٔی ـ‬ٝ‫ـؼ ث‬ٚ‫آ‬
‫ ٌٕب‬ٝ‫ ای و‬ّٕٝ‫ ؼ٘جبَ و‬ٝ‫بة وفؼ ایٗ ٔؽیفبیف ث‬ٙ‫َ اخش‬ٚ‫ ا‬Is ‫ اق‬ٚ ‫بوبیی وفؼ‬ٌٙ ‫ ـا‬is ٚ‫ فمٗ ؼ‬ٝ‫ٕیٗ ٔثبَ و‬ٞ
)‫ؽ‬ٙ‫ اوشػفاج ٔی و‬str ‫ؽ آٖ ـا اق ؼاغُ ٔشغیف‬ٙ٘‫ٕب‬ٞ ٚ ‫ ایؽ ٔی ٌفؼؼ‬ٜ‫اـؼ وفؼ‬ٚ pattern ‫ؼـ لىٕز‬
5,-(.0 َ‫ٔثب‬
<body>
<h1>Welcome!</h1>
var str = "Is this all there is?";
var patt1 = /is/g;
document.write(str.match(patt1));
</script>
</body>
5 ٝ‫٘شید‬
is,is
‫ب ٔی ثبٌؽ‬ٞ ٖ‫خی سّفیمی اق آ‬ٚ‫ غف‬ٚ ‫ اوز‬ٜ‫ ٌؽ‬ٜ‫ اوشفبؼ‬Flag ٚ‫ف ؼ‬ٞ ‫ؼـ ٔثبَ قیف اق‬
5,-(.1 َ‫ٔثب‬
<body>
<h1>Welcome!</h1>
var str = "Is this all there is?";
var patt1 = /is/gi;
document.write(str.match(patt1));
</script>
</body>
5ٝ‫٘شید‬
Is,is,is

test)( ‫هتذ‬
ٝ‫ؼ ؼاٌش‬ٛ‫خ‬ٚ ٖ‫ ؼـ آ‬ٝ‫ـسی و‬ِٛ ‫ ؼـ‬ٚ ‫ـؼ ٘ظف ٌٕب ٔی ٌفؼؼ‬ٛٔ ‫ایٗ ٔشؽ ؼـ ؼاغُ یه ٔشٗ ؼ٘جبَ ٔمؽاـ‬
)‫ ـا ثف ٔی ٌفؼا٘ؽ‬false ‫ـر ٔمؽاـ‬ِٛ ٗ‫ ؼـ غیف ای‬ٚ true ‫ثبٌؽ ٔمؽاـ‬
5,-(.2 َ‫ٔثب‬
<body>
var patt1 = new RegExp("e");
document.write(patt1.test("the best things in life are
free"));
</script>
</body>
5ٝ‫٘شید‬
true
exec)( ‫هتذ‬
‫ ـا ثف‬ٜ‫ـر دیؽا وفؼٖ آٖ ٔشٗ دیؽا ٌؽ‬ِٛ ‫ ؼـ‬ٚ ٝ‫ـؼ ٘ظف ٌٕب ٌٍش‬ٛٔ ‫ایٗ ٔشؽ ؼـ ؼاغُ ٔشٗ ؼ٘جبَ ٔمؽاـ‬
)‫ ـا ثف ٔی ٌفؼا٘ؽ‬null ‫ؽ ٔمؽاـ‬ٙ‫ دیؽا ٘ى‬ٝ‫ـسی و‬ِٛ ‫ ؼـ‬ٚ ‫ٔی ٌفؼا٘ؽ‬
5,-(.3 َ‫ٔثب‬
<body>
var patt1 = new RegExp("e");
document.write(patt1.exec("the best things in life are
free"));
</script>
</body>
5ٝ‫٘شید‬

‫ؼ اوز ـا‬ٛ‫خ‬ٛٔ ْٟٛ‫ ٔف‬ٝ‫ؼ و‬ٌٛ ‫خی زبح ٔی‬ٚ‫ ؼـ غف‬e ‫ ثبٌیؽ فمٗ یه‬ٝ‫ ٘یك ؼاٌش‬e ٜ‫ؼـ ٔثبَ ثبال اٌف ٌٕب ؼ‬
)‫ٔی ـوب٘ؽ‬
)‫ ٔی ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫ب ـا ٍٔب‬ٟ٘‫ـؼ آ‬ٛٔ ‫ٔیطبسی ٔػشّف ؼـ‬ٛ‫ س‬ٚ RegExp ‫بی‬ٞ‫ؼـ قیف ِیىشی اق وؽ‬
Character Character Example

\ Used to escape special characters or to make \@ escapes the @ character
a normal character special \n represents a newline
character
[\b] Matches a BACKSPACE keystroke /[\b]/ matches a backspace
\b Matches when the character before or after it /\bc/ matches c in my car
is located at a word boundary, such as before /\bm/ matches m in my car
or after a space character; to match the /\bc/ does not match c in ace
beginning of a word, place the character to /\bm/ does not match m in
the right of the symbol (\bc); to match the end Sam
of a word, place the character to the left (c\b) /m\b/ matches m in Sam
/c\b/ matches c in Mac W
/m\b/ does not match m in
emu
/c\b/ does not match c in my
car
\B Matches a character that is not located at a /\Ba/ matches a in car
word boundary /\Bc/ does not match c in car
\cX Using a letter character to replace X, matches /\cX/ matches CTRL-X
when the user presses the CTRL key followed /\cV/ matches CTRL-V
by typing the letter X /\cS/ does not match CTRL-
Z
\D Matches a single character if it is not a /\D/ matches s
numeric character /\D/ does not match 4
\f Matches if there is a form feed /\f/ matches a form feed
\n Matches if there is a new line /\n/ matches a new line
\r Matches if there is a carriage return /\r/ matches a carriage return

\s Matches a single character if it represents /\s/ matches the space in b c

white space (such as a space or a new line) /\s/ matches the tab in b c
/\s/ does not match bc
\S Matches a single character if it does not /\S/ matches d
represent white space /\S/ does not match a blank
space
\t Matches if there is a tab /\t/ matches the tab in b c
\v Matches if there is a vertical tab /\v/ matches a vertical tab
\w Matches any single character that is a letter, /\w/ matches 4
number, or underscore /\w/ does not match @
\W Matches any single character that is not a /\W/ matches @
letter, number, or underscore /\W/ does not match g
^ Matches only from the beginning of a line /^c/ matches c in corn
/^c/ does not match c in
acorn
$ Matches only at the end of the line /r$/ matches r in Car
/r$/ does not match t in Cat
* Matches the character preceding it if the /co*/ matches co or c
character occurs zero or more times /co*/ does not match pi
+ Matches the character preceding it if it occurs /co+/ matches co or cooooo
one or more times /co+/ does not match ca
? Matches the character preceding it if it occurs /o?l/ matches style or

zero or one time column
/co?l/ does not match cool
. Matches any individual character, excluding /.l/ matches al or @l
the newline character /.l/ does not match \nl or l
(x) By replacing x with characters, matches that /(a)/ matches a
sequence and keeps it in memory to be used /(cool)/ matches cool
later; used for grouping of expressions /(cool)/ does not match coal
| Used as a logical OR symbol to allow a /cool|bad/ matches cool
match of what is on the left of the symbol OR /cool|bad/ matches bad
what is on its right /cool|bad/ does not match
car
{x} Using a number to replace x, matches /n{1}/ matches n
when there are exactly x occurrences of the /nn{2}/ matches nnn
character preceding it /nn{1}/ does not match nnn
{x,} Using numbers to replace x and y, matches /n{1,2}/ matches n
when there are at least x occurrences of the /n{1,2}/ matches nn
character preceding it but no more than y /n{2,3}/ does not match n
occurrences of it /n{4,7}/ does not match nnn
[] Matches a character set of your choice; will /[abc]/ matches a
match when any one of the characters in /[abc]/ matches b
the brackets (such as [abc]) or any one of a /[abc]/ matches c
range of characters (such as [a-k]) is present /[a-k]/ matches j
/[a-k]/ does not match n

[^] Matches when the characters in your /[âbc]/ matches d

character set are not present; may be a set /[âbc]/ does not match b
(such as [abc]) or a range (such as [a-k]) /[â-k]/ matches n
/[â-k]/ does not match j
The replace() Method

ٖ‫ اق آ‬ٜ‫ اوشفبؼ‬ٝ‫یؽ) ٘فیم‬ٙ‫ و‬ٜ‫ ای اوشفبؼ‬ٝ‫ ؼـ ٌی ـٌش‬RegExp ٜ‫ٕفا‬ٟ‫ ث‬replace ‫ا٘یؽ اق ٔشؽ‬ٛ‫ٌٕب ٔی س‬
)‫ـر قیف ٔی ثبٌؽ‬ِٛ ٝ‫ث‬
varname= stringname.replace(regex,newstring);
)ٓ‫ی‬ٞ‫ اق ایٗ ٔشؽ ـا ٍ٘بٖ ٔی ؼ‬ٜ‫ اوشفبؼ‬ٜٛ‫ؼـ ٔثبَ قیف ٘ط‬
5,-(.4 َ‫ٔثب‬
var mystring= "I like the way a new car smells, and cars are
fun.";
var toreplace=/car/;
var newstring= mystring.replace(toreplace,"skunk");
window.alert(newstring);
)‫ؽ‬ٙ‫ْ ٔی و‬ٛ‫ ػ‬skunk ّٕٝ‫ؽ ـا ثب و‬ٙ‫ ثجی‬ّٕٝ‫ ؼـ خ‬ٝ‫ و‬car ّٕٝ‫ِیٗ و‬ٚ‫ ا‬replace ‫ؼـ ایٗ ٔثبَ ٔشؽ‬
5,-(/+ َ‫ٔثب‬
var mystring= "I like the way a new car smells, and cars are
fun.";
var toreplace=/car/g;
var newstring= mystring.replace(toreplace,"skunk");
window.alert(newstring);

ٓ‫ ای‬ٜ‫ وفؼ‬ٜ‫ آٖ اوشفبؼ‬ٜ‫ٕفا‬ٞ ٝ‫ ث‬RegExp g‫اق‬ ٝ‫ر و‬ٚ‫ؽ ٔثبَ لجُ ٔی ثبٌؽ ثب ایٗ سفب‬ٙ٘‫ٕب‬ٞ ‫ٔثبَ ثبال‬
)‫ؽ‬ٙ‫ْ ٔی و‬ٛ‫ ػ‬skunk ّٕٝ‫ؽ ـا ثب و‬ٙ‫ ثجی‬ّٕٝ‫ ؼـ خ‬ٝ‫ و‬car َ‫ ُز کلو‬replace ‫ ٔشؽ‬ٝ‫ؼـ٘شید‬
The match() Method
‫ؼ ٔشؽ آٖ ـا‬ٌٛ ‫ـؼ ٘ظف اوز) اٌف ایٗ ِغز دیؽا‬ٛٔ ّٕٝ‫بثك ثب و‬ٙٔ ّٕٝ‫ ایٗ ٔشؽ دیؽا وفؼٖ یه و‬ٝ‫ظیف‬ٚ
)‫( ـا ثفٔی ٌفؼا٘ؽ‬, ‫ـر ٔمؽاـ‬ّٛٙ‫ ؼـ غیف ای‬ٚ ‫ثفٔی ٌفؼا٘ؽ‬
5,-(/, َ‫ٔثب‬
var mystring = "I am Ironman!";

var tomatch = /Iron/;
if (mystring.match(tomatch)) {
window.alert("Your string contains Iron!");
}
else {
window.alert("Sorry, no Iron in your string.");
}
The search() Method
‫ؼ‬ٛ‫ غ‬ٝ٘ ‫ ایٗ ٔشؽ‬ٝ‫ ؼاـؼ) اِجش‬ٜ‫ؽ‬ٟ‫ ـا ثفػ‬ّٕٝ‫ـؼ ٘ظف ؼـ خ‬ٛٔ ‫ ثفٌفؼا٘ؽٖ ِغز‬ٚ ٖ‫ دیؽا وفؼ‬ٝ‫ظیف‬ٚ ‫ایٗ ٔشؽ‬
)‫ِیٗ ضفف آٖ ـا ثفٔی ٌفؼا٘ؽ‬ٚ‫لؼیز ػؽؼی ا‬ٛٔ ٝ‫ِغز ـا و‬
5,-(/- َ‫ٔثب‬
var mystring = "I am Ironman!";

var tomatch = /Iron/;
if (mystring.search(tomatch)) {
window.alert("Iron found at position
"+mystring.search(tomatch)+"!");
}
else {
window.alert("Sorry, no Iron in your string.");
}
5,-(/. َ‫ٔثب‬

‫ىز‬ٙ‫ اوىفیذز قیف ای‬ٝ‫ظیف‬ٚ )‫یؽ‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ ـا ٍٔب‬RegExp ٚ ‫ؽ ٔشؽ‬ٙ‫ اق ز‬ٜ‫ اوشفبؼ‬ٜٛ‫ؼـ ٔثبَ قیف ٘ط‬
)‫ؼ ؼاـؼ یب غیف‬ٛ‫خ‬ٚ ‫ـؼ ٘ظف ػؽؼی‬ٛٔ ٗ‫ؽ آیب ؼـ ٔش‬ٙ‫ ٍٔػُ و‬ٝ‫و‬
<body>
<form>
Enter some text: <input type="text" id="has_digits" />
<input type="button" id="t_btn" value="Test" />
</form>
var t_button = document.getElementById("t_btn");
t_button.onclick = function() {
var has_num = document.getElementById("has_digits").value;
var tomatch = /\d+/;
if (tomatch.test(has_num)) {
window.alert("Your entry contained one or more numbers!");
}
else {
window.alert("Your entry did not contain any numbers!");
}
}
</script>
</body>
‫اطالػات تیطتز‬
‫ یىی اق‬ٝ‫ٔیطبر ثیٍشف ث‬ٛ‫ا٘یؽ ثفای س‬ٛ‫ؼ ؼـ ایٗ ثػً ـا ٘بوبفی ٔی ؼا٘یؽ ٔی س‬ٛ‫خ‬ٛٔ ‫ٔیطبر‬ٛ‫ س‬ٝ‫ب٘س‬ٙ‫ز‬
)‫ ٕ٘بییؽ‬ٝ‫بی قیف ٔفاخؼ‬ٟ‫ثىبیش‬ٚ
● www.regular-expressions.info/
● www.regular-expressions.info/javascript.html (includes specifics on the JavaScript engine)
● https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide/Regular_Expressions


‫فصل سیشدّن ‪ :‬فزم در جاٍا اسکزیپت‬

‫فزم ّا‬
‫قٔب٘ی و‪ٌٕ ٝ‬ب ؼ‪ ٚ‬سً >‪ <form></form‬ـا ؼـ وؽ ‪ html‬غ‪ٛ‬ؼ ‪ٚ‬اـؼ ٔی و‪ٙ‬یؽ یه ٌی ففْ ایدبؼ‬
‫وفؼ‪ ٜ‬ایؽ ففْ ‪ٞ‬ب ٘مٍی ضیبسی ‪ ٚ‬اوبوی ؼـ اـسجبٖ وبـثف ثب ِفطبر ‪ٚ‬ة ایفب ٔی و‪ٙٙ‬ؽ) ؼـ ٘شید‪ٔ ٝ‬شؽ‪ٞ‬ب ‪ٚ‬‬
‫غبِیز ‪ٞ‬بی ففا‪ٚ‬ا٘ی ثفای وبـ ثب آ٘‪ٟ‬ب ؼـ خب‪ٚ‬ا اوىفیذز ففا‪ٌ ٓٞ‬ؽ‪ ٜ‬اوز)‬
‫دستزسی تِ فزم ّا‬
‫ثفای ؼوشفوی ث‪ ٝ‬ففْ ‪ٞ‬ب و‪ ٝ‬ـا دیً ـ‪ ٚ‬ؼاـیؽ‪5‬‬
‫‪ (,‬اوشفبؼ‪ ٜ‬اق ‪ٌ form array‬ی و‪ٙ‬ؽ)‬

‫‪ (-‬سػّیُ یه ٘بْ ث‪ ٝ‬ففْ ‪ ٚ‬اوشفبؼ‪ ٜ‬اق آٖ ٘بْ ثفای ؼوشفوی)‬
‫‪ (.‬اغشّبَ یه ‪ id‬ث‪ ٝ‬ففْ ‪ ٚ‬اوشفبؼ‪ ٜ‬اق ٔشؽ )(‪ document.getElementById‬ثفای ؼوشفوی ث‪ٝ‬‬
‫ففْ)‬
‫استفادُ اس ‪form array‬‬

‫آـای‪ ٝ‬ففْ ث‪ٌٕ ٝ‬ب ایٗ اخبق‪ ٜ‬ـا ٔی ؼ‪ٞ‬ؽ سب ثب ؼاؼٖ یه ای‪ٙ‬ؽوه ػؽؼی ث‪ ٝ‬ففْ ‪ٞ‬ب ؼوشفوی ؼاؼ‪ ٜ‬ثبٌیؽ) ؼـ‬
‫‪ٚ‬الغ ایٗ ای‪ٙ‬ؽوه ػؽؼی ٔىبٖ ػؽؼی ففْ ـا ٍ٘بٖ ٔی ؼ‪ٞ‬ؽ)‬
‫ٔثبَ ‪5,.(,‬‬
‫]‪document.forms[0‬‬
‫ث‪ ٝ‬ا‪ِٚ‬یٗ ففْ ؼـ ِفط‪ ٝ‬اٌبـ‪ٔ ٜ‬ی و‪ٙ‬ؽ)‬
‫٘ىش‪ٕٞ 5 ٝ‬ب٘‪ٛٙ‬ـ و‪ ٝ‬ؼـ ٔثبَ ثبال ٍٔب‪ٞ‬ؽ‪ٔ ٜ‬ی و‪ٙ‬یؽ ٌف‪ٚ‬ع آـای‪ ٝ‬اق ػؽؼ ِفف اوز ؼـ ٘شید‪ٔ ٝ‬ثال‬
‫]‪ document.forms[1‬ث‪ ٝ‬ؼ‪ٔٚ‬یٗ ففْ ٔ‪ٛ‬خ‪ٛ‬ؼ ؼـ ِفط‪ ٝ‬اٌبـ‪ٔ ٜ‬ی و‪ٙ‬ؽ)‬
‫‪length Property‬‬
‫ایٗ غبِیز سؼؽاؼ اخكای ٔ‪ٛ‬خ‪ٛ‬ؼ ؼـ یه ففْ ـا ثفٔی ٌفؼا٘ؽ)‬

5,.(- َ‫ٔثب‬
<body>
<form>
Name: <input type="text" /> <br />
E-mail: <input type="text" /> <br />
<input type="submit" value="Submit" />
</form>
<p>
document.write("The form has "+document.forms[0].length+"
elements.");
</script>
</p>
</body>
5 ٝ‫٘شیط‬
The form has 3 elements.
submit ٕٝ‫ یه ؼو‬ٚ ‫ی‬ٙ‫ؼی ٔش‬ٚ‫ـ‬ٚ ٚ‫ اوز ؼ‬ٝ‫ خكء لفاـ ٌففش‬ٝ‫قیفا ؼـ ففْ ٔثبَ ثبال و‬
5 ٝ‫٘ىش‬
)‫ ـا ثفٔی ٌفؼا٘ؽ‬ٝ‫بی ِفط‬ٞ ْ‫ؼ ؼـ سٕبْ فف‬ٛ‫خ‬ٛٔ ‫ سؼؽا اخكای‬5 document.forms.length
)‫ ـا ثفٔی ٌفؼا٘ؽ‬x ‫لؼیز‬ٛٔ ‫ ؼـ‬ٝ‫ؼ ؼـ ففْ لفاـ ٌففش‬ٛ‫خ‬ٛٔ ‫ سؼؽاؼ اخكای‬5 document.forms[x].length
5,.(. َ‫ٔثب‬
<body>
<h1>Form Lengths</h1>
<h2>Form 1</h2>
<form>
Name: <input type="text" /><br />
E-mail: <input type="text" /><br />
</form>
<h2>Form 2</h2>
<form>
Favorite Color: <input type="text" /><br />
Favorite Food: <input type="text" /><br />
<input type="reset" value="Reset" />
</form>
<h2>Results</h2>
for(var count=0;count<document.forms.length;count++) {
var formnum = count+1;
document.write("Form "+formnum+" has
"+document.forms[count].length);
document.write(" elements.<br />");
}
</script>
</body>
5ٝ‫٘شید‬
Form 1 has 3 elements.

Form 2 has 4 elements.
Form Names ‫استفادُ اس‬
ٖ‫ آ‬ّٝ‫وی‬ٚ ٝ‫ یه ٘بْ اغشّبَ ؼاؼ سب ثؼؽا ث‬ٝ‫ف ففْ ؼـ ِفط‬ٞ ٝ‫اٖ ث‬ٛ‫ لجُ سف ثیبٖ وفؼیٓ ٔی س‬ٝ‫ـ و‬ٛٙ٘‫ٕب‬ٞ
‫ ٌٕب ٘یبقی‬ٝ‫ ففْ ؼـ ایٗ اوز و‬ٝ‫ اق آـای‬ٜ‫ اوشفبؼ‬ٝ‫ ففْ ؼوشفوی دیؽا وفؼ )ٔكیز ایٗ أف ٘ىجز ث‬ٝ‫اٖ ث‬ٛ‫٘بْ ثش‬
)‫اـؼ ٕ٘بییؽ‬ٚ ْ‫یؽ ؼاٌز) ٌٕب ثبیؽ ایٗ ٘بْ ـا ؼـ سً فف‬ٞ‫ا‬ٛ‫ ٘ػ‬ٝ‫لؼیز ففْ ؼـ ِفط‬ٛٔ ‫ ؼا٘ىز‬ٝ‫ث‬
name=“yourname”
5,.(/ َ‫ٔثب‬
‫ ثب وٕه‬ٚ ْ‫ اق ایٗ ٘ب‬ٜ‫ ثؼؽ ثب اوشفبؼ‬ٚ ٓ‫ ای‬ٜ‫ ففْ اغشّبَ ؼاؼ‬ٝ‫ _ ث‬info_form_ ْ‫ؼـ ٔثبَ قیف یه ٘ب‬
)ٓ‫ ای‬ٜ‫ آٖ ؼوشفوی دیؽا وفؼ‬ٝ‫ ث‬length ‫غبِیز‬
<body>
<form name="info_form">
<input type="submit" />
</form>
<p>
document.write("The form has "+document.info_form.length+"
elements.");
</script>
</p>
</body>
5 ٝ‫٘شید‬
The form has 2 elements.
ID ‫استفادُ اس‬
ID ‫ ثب ؼاؼٖ یه‬ٝ‫ىز و‬ٙ‫ ؼاـؼ ای‬ٝ‫ ٔكیشی و‬ٚ ‫ ففْ اوز‬ٝ‫ؽ ؼاؼٖ یه ٘بْ ث‬ٙ٘‫ٕب‬ٞ ‫ ٘یك‬ID ‫ اق‬ٜ‫اوشفبؼ‬
)ٓ‫ی‬ٙ‫ب ـا اق یىؽیٍف ٔشٕبیك و‬ٟ٘‫ آ‬ٝ‫ف ففْ ؼـ ِفط‬ٞ ٝ‫ ففؼ ث‬ٝ‫طّف ث‬ٙٔ
5,.(0 َ‫ٔثب‬
<body>
<form id="info_form">
</form>
<p>
var f_length = document.getElementById("info_form").length;
document.write("The form has "+f_length+" elements.");
</script>
</p>
</body>

Properties
‫٘ؽ ؼـ‬ٌٛ ‫ة ٔی‬ٛ‫ب ٘یك ٌی ٔطى‬ٞ ْ‫ٖ فف‬ٛ‫ ز‬ٚ ‫بیی ٔی ثبٌؽ‬ٞ ‫ا اوىفیذز ؼاـای غبِیز‬ٚ‫ف ٌی ؼـ خب‬ٞ
)‫ ٔی ٕ٘بییؽ‬ٜ‫ؽ‬ٞ‫َ قیف ٍٔب‬ٚ‫ؽ) سؼؽاؼی اق غئبَ ٌی ففْ ـا ؼـ خؽ‬ٙ‫ی ٘یىش‬ٙ‫ ٔىشث‬ٜ‫ اق ایٗ لبػؽ‬ٝ‫٘شید‬
Property Value
action The value of the action attribute in the HTML form tag
An array that includes an array element for each form element in an
elements
HTML form
encoding The value of the enctype attribute, which varies with different browsers
length The value of the total number of elements in an HTML form
method The value of the method attribute in an HTML form tag
name The value of the name attribute in an HTML form tag
target The value of the target attribute in an HTML form tag
The action Property

‫ ثؼؽ اق خٕغ‬ٝ‫ؽ) وبـی و‬ٙٞ‫ـی ا٘الػبر اق وبـثف ا٘دبْ ٕ٘ی ؼ‬ٚ‫ خك خٕغ آ‬ٝ‫ؼ وبـی ث‬ٛ‫ؼی غ‬ٛ‫ غ‬ٝ‫ب ث‬ٞ ْ‫فف‬
‫ـر‬ِٛ ‫ـ‬ٚ‫ؼ ؼـ وف‬ٛ‫خ‬ٛٔ ‫بیی‬ٞ ‫ اوىفیذز‬ّٝ‫وی‬ٚ ٝ‫ ث‬ٝ‫ٕیز ؼاـؼ دفؼاقي ایٗ ا٘الػبر اوز و‬ٞ‫ـی ا٘الػبر ا‬ٚ‫آ‬
‫ لفاـ اوز ففْ ٌٕب ـا دفؼاقي‬ٝ‫ؽ و‬ٞ‫ ای ـا ٔی ؼ‬ٝ‫اـؼ وفؼٖ آؼـن ِفط‬ٚ ٜ‫ ٌٕب اخبق‬ٝ‫ٔی ٌیفؼ) ایٗ ٔشؽ ث‬
)‫ٕ٘بیؽ‬
5,.(1 َ‫ٔثب‬
<body>
<form name="info_form"
action="http://someplace.com/php/form.php">
</form>
<p>
document.write("The form goes to "+document.info_form.action);
</script>
</p>
</body>

‫)‪The elements Property (Array‬‬

‫یه ـ‪ٚ‬ي ؼوشفوی ث‪ ٝ‬اخكای ففْ ٔی ثبٌؽ) و‪ ٝ‬ایٗ ػُٕ ـا ثب اوشفبؼ‪ ٜ‬اق دبـٔشف‪ٞ‬بی ػؽؼی ‪ٔ ٚ‬ش‪ٙ‬بظف‬
‫وفؼٖ آ٘‪ٟ‬ب ثب ٔ‪ٛ‬لؼیز ػؽؼی ػ‪ٙ‬بِف ففْ ا٘دبْ ٔی ؼ‪ٞ‬ؽ)‬
‫ٔثبَ ‪5,.(2‬‬
‫>"‪<form name="info_form‬‬
‫>‪Name: <input type="text" /><br /‬‬
‫>‪<input type="submit" /‬‬
‫>‪</form‬‬
‫]‪ 5 document.info_form.elements[0‬ایٗ وؽ ثبػث ؼوشفوی ث‪ٚ ٝ‬ـ‪ٚ‬ؼی ٔش‪ٙ‬ی ٔی ٌ‪ٛ‬ؼ)‬
‫]‪ 5 document.info_form.elements[1‬ایٗ وؽ ثبػث ؼوشفوی ث‪ ٝ‬ؼوٕ‪ٔ submit ٝ‬ی ٌ‪ٛ‬ؼ)‬
‫ٌٕب ‪ٕٞ‬س‪ٙ‬یٗ ٔی س‪ٛ‬ا٘یؽ اق ‪٘ ID‬یك ثفای ؼوشفوی ث‪ ٝ‬اخكای آ٘‪ٟ‬ب وٕه ثٍیفیؽ)‬
‫ٔثبَ ‪5,.(3‬‬
‫>‪<form‬‬
‫>‪Name: <input type="text" id="yourname"><br /‬‬
‫>"‪<input type="submit‬‬
‫>‪</form‬‬
‫‪ID‬‬ ‫;)"‪ 5 document.getElementByID("yourname‬ؼوشفوی ث‪ ٝ‬سٕبْ اخكای آـای‪ ٝ‬ثب اوشفبؼ‪ ٜ‬اق‬

‫ففْ)‬
‫‪The checked Property‬‬

‫ثفای زه وفؼٖ ػالٔز قؼٖ* ٘كؼٖ ـاؼی‪ ٛ‬ؼوٕ‪ٞ ٝ‬ب_‪ _radio buttons‬ثىبـ ٔی ـ‪ٚ‬ؼ) ‪ ٚ‬یه ٔمؽاـ ث‪ِٛ‬یٗ‬
‫ـا ثفٔیٍفؼا٘ؽ و‪ٔ ٝ‬ی س‪ٛ‬اٖ اق ایٗ ٔمؽاـ ث‪ِٛ‬یٗ ثفای فؼبَ وفؼٖ یه اوىفیذز ؼیٍف اوشفبؼ‪ ٜ‬وفؼ)‬

5,.(4 َ‫ٔثب‬
<body>
<form>
Check box to say Yes: <input type="checkbox" id="yes_no">
<br /><br />
<input type="button" value= "See the Answer"
onclick="is_it_checked();" />
</form>
function is_it_checked() {
var y_n = document.getElementById("yes_no");
if (y_n.checked) {
window.alert("Yes! The box is checked!");
}
else {
window.alert("No, the box is not checked!");
}
}
</script>
</body>
ٝ‫یی ث‬ٛ‫ ـاؼی‬ٕٝ‫ی ثف ػالٔز قؼٖ * ٘كؼٖ ؼو‬ٙ‫ دیغبٔی ٔج‬See the Answer ٕٝ‫ی ؼو‬ٚ‫ثب وّیه وفؼٖ ـ‬
)‫ٕ٘بیً ؼـ ٔی آیؽ‬
)‫ ٔی ٕ٘بییؽ‬ٝ‫ئ‬ٞ‫فوؽاْ ـا ٍٔب‬ٞ ‫بی‬ٞ ‫یمٌی‬ٚ ٚ ‫ب‬ٞ‫ ٔشؽ‬ٜ‫ٕفا‬ٟ‫َ قیف اخكای یه ففْ ث‬ٚ‫ؼـ خؽ‬
Element Type Object Name Properties Methods

Button button form, name, type, value blur(), click(), focus()
Check box checkbox checked, defaultChecked, blur(), click(), focus()
form, name, type, value
Hidden field hidden form, name, type, value None
Radio button radio checked, defaultChecked, blur(), click(), focus()
form, name, type, value
Reset button reset form, name, type, value blur(), click(), focus()
Select box select form, name, options, blur(), focus()
selectedIndex, type
Submit button submit form, name, type, value blur(), click(), focus()
Text box text defaultValue, form, blur(), focus(),
name, type, value select()
Text area textarea defaultValue, form, blur(), focus(),
name, type, value select()
The defaultChecked Property

ْ‫ آٖ ٍٔػُ وفؼٖ ٔمؽاـ دیً فف‬ٝ‫ظیف‬ٚ ٚ )‫ِیٗ ـا ثفٔی ٌفؼا٘ؽ‬ٛ‫الغ ٔمبؼیف ث‬ٚ ‫ایٗ ٔشؽ ؼـ‬
)‫ب اوز‬ٞradiobutton ‫ یب‬checkbox
5,.(,+ َ‫ٔثب‬
<form>
Do you want us to send you e-mail updates and offers?<br />
Yes <input type="checkbox" id="yes" checked="checked" />
No <input type="checkbox" id="no" />
</form>
)‫ اوز‬ٜ‫ـؼ‬ٛ‫ـر دیً ففْ سیه غ‬ِٛ ٝ‫ ث‬ok ‫ؼـ ٔثبَ ثبال‬
The defaultValue Property
)‫ ٔی ثبٌؽ‬text area ٚ text box ٝ‫ ٔشؽ ثبال ؼاؼٖ ٔمؽاـ دیً ففْ ث‬ٝ‫ظیف‬ٚ
5,.(,, َ‫ٔثب‬
ٚ ‫ؽ‬ٙ‫ یب ٔمؽاـ آٖ ـا دبن و‬ٚ ‫ی سبیخ ٕ٘بیؽ‬ٙ‫ ٔش‬ٝ‫ؼ ـا ؼـ خؼج‬ٛ‫ـؼ ٘ظف غ‬ٛٔ ‫ؼـ ٔثبَ قیف اٌف وبـثف وبیز‬
‫ ایٗ أف‬ٝ‫ ث‬Reset Default ٕٝ‫ ٕ٘بیؽ ثب قؼٖ ؼو‬ٜ‫ؽ اق ٔمؽاـ دیً ففْ اوشفبؼ‬ٞ‫ا‬ٛ‫ف ؼِیّی ثػ‬ٞ ٝ‫ضبَ ث‬
)‫ؽ‬ٙ‫ؼوز دیؽا ٔی و‬
<body>
<form>
Favorite URL:<br />
<input type="text" id="favurl" value="http://www.yahoo.com">
<br /><br />
<input type="button" value="Reset Default"
onclick="back_to_default();">
</form>
function back_to_default() {
var url_box = document.getElementById("favurl");
url_box.value = url_box.defaultValue;
}
</script>
</body>
The form Property
ٖ‫ ففْ یب یىی اق اخكای آ‬ٝ‫ ثفای اـخبع ث‬this ‫ وّیؽی‬ّٕٝ‫ ٌٕب اق و‬ٝ‫ؽ و‬ٞ‫ایٗ ٔشؽ قٔب٘ی ـظ ٔی ؼ‬
‫ی ـا سغییف‬ٙ‫ ٔش‬ٝ‫یٓ ٔمؽاـ دیً ففْ یه خؼج‬ٞ‫ا‬ٛ‫ اٌف ثػ‬ٝ‫یؽ وفؼ و‬ٞ‫ا‬ٛ‫ غ‬ٜ‫ؽ‬ٞ‫ ٕ٘بییؽ)ؼـ ٔثبَ قیف ٍٔب‬ٜ‫اوشفبؼ‬
ٝ‫یٓ وذه ث‬ٙ‫ و‬ٜ‫ اٌبـ‬this ‫ وّیؽی‬ّٕٝ‫ اق و‬ٜ‫ ؼـ آٖ لفاـ ؼاـؼ ثب اوشفبؼ‬ٝ‫ خؼج‬ٝ‫ ففٔی و‬ٝ‫یٓ ثبیؽ اثشؽا ث‬ٞ‫ؼ‬
ٓ‫ی‬ٞ‫یٓ سغییف ؼ‬ٞ‫ا‬ٛ‫ ٔی غ‬ٝ‫ـؼ ٘ظف و‬ٛٔ ‫ ثؼؽ اق آٖ غبِیز‬ٚ textbox ْ‫ وذه ٘ب‬form ّٕٝ‫سفسیت اثشؽا و‬
)ٓ‫ی‬ٙ‫اـؼ و‬ٚ ‫بیز ٔمؽاـ خؽیؽ ـا‬ٟ٘ ‫ ؼـ‬ٚ value ‫ؽ‬ٙ٘‫ٔب‬
5,.(,- َ‫ٔثب‬
<form>
Favorite URL:<br />
<input type="text" name="favurl" value=http://www.yahoo.com />
<br /><br />
<input type="button" value="Change"
onclick="this.form.favurl.value='http://www.lycos.com';" />
</form>
The options Property (Array)

‫ؽوه‬ٙ‫ؽ) ػؽؼ ای‬ٙ‫ؽاـی ٔی و‬ٍٟ٘ ‫ ؼـ ففْ ـا‬option ‫بی خك‬ٞ ٝٙ‫ ٌكی‬ٝ‫ اوز و‬ٝ‫الغ یه آـای‬ٚ ‫ایٗ ٔشؽ ؼـ‬
)‫ؼ‬ٌٛ ‫ع ٔی‬ٚ‫ ِفف ٌف‬+ ‫ایٗ ٔشؽ اق‬
5,.(,. َ‫ٔثب‬
<body>
<form>
Fruits:
<select id="optlist">
<option selected="selected" value="orange">Orange</option>
<option value="apple">Apple</option>
<option value="pear">Pear</option>
</select>
</form>
<p>

var fbox = document.getElementById("optlist");
document.write("The second option is ");
document.write(fbox.options[1].value);
</script>
</body>
option ‫ز‬ِٕٙ‫ّف ا‬ٙ‫ٔیٗ ػ‬ٚ‫ ٔمؽاـ ؼ‬ٝ‫ ث‬fbox.options[1].value ‫ اق وؽ‬ٜ‫ؼـ ٔثبَ ثبال ثب اوشفبؼ‬
)ٓ‫ ای‬ٜ‫ؼوشفوی دیؽا وفؼ‬
The type Property
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ ؼـ ففْ اوشفبؼ‬ٝ‫ّف ثىبـ ـفش‬ٙ‫ع ػ‬ٛ٘ ٖ‫ثفای ٍٔػُ وفؼ‬
5,.(,/ َ‫ٔثب‬
type=“text”
type=“button”
The value Property
)‫ؽ‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ وبـثف ٍٔب‬ٝ‫ٕبٖ ٘بٔی اوز و‬ٞ ْ‫ؽ) ایٗ ٘ب‬ٞ‫ؼ ؼـ ففْ اغشّبَ ٔی ؼ‬ٛ‫خ‬ٛٔ ‫ّف‬ٙ‫ ػ‬ٝ‫یه ٘بْ ث‬
The focus() Method
)‫ؼ‬ٌٛ ‫ی یىی اق اخكای ففْ ٔشٕفوك‬ٚ‫ؽ وبـ ثف‬ٞ‫ا‬ٛ‫ وبـثف ثػ‬ٝ‫ؽ و‬ٞ‫ٍبٔی ـظ ٔی ؼ‬ٙٞ
5,.(,0 َ‫ٔثب‬
<body>
<form>
Your Favorite Food
<input type="text" id="fav_food" /><br />
Drink <input type="text" />
</form>

var f_box = document.getElementById("fav_food");

f_box.focus();
</script>
</body>
The blur() Method
)ْ‫ی اخكای فف‬ٚ‫ؽ سفن سٕفوك ثف ـ‬ٞ‫ػّٕی ثفػىه غبِیز ثبال ا٘دبْ ٔی ؼ‬
5,.(,1 َ‫ٔثب‬
<body>
<form>
Your Favorite Food
<input type="text" name="fav_food"
onblur="this.form.annoy.click();"
/><br />
<br /><br />
<input type="reset" name="annoy" value="Reset Form">
</form>
</body>
َٚ‫ی ا‬ٙ‫ ٔش‬ٝ‫ؼ ـا اق خؼج‬ٛ‫الغ سٕفوك غ‬ٚ ‫یؽ ؼـ‬ٙ‫ْ وّیه ٔی و‬ٚ‫ی ؼ‬ٙ‫ ٔش‬ٝ‫ی خؼج‬ٚ‫ ـ‬ٝ‫ٍبٔی و‬ٙٞ ‫ؼـ ٔثبَ ثبال‬
)‫ ٕ٘بیً ؼـ ٔی آیؽ‬ٝ‫ دیبٔی ثفای ٌٕب ث‬ٚ ‫٘ؽؼ‬ٛ‫ع ٔی دی‬ٛ‫ل‬ٚ ٝ‫ ٔشؽ ث‬ٝ‫ ؼـ ایٗ ِطظ‬ٚ ‫ ایؽ‬ٜ‫ْ ا٘شمبَ ؼاؼ‬ٚ‫ ؼ‬ٝ‫ث‬
The method Property
post ٚ get ‫ ٔمؽاـ‬ٚ‫ ؼاـای ؼ‬ٚ ‫ـ اوز‬ٚ‫ وف‬ٝ‫ اـوبَ ا٘الػبر ث‬ٝ‫ایٗ غبِیز ثفای ٍٔػُ وفؼٖ ٘فیم‬
)‫اوز‬
5,.(,2 َ‫ٔثب‬
<form name="f1" method="post" action= "http://site.com/cgi-

bin/form.cgi">

</form>

The name Property
)‫ؼ‬ٚ‫ ففْ ثىبـ ٔی ـ‬ٝ‫ثفای اغشّبَ ؼاؼٖ یه ٘بْ ث‬
5,.(,3 َ‫ٔثب‬
<form name="cool_form">
</form>
The target Property
5‫ ٌبُٔ ٔمبؼیف قیف ٔی ثبٌؽ‬ٚ)‫ؽ‬ٞ‫ـر ٘یبق ـا ٍ٘بٖ ٔی ؼ‬ِٛ ‫ خؽیؽ ؼـ‬ٜ‫دف‬ٙ‫ف ٌؽٖ د‬ٞ‫ایٗ غبِیز ٔطُ ظب‬
 blank
 new
 parent
 top
 self
)‫ ٕ٘بییؽ‬ٝ‫بِؼ‬ٙٔ ‫ ـا‬html ‫قي‬ٛٔ‫ٖ آ‬ٛ‫بِت ایٗ ثػً ٔش‬ٙٔ ٖ‫ؼ ثفای فٕیؽ‬ٌٛ ‫ ٔی‬ٝ‫ِی‬ٛ‫س‬
5,.(,4 َ‫ٔثب‬
<form name="cool_form" target="place" action="program.cgi">

</form>

Methods
The reset() Method

‫ب ـا ٘یك‬ٞ‫یؽاؼ‬ٚ‫ ـیىز وفؼٖ ـ‬ٜ‫ ٌٕب اخبق‬ٝ‫یٗ ث‬ٙ‫ٕس‬ٞ ‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫اق ایٗ ٔشؽ ثفای ـیىز وفؼٖ ففْ اوشفبؼ‬
)‫ؽ‬ٞ‫ٔی ؼ‬
5,.(-+ َ‫ٔثب‬
<body>
<form>
Your Favorite Food
<input type="text" name="fav_food" onblur="this.form.reset();"
/><br />
<br /><br />
<input type="reset" value="Reset Form" />
<input type="submit" value="Submit Form" />
</form>
</body>
The submit() Method

‫ ـا فٍبـ‬submit ‫ وبـثف وّیؽ‬ٝ‫ى‬ٙ‫ؽ فبـؽ اق ای‬ٞ‫ ٌٕب ٔی ؼ‬ٝ‫ وفؼٖ ففْ ـا ث‬submit ٜ‫ ٌٕب اخبق‬ٝ‫ایٗ ٔشؽ ث‬
)ٝ٘ ‫ؽ یب‬ٞ‫ؼ‬
5,.(-, َ‫ٔثب‬
<body>
<form action="http://site.com/php/form.php">
Your Favorite Food
<input type="text" name="fav_food"
onblur="this.form.submit();" /><br />
<br /><br />
<input type="submit" value="Submit Form" />

</form>
</body>
)‫ ا٘دبْ ٔی ٌیفؼ‬Submit ‫ی ػّٕیبر‬ٙ‫ ٔش‬ٝ‫ خؼج‬ٚ‫اـؼ وفؼٖ ا٘الػبر ؼـ ؼ‬ٚ ‫ؼـ ٔثبَ ثبال ثؼؽ اق‬
‫اطویٌاى اس قاتلیت دستزسی در فزم ّا‬
ُ‫استفادُ اس اجشا ٍ تزچسة ّای آهاد‬

‫ ا٘الػبر ـا ؼـ‬ٚ ٜ‫ؼ سب وبـثف ـاضز سف ثب ففْ اـسجبٖ ثفلفاـ وفؼ‬ٌٛ ‫ب ثبػث ٔی‬ٞ ‫ ثفزىت‬ٚ ‫ اق اثكاـ‬ٜ‫اوشفبؼ‬
) ‫ؽ‬ٙ‫اـؼ و‬ٚ ‫بوت‬ٙٔ ‫خبی‬
5,.(-- َ‫ٔثب‬
<input type="text" name="yourname" id="yourname" /> Name<br />

<input type="text" name="zip_code" id="zip_code" /> Zip
Code<br />
‫یب‬
Name <input type="text" name="yourname" id="yourname" /><br />

Zip Code <input type="text" name="zip_code" id="zip_code"
/><br />
Using <label></label> Tags
)‫ؼ‬ٌٛ ُ‫ اخكای ففْ ٍٔػ‬ٝ‫ب ث‬ٞ ‫اثىشٍی ثفزىت‬ٚ ‫ؼ سب‬ٌٛ ‫ ثبػث ٔی‬label‫بی‬ٞ ً‫ اق س‬ٜ‫اوشفبؼ‬
5,.(-. َ‫ٔثب‬
<label for="yourname">Name</label>
<input type="text" name="yourname" id="yourname" /><br />

Using <fieldset></fieldset> Tags
‫ یه‬ٝ‫بیی و‬ٞcheck box ٚ ‫ب‬ٞradio button ‫ ٌٕب ؼـ ایدبؼ‬ٝ‫ا٘ؽ ث‬ٛ‫ب ٔی س‬ٞfieldset ‫ اق‬ٜ‫اوشفبؼ‬
)‫ؽ‬ٞ‫ لفاـ ؼ‬ٜٚ‫ب ـا ؼـ یه ٌف‬ٟ٘‫ آ‬ٚ ‫ؽ‬ٙ‫ ٍٔػُ ؼاـ٘ؽ وٕه و‬ٝ‫ظیف‬ٚ
5,.(-/ َ‫ٔثب‬
<fieldset>
<legend>Select a Fruit:</legend>
<input type="radio" name="fruits" id="fruits1" value="Orange"
/>
<label for="fruits1">Orange</label>
<input type="radio" name="fruits" id="fruits2" value="Banana"
/>
<label for="fruits2">Banana</label>
<input type="radio" name="fruits" id="fruits3" value="Apple"
/>
<label for="fruits3">Apple</label>
</fieldset>


‫فصل چْاردّن ‪ :‬فزین در جاٍا اسکزیپت‬

‫فزین ّا در جاٍا اسکزیپت‬
‫یىی اق أىب٘بسی و‪ html ٝ‬ثفای ٘فاضبٖ ففا‪ ٓٞ‬آ‪ٚ‬ـؼ‪ ٜ‬اوز ای‪ٙ‬ىز و‪ٔ ٝ‬ی س‪ٛ‬ا٘یٓ ث‪ٚ ٝ‬ویّ‪ ٝ‬یىىفی‬
‫ػ‪ٙ‬بِف غبَ ث‪ٕ٘ ٝ‬بیً ز‪ٙ‬ؽیٗ ِفط‪ ٝ‬ؼـ یه د‪ٙ‬دف‪ٔ ٜ‬ف‪ٚ‬ـٌف ثذفؼاقیٓ' ؼـ اُِ ثب اوشفبؼ‪ ٜ‬اق ایٗ ػ‪ٙ‬بِف ٔی‬
‫س‪ٛ‬ا٘یٓ و‪ ٝ‬د‪ٙ‬سف‪ٔ ٜ‬ف‪ٚ‬ـٌف ـا ث‪ ٝ‬ز‪ٙ‬ؽ ثػً و‪ ٝ‬ث‪ٞ ٝ‬فوؽاْ یه ففیٓ (‪ٌ )frame‬فش‪ٔ ٝ‬ی ٌ‪ٛ‬ؼ سمىیٓ وفؼ ‪ ٚ‬ؼـ‬
‫‪ٞ‬ف لىٕز یه ِفط‪ ٝ‬ـا ٕ٘بیً ؼ‪ٞ‬یٓ)‬
‫ایٗ ثػً ٔفث‪ ٖٛ‬ث‪ٔ ٝ‬شؽ‪ٞ‬ب ‪ ٚ‬ـ‪ٚ‬ي ‪ٞ‬بیی اوز و‪ ٝ‬خب‪ٚ‬ااوىفیذز ثفای وبـ ثب ففیٓ ‪ٞ‬ب آٔبؼ‪ ٜ‬وفؼ‪ ٜ‬اوز و‪ٝ‬‬
‫ؼـ اؼأ‪ ٝ‬ث‪ٔ ٝ‬ؼففی آ٘‪ٟ‬ب غ‪ٛ‬ا‪ٞ‬یٓ دفؼاغز)‬
‫ثفای ٌف‪ٚ‬ع آٔ‪ٛ‬قي ؼـ اثشؽا ٘یبق اوز و‪ ٝ‬ؼ‪ِ ٚ‬فط‪ html ٝ‬ثب ٘بْ ‪ٞ‬بی ‪ٚ frame1.html‬‬
‫‪ frame2.html‬ایدبؼ ٕ٘‪ٛ‬ؼ‪ ٚ ٜ‬ؾغیف‪ٕ٘ ٜ‬بییؽ)‬
‫‪frame1.html‬‬
‫>‪<html‬‬
‫>‪<body‬‬
‫!‪I am frame1.html, and I am on the left side‬‬
‫>‪</body‬‬
‫>‪</html‬‬
‫>‪<html‬‬
‫>‪<body‬‬
‫!‪I am frame2.html, and I am on the right side‬‬
‫>‪</body‬‬
‫>‪</html‬‬

5ٓ‫ ففیٓ ایدبؼ ٔی ٕ٘بیی‬ٚ‫ ثب ؼ‬ٜ‫سف‬ٙ‫ اق وؽ قیف یه د‬ٜ‫ؼـ اثشؽا ثب اوشفبؼ‬
<html>
<frameset cols="20%,80%">
<frame src="frame1.html"></frame>
</frameset>
<noframes>
Sorry, your browser does not support frames. Use the link
below to go to the frameless version of the site.<br />
<a href="noframes.html">Frameless Site</a>
</noframes>
</html>
‫ـٌف ثىبـ ٔی‬ٚ‫ ٔف‬ٜ‫دف‬ٙ‫ ا٘ؽ ثفای سمىیٓ وفؼٖ د‬ٝ‫< ثىبـ ـفش‬frameset> ً‫ ؼـ س‬ٝ‫بیی و‬ٞ‫ ؼـ ِؽ‬5ٝ‫٘ىش‬
)‫ؽ‬ٙٞ‫ اغشّبَ ٔی ؼ‬- ٓ‫ ففی‬ٝ‫ ـا ث‬ٜ‫دف‬ٙ‫" فٕبی د‬3+ ٚ ,ٓ‫ ففی‬ٝ‫ ـا ث‬ٜ‫دف‬ٙ‫" د‬-+ ٝ‫ـر و‬ِٛ ٗ‫٘ؽ ثؽی‬ٚ‫ـ‬
)‫ ٕ٘بییؽ‬ٜ‫ ؾغیف‬ٌٝٛ‫ب ـا ؼـ د‬ٟ٘‫ آ‬ٚ ‫ ایدبؼ ٕ٘بییؽ‬html ٝ‫ ِفط‬ٝ‫ وؽ ثبال و‬ٝ‫ اق و‬ٜ‫ثب اوشفبؼ‬
Frame Options
‫ب‬ٞ ٓ‫ـر افمی ثفای ٕ٘بیً ففی‬ِٛ ٝ‫ ـا ث‬ٝ‫ا٘ؽ ِفط‬ٛ‫ ٔی س‬frameset ً‫یؽ س‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ ٍٔب‬ٝ‫ـ و‬ٛٙ٘‫ٕب‬ٞ
5 ‫ؽ ٔثبَ قیف‬ٙ٘‫ؽ ٔب‬ٙ‫سمىیٓ و‬
5,/(, َ‫ٔثب‬
<html>
<frameset rows="20%,80%">
</frameset>
<noframes>
Use the link below to go to the frameless version of the
site.<br />
</noframes>
</html>

‫ اي ثفای‬ٜ‫" ا٘ؽاق‬3+ ٚ ٓ‫ اي ثفای ٕ٘بیً یه ففی‬ٜ‫" ا٘ؽاق‬-+ ‫بیی ثفاثف ثب‬ٞ‫ف‬ٙ‫ و‬ٝ‫ ث‬ٝ‫ؼـ ٔثبَ ثبال ِفط‬
)‫ اوز‬ٜ‫ٕ٘بیً ؼیٍف ففیٓ سمىیٓ ٌؽ‬
‫ ففیٓ ؼیٍف‬ٝ‫ ث‬ٜ‫ ٔمؽاـ ثبلی ٔب٘ؽ‬ٝ‫ـی و‬ٛٙ‫یؽ ث‬ٙ‫ب ـا ٍٔػُ و‬ٞ ٜ‫دف‬ٙ‫ یىی اق د‬ٜ‫ فمٗ ا٘ؽاق‬ٝ‫یؽ و‬ٞ‫ا‬ٛ‫اٌف ثػ‬
.‫ا٘یؽ اق ػالٔز "*" استفادٍ ًواییذ‬ٛ‫اغشّبَ یبثؽ ٔی س‬
5,/(- َ‫ٔثب‬
<html>
<frameset rows="150,*">
</frameset>
<noframes>
site.<br />
</noframes>
</html>
)‫ؽ ٔثبَ قیف ػُٕ ٕ٘بییؽ‬ٙ٘‫ٕب‬ٞ ‫ا٘یؽ‬ٛ‫٘ی ٘یك ٔی س‬ٛ‫ـر وش‬ِٛ ٝ‫ب ث‬ٞ‫ف‬ٙ‫ثفای ٕ٘بیً و‬
‫ دیىىُ ثفای ففیٓ وٕز ـاوز ؼـ ٘ظف‬,0+ ٚ ‫ دیىىُ ثفای ففیٓ وٕز زخ‬,0+ ‫ؼـ ٔثبَ قیف ٔمؽاـ‬
)‫ی اغشّبَ ٔی یبثؽ‬ٙ‫و‬ٚ ٓ‫ ففی‬ٝ‫ ففیٓ ث‬ٚ‫ ثیٗ ؼ‬ٜ‫ ؼیٍف فٕبی ثبلی ٔب٘ؽ‬ٚ ‫ اوز‬ٜ‫ ٌؽ‬ٝ‫ٌففش‬
5,/(. َ‫ٔثب‬
<html>
<frameset cols="150,*,150">
</frameset>
<noframes>
site.<br />
‫>‪</noframes‬‬
‫>‪</html‬‬
‫ٔثبَ ‪5,/(/‬‬
‫ؼـ قیف ٘ط‪ ٜٛ‬سمىیٓ وفؼٖ ِفط‪ ٝ‬ث‪ ٝ‬ففیٓ ‪ٞ‬بی افمی ‪ ٚ‬ػٕ‪ٛ‬ؼی ث‪ٛ٘ ٝ‬ـ ‪ٕٞ‬كٔبٖ ـا ٍٔب‪ٞ‬ؽ‪ٔ ٜ‬ی ٕ٘بییؽ)‬
‫>"*‪<frameset rows="100,‬‬
‫>‪<frame src="frame1.html"></frame‬‬
‫>"*‪<frameset cols="150,‬‬
‫>‪</frameset‬‬
‫>‪<noframes‬‬
‫‪Use the link below to go to the frameless version of the‬‬
‫>‪site.<br /‬‬
‫>‪<a href="noframes.html">Frameless Site</a‬‬
‫ؼـ ٔثبَ ثبال ‪ ,++‬دیىىُ اق وُ فٕبی افمی ِفط‪ ٝ‬ث‪ ٝ‬ففیٓ ‪ ,‬اغشّبَ ٔی یبثؽ' وذه فٕبی ثبلی‬
‫ٔب٘ؽ‪ِ ٜ‬فط‪ٕ٘ ٝ‬بیً ثفای ٕ٘بیً ففیٓ ‪ٞ‬بی ػٕ‪ٛ‬ؼی اوشفبؼ‪ٔ ٜ‬ی ٌفؼؼ)‬
‫دستزسی تِ فزین ّا‬
‫آیب ٔی ؼا٘یؽ و‪ ٝ‬زٍ‪ٔ ٝ٘ٛ‬ی س‪ٛ‬اٖ ث‪ ٝ‬ففیٓ ‪ٞ‬ب ؼـ خب‪ٚ‬ا اوىفیذز ؼوشفوی دیؽا وفؼ؟ ؼـ اؼأ‪ ٝ‬ایٗ فُّ ث‪ٝ‬‬
‫ِ‪ٛ‬ـر ٔفُّ ث‪ ٝ‬ایٗ أف غ‪ٛ‬ا‪ٞ‬یٓ دفؼاغز)‬
‫‪The frames Array‬‬

‫ٌٕب ٔی س‪ٛ‬ا٘یؽ اق آـای‪ ٝ‬ففیٓ ثفای ؼوشفوی ث‪ ٝ‬ففیٓ ‪ٞ‬ب اوشفبؼ‪ٕ٘ ٜ‬بییؽ ‪ ٚ‬آٖ ‪ ٓٞ‬ثب اـوبَ دبـأشف‪ٞ‬بی‬
‫ػؽؼی و‪ٌ ٝ‬ف‪ٚ‬ع آ٘‪ٟ‬ب اق ِفف اوز)‬
‫ٔثبَ ‪5,/(0‬‬
<html>
</frameset>
<noframes>
site.<br />
</noframes>
</html>
)‫ ٕ٘بییؽ‬frame2.html ‫ثفای سىٕیُ ٌؽٖ ایٗ ٔثبَ ٌٕب ثبیؽ وؽ قیف ـا ؼـ‬
<body>
The first frame is from: <br />
document.write(top.frames[0].location);
</script>
</body>
ٖ‫ ؼـ آٖ ففیٓ وٕز ـاوز ٔىب‬ٝ‫ ٔی ٕ٘بییؽ و‬ٜ‫ؽ‬ٞ‫ ـا ٍٔب‬ٝ‫ اِّی ٘شید‬ٜ‫دف‬ٙ‫ضبَ ٌٕب ثب ثبق وفؼٖ د‬
)‫یىؽ‬ٛ٘ ‫ وبقی ففیٓ وٕز زخ ـا ٔی‬ٜ‫ؾغیف‬
5,/(1 َ‫ٔثب‬
<html>
</frameset>
<noframes>
site.<br />
</noframes>
</html>
)‫ ٕ٘بییؽ‬ٜ‫ ؾغیف‬frame1 ‫وؽ قیف ـا ؼـ‬

<html>
<body>
I am frame 1!
</body>
</html>
)‫ ٕ٘بییؽ‬ٜ‫ ؾغیف‬frame2 ‫وؽ قیف ـا ؼـ‬
<body>
for (var count=0; count<top.frames.length; count+=1) {
var framenum = count+1;
document.write("Frame "+framenum+" is from
"+top.frames[count].location);
}
</script>
</body>
5‫ ٕ٘بیً ؼـ ٔی آیؽ‬ٝ‫ ٔشٗ قیف ث‬, ٓ‫ اِّی ؼـ ففی‬ٜ‫دف‬ٙ‫ضبَ ثب ثبق وكؼٖ د‬
I am frame 1!
)- ٚ , ‫بی‬ٞ ٓ‫ وبقی ففی‬ٜ‫ ٔىبٖ ؾغیف‬- ٓ‫ ؼـ ففی‬ٚ
‫استفادُ اس ًام فزین ّا‬

ْ‫ ففیٓ ثب ٘ب‬ٚ‫ـ ٔثبَ ؼـ قیف ؼ‬ٛ٘ ٝ‫ب ٔی ثبٌؽ)ث‬ٟ٘‫ اق ٘بْ آ‬ٜ‫ب اوشفبؼ‬ٞ ٓ‫ ففی‬ٝ‫ ؼیٍف ثفای ؼوشفوی ث‬ٜ‫یه ـا‬
ٚ ٜ‫ب ؼوشفوی دیؽا وفؼ‬ٟ٘‫ آ‬ٝ‫ب ث‬ٟ٘‫ اق ٘بْ آ‬ٜ‫ ٔب ثب اوشفبؼ‬ٝ‫یؽ) و‬ٙ‫ ٔی و‬ٜ‫ؽ‬ٞ‫ ٍٔب‬right_side ٚ left_side ‫بی‬ٞ
)ٓ‫ی‬ٞ‫ٔىبٍ٘بٖ ـا ٕ٘بیً ٔی ؼ‬
5,/(2 َ‫ٔثب‬
5‫یؽ‬ٙ‫اـؼ و‬ٚ ‫بی قیف ـا‬ٞ‫ف وؽاْ اق ِفػبر وؽ‬ٞ ‫ ؼـ‬ٚ ‫ ایدبؼ ٕ٘بییؽ‬ٝ٘‫ خؽاٌب‬ٝ‫ ِفط‬ٝ‫و‬
main farme

<html>
<frame src="frame1.html" name="left_side"></frame>
<frame src="frame2.html" name="right_side"></frame>
</frameset>
<noframes>
site.<br />
</noframes>
</html>
frame1.html
<body>
The second (right) frame is from: <br />
document.write(top.right_side.location);
</script>
</body>
frame2.html
<body>
The first (left) frame is from: <br />
document.write(top.left_side.location);
</script>
</body>
‫ػَض کزدى فزین تکی‬
)ٓ‫ ٔی ٕ٘بیی‬ٜ‫ـ ٔثبَ اق وؽ قیف اوشفبؼ‬ٛ٘ ٝ‫ ث‬HTML ‫ْ وفؼٖ یه ففیٓ ؼـ‬ٛ‫ثفای ػ‬
<a href= "nextpage.html" target="right_side">Next Page</a>

‫ضبَ اٌف ثػ‪ٛ‬ا‪ٞ‬یٓ ایٗ ػُٕ ـا ثب اوشفبؼ‪ ٜ‬اق خب‪ٚ‬ااوىفیذز ا٘دبْ ؼ‪ٞ‬یٓ ثبیؽ اق ٘فیك وؽ‪ٞ‬بی قیف ث‪ ٝ‬آ٘‪ٟ‬ب‬
‫ؼوشفوی دیؽا وفؼ‪ ٜ‬وذه آ٘‪ٟ‬ب ـا ػ‪ ْٛ‬و‪ٙ‬یٓ)‬
‫ٔثبَ ‪5,/(3‬‬
‫ففْ و‪ٙ‬یؽ یه ِفط‪ ٝ‬خؽیؽ ث‪ ٝ‬اوٓ ‪ nextpage‬ایدبؼ وفؼ‪ ٜ‬ایٓ ‪ٔ ٚ‬ی غ‪ٛ‬ا‪ٞ‬یٓ آٖ ـا خبیٍكیٗ‬
‫‪ right_side‬ؼـ ٔثبَ لجُ ٕ٘بییٓ ثفای ایٗ ػُٕ ث‪ِٛ ٝ‬ـر قیف ػُٕ ٔی و‪ٙ‬یٓ)‬
‫;"‪top.right_side.location="nextpage.html‬‬
‫ضبَ ثفای سىٕیُ ػُٕ ٔی س‪ٛ‬ا٘یٓ ٔی س‪ٛ‬ا٘یٓ اق وؽ قیف وٕه ثٍیفیٓ‪5‬‬
‫;'‪<a href="n" onclick= "top.right_side.location='newpage.html‬‬

‫>";‪return false‬‬
‫>‪New Page</a‬‬
‫‪ ٚ‬یب‬
‫>"'‪<a href="javascript:top.right_side.location='newpage.html‬‬
‫>‪New Page</a‬‬
‫ػَض کزدى فزین ّای چٌذگاًِ‬
‫ثفای ػ‪ ْٛ‬ثیً اق یه ففیٓ ؼـ قٔبٖ ٌٕب ثبیؽ اق خب‪ٚ‬ا اوىفیذز اوشفبؼ‪ٕ٘ ٜ‬بییؽ)‬
‫ٔثبَ ‪5,/(4‬‬
‫اثشؽا یه فبیُ ثب ٘بْ ‪ html‬ایدبؼ ٕ٘بییؽ وذه وؽ قیف ـا ؼـ آٖ ‪ٚ‬اـؼ وفؼ‪ ٚ ٜ‬آٖ ـا ثب ٘بْ‬
‫‪ frameset4.html‬ؾغیف‪ٕ٘ ٜ‬بییؽ)‬
‫>‪<html‬‬
‫>"‪<frameset cols="20%,80%‬‬
‫>‪<frame src="frame1.html" name="left_side"></frame‬‬
‫>‪<frame src="frame2.html" name="right_side"></frame‬‬

</frameset>
<noframes>
site.<br />
</noframes>
</html>
ٖ‫اـؼ وفؼ‬ٚ ‫ ده اق‬ٚ ‫ ایدبؼ‬frame4.html ‫ سب‬frame1.html ‫بی‬ٞ ْ‫ ؼیٍف ثب ٘ب‬html ُ‫بـ فبی‬ٟ‫ضبَ ز‬
)‫ ٕ٘بییؽ‬ٜ‫ب ـا ؾغیف‬ٟ٘‫بی قیف آ‬ٞ‫وؽ‬
frame1.html
<body>
function twoframes() {
top.right_side.location="frame4.html";
self.location="frame3.html";
}
</script>
<a href="javascript:twoframes();">Change Both Frames</a>
</body>
frame2.html
<body>
I am frame 2!
</body>
frame3.html
<body>
I am frame 3!
</body>
frame4.html
<body>
‫!‪I am frame 4‬‬

‫>‪</body‬‬
‫ضبَ فبیُ ‪ frameset4.html‬ـا ثبق ٕ٘بییؽ ٍٔب‪ٞ‬ؽ‪ٔ ٜ‬ی ٕ٘بییؽ و‪ ٝ‬ثب وّیه ثف ـ‪ٚ‬ی ‪Change Both‬‬
‫‪ Frames‬ففیٓ ‪ٞ‬بی ‪ - ٚ ,‬ػ‪ٔ ْٛ‬ی ٌ‪٘ٛ‬ؽ ‪ ٚ‬ففیٓ ‪ٞ‬بی ‪ / ٚ .‬خبیٍكیٗ آ٘‪ٟ‬ب ٔی ٌ‪٘ٛ‬ؽ)‬
‫٘ىش‪ 5 ٝ‬س‪ٛ‬خ‪ٕ٘ ٝ‬بییؽ و‪ ٝ‬سٕبْ فبیُ ـا ثبیؽ ؼـ یه د‪ ٌٝٛ‬ؾغیف‪ٕ٘ ٜ‬بییؽ)‬
‫ایجاد یک جؼثِ اًتخاب تا فزین‬
‫اٌف ٌٕب ثػ‪ٛ‬ا‪ٞ‬یؽ و‪ ٝ‬یه خؼج‪ ٝ‬ا٘شػبة ثب اوشفبؼ‪ ٜ‬اق ففیٓ ‪ٞ‬ب ایدبؼ ٕ٘بییؽ ؼـ ٔ‪ٛ‬ـؼ ‪select box‬‬
‫‪ navigation‬ؼـ خب‪ٚ‬ا اوىفیذز ا٘الػبسی ؼاٌش‪ ٝ‬ثبٌیؽ)‬
‫ثفای آٌ‪ٙ‬بیی ثب ایٗ ٔجطث ٔثبَ قیف ـا ٔ‪ٙ‬فش ٔی ٕ٘بییٓ)‬
‫ٔثبَ ‪5,/(,+‬‬
‫ٔی غ‪ٛ‬ا‪ٞ‬یٓ یه د‪ٙ‬دف‪ٌ ٜ‬بُٔ ؼ‪ ٚ‬ففیٓ ایدبؼ ٕ٘بییٓ ث‪ٛٙ‬ـیى‪ ٝ‬ؼـ ففیٓ ثبال یه خؼج‪ ٝ‬ا٘شػبة ‪ٚ‬خ‪ٛ‬ؼ ؼاٌش‪ٝ‬‬
‫ثبٌؽ و‪ ٝ‬ثب ا٘شػبة ٌكی‪ٞ ٝٙ‬بی آٖ اػٕبَ ٔ‪ٙ‬بوجی ؼـ ففیٓ قیفیٗ ِ‪ٛ‬ـر دؿیفؼ)اق خّٕ‪ ٝ‬ػ‪ ْٛ‬وفؼٖ ففیٓ‬
‫قیفیٗ ثب ففیٓ ‪ٞ‬بی ؼیٍف)‬
‫‪ٕٞ‬ب٘‪ٙ‬ؽ ٔثبَ لجُ ایجشؽا فبیُ قیف ـا ایدبؼ ‪ ٚ‬ؾغیف‪ٕ٘ ٜ‬بییؽ)‬
‫‪frameset5.html‬‬
‫>‪<html‬‬
‫>"*‪<frameset rows="120,‬‬
‫>‪<frame src="frame1.html" name="t_frame"></frame‬‬
‫>‪<frame src="frame2.html" name="b_frame"></frame‬‬
‫>‪</html‬‬

frame1.html
<body>
<form onsubmit="return go_there();">
<label for="s1">Change the lower frame:</label>
<select id="s1">
<option selected="selected" value="#">Choose
Destination</option>
<option value="frame3.html">Frame 3</option>
<option value="frame4.html">Frame 4</option>
<option value="frame2.html">Back to Frame 2</option>
</select>
<input type="submit" id="submit" value="Go!" />
</form>
function go_there() {
s = document.getElementById("s1");
top.b_frame.location = s.options[s.selectedIndex].value;
return false;
}
</script>
</body>
frame2.html
<body>
I am frame 2!
</body>
frame3.html
<body>
I am frame 3!
</body>
frame4.html
<body>
I am frame 4!
</body>

‫ضبَ ثب اخفای ‪frameset5‬‬
‫یه خؼج‪ ٝ‬ا٘شػبة ؼـ ففیٓ ‪ ,‬ث‪ٕ٘ ٝ‬بیً ؼـ ٔی آیؽ و‪ ٝ‬ثب ا٘شػبة ٌكی‪ٞ ٝٙ‬بی آٖ ‪ ٚ‬فٍفؼٖ ؼوٕ‪Go! ٝ‬‬
‫سغییفار ؼـ ففیٓ ‪ -‬ایدبؼ ٔی ٌ‪٘ٛ‬ؽ)‬
‫هتغیزّای سزاسزی در فزین ّا‬
‫یىی اق ٔ‪ٛ‬اـؼ ٔفیؽ اوشفبؼ‪ ٜ‬اق ففیٓ ای‪ٙ‬ىز و‪ٌٕ ٝ‬ب ٔی س‪ٛ‬ا٘یؽ ٔشغیفی ـا ؼـ یه ففیٓ ؾغیف‪ ٜ‬وفؼ‪ ٚ ٜ‬ؼـ‬
‫ؼیٍف ففیٓ ‪ٞ‬ب ث‪ ٝ‬آٖ ؼوشفوی دیؽا ٕ٘بییؽ)ثفای ٔثبَ ٌٕب ٔی س‪ٛ‬ا٘یؽ ا٘الػبر یه ففْ ـا ؼـ یه ففیٓ ؾغیف‪ٜ‬‬
‫وفؼ‪ ٚ ٜ‬وذه آٖ ـا ؼـ ففیٓ ؼیٍفی ؼـ ‪ٍٙٞ‬بْ ِ‪ٛ‬ؼ ٌؽٖ ثبـٌكاـی ٕ٘بییؽ)‬
‫ٔثبَ ‪5,/(,,‬‬
‫او‪ٙ‬بؼ قیف ـا ٔفضّ‪ ٝ‬ث‪ٔ ٝ‬فضّ‪ ٝ‬ایدبؼ وفؼ‪ ٚ ٜ‬ؼـ یه ٔىبٖ ؾغیف‪ٕ٘ ٜ‬بییؽ)‬
‫‪frameset6.html‬‬
‫>‪<html‬‬
‫>"*‪<frameset cols="150,‬‬
‫>‪<frame src="frame1.html" name="left_side"></frame‬‬
‫>‪<frame src="frame2.html" name="right_side"></frame‬‬
‫>‪</html‬‬
‫ایٗ ففیٓ وز ‪ ,0+‬دیىىُ ثفای ففیٓ وٕز زخ ‪ ٚ‬ثمی‪ ٝ‬ا٘ؽاق‪ِ ٜ‬فط‪ٕ٘ ٝ‬بیٍٍف ـا ث‪ ٝ‬ففیٓ وٕز ـاوز‬
‫اغشّبَ ٔی ؼ‪ٞ‬ؽ)‬

<head>
var thename="";
var thefood="";
</script>
</head>
<body>
This is frame1.html; it holds the variable values.
You can put any content you like here.
</body>
)‫ ٔی ٌفؼ٘ؽ‬ٜ‫ ؾغیف‬ٚ ‫ٖ ٔمؽاـ ایدبؼ‬ٚ‫بیی ثؽ‬ٞ‫ ؼـ وٕز زخ لفاـ ٔی ٌیفؼ ٔشغییف‬ٝ‫ؼـ ایٗ ففیٓ و‬
frame2.html
<body>
I'd like to get your name. Please enter it below.
<br />
<form onsubmit="return store_info();">
<label for="yourname">Your Name:</label>
<input type="text" id="yourname" size="25" />
<br /><br />
<input type="submit" value="Continue" />
</form>
function store_info() {
var yn = document.getElementById("yourname").value;
top.left_side.thename= yn;
return false;
}
</script>
</body>
‫ ؼـ ٔشغیف‬ٚ ‫اـؼ ٕ٘بییؽ' ایٗ ٘بْ ؼـ ففیٓ وٕز زخ‬ٚ ْ‫ؼ سب یه ٘ب‬ٌٛ ‫اوز ٔی‬ٛ‫ؼـ ایٗ ففیٓ اق ٌٕب ؼـغ‬
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ ؾغیف‬thename

‫ اق‬ٜ‫ ثب اوشفبؼ‬ٚ ‫ وّیه ٕ٘بیؽ‬ٕٝ‫ی ؼو‬ٚ‫ وبـثف ـ‬ٝ‫ؼ و‬ٌٛ ‫ ٔی‬ٜ‫ قٔب٘ی ِؽاؼ قؼ‬store_info() ‫سبثغ‬
ٝ‫ ث‬top.left_side.thename ‫ اق‬ٜ‫ ثب اوشفبؼ‬ٚ)‫ؼ‬ٌٛ ‫ ففیٓ وٕز زخ ؼوشفوی دیؽا ٔی‬ٝ‫ ث‬top.left_side
)‫ؼ‬ٌٛ ‫ ٔی‬ٜ‫ ٘ىجز ؼاؼ‬thename ‫ٔشغیف‬
frame3.html
<body>
document.write("Hi, "+top.left_side.thename+"!<br />");
</script>
Now I'd like to get your favorite food. Please enter it below:
<br />
<form onsubmit="return more_info();">
<label for="yourname">Your Name:</label>
<input type="text" id="yourname" size="25" />
<br />
<label for="yourfood">Favorite Food:</label>
<input type="text" id="yourfood" size="25" />
<br /><br />
<input type="submit" value="Continue" />
</form>
var tn = document.getElementById("yourname");
tn.value = top.left_side.thename;
function more_info() {
var fd = document.getElementById("yourfood");
top.left_side.thefood= fd.value;
return false;
}
</script>
</body>
ٖ‫ ٘بْ ٌٕب ـا ٍ٘ب‬ٚ ‫ ٕ٘بیً ؼـ آیؽ‬ٝ‫ْ سب ث‬ٛ‫ثز ففیٓ و‬ٛ٘ ‫جبـ‬ٙ‫ ای‬ٝٔ‫ اؼا‬ٕٝ‫ قؼٖ ؼو‬ٚ ْ‫اـؼ وفؼٖ ٘ب‬ٚ ‫ثؼؽ اق‬
)‫ سبٖ ـا ٔی ٕ٘بیؽ‬ٝ‫ـؼ ػالل‬ٛٔ ‫اـؼ وفؼٖ غؿای‬ٚ ‫اوز‬ٛ‫ اق ٌٕب ؼـغ‬ٚ ٜ‫ؼاؼ‬
frame4.html
<body>
function print_info() {
document.write("Thank you, "+top.left_side.thename+"!");

document.write("<br /><br />");
document.write("You must really like
"+top.left_side.thefood+"!");
}
print_info();
</script>
</body>
ْ‫بـ‬ٟ‫ ففیٓ ز‬ٝ‫ب ث‬ٞ‫یؽ ٔمبؼیف ٔشغیف‬ٞ‫ْ فٍبـ ٔی ؼ‬ٛ‫ ـا ؼـ ففیٓ و‬ٝٔ‫ اؼا‬ٕٝ‫ ٌٕب ؼو‬ٝ‫ قٔبٖ و‬ٚ ‫ب‬ٟ‫ؼـ ا٘ش‬
)‫ؽ‬ٙ‫ ٕ٘بیً ؼـ ٔی آی‬ٝ‫ ؼـ آ٘دب ثفای ٌٕب ث‬ٚ ٜ‫شمُ ٌؽ‬ٙٔ
<body>
function print_info() {
document.write("Thank you, "+top.left_side.thename+"!");
document.write("<br /><br />");
document.write("You must really like
"+top.left_side.thefood+"!");
}
print_info();
</script>
</body>


‫سخي پایاًی‬
‫ؼـ ایٗ آٔ‪ٛ‬قي ففْ ثف ایٗ ٌؿاٌش‪ٌ ٝ‬ؽ و‪ٌٕ ٝ‬ب ٔی ؼا٘یؽ و‪ ٝ‬زٍ‪ ٝ٘ٛ‬خب‪ٚ‬ااوىفیذز ـا ثفای د‪ٛ‬یبسف ٌؽٖ‬
‫‪ ٚ‬خؿاة سف ٌؽٖ ‪ٚ‬ة وبیششبٖ ث‪ِ ٝ‬فطبر ‪ HTML‬غ‪ٛ‬ؼ أبف‪ ٝ‬و‪ٙ‬یؽ) ٌٕب یبؼ ٌففشیؽ زٍ‪ ٝ٘ٛ‬ث‪ٔ ٝ‬شؽ‪ٞ‬ب دبوع‬
‫ؼ‪ٞ‬یؽ‪ ،‬زٍ‪ ٝ٘ٛ‬ففْ ‪ٞ‬ب ـا اػشجبـو‪ٙ‬دی و‪ٙ‬یؽ ‪ ٚ‬زٍ‪ ٝ٘ٛ‬اوىفیذز ‪ٞ‬بی ٔػشّفی ثفای دبوع ث‪ ٝ‬و‪ٙ‬بـی‪ٞٛ‬بی ٔػشّف‬
‫ثىبقیؽ)‬
‫ایٗ آٔ‪ٛ‬قي ‪ٞ‬ب آٔ‪ٛ‬قي ثف٘بٔ‪ٛ٘ ٝ‬یىی ث‪ ٝ‬قثبٖ خب‪ٚ‬ااوىفیذز ث‪ٛ‬ؼ ‪ ٝ٘ ٚ‬آٔ‪ٛ‬قي سفف‪ٙ‬ؽ‪ٞ‬بی خب‪ٚ‬ااوىفیذز ‪ٚ‬‬
‫ثیٍشف ٔ‪ٙ‬بوت وىب٘ی اوز و‪ٔ ٝ‬ی غ‪ٛ‬ا‪ٙٞ‬ؽ ایٗ قثبٖ ـا ث‪ ٝ‬ػ‪ٛٙ‬اٖ یه قثبٖ ثف٘بٔ‪ٛ٘ ٝ‬یىی وٕز والی‪ٙ‬ز‬
‫ففاثٍیف٘ؽ ‪ ٝ٘ ٚ‬وىب٘ی و‪ ٝ‬ثػ‪ٛ‬ا‪ٙٞ‬ؽ لبِت ‪ٚ‬ثالي غ‪ٛ‬ؼ ـا ثب وؽ‪ٞ‬بی خب‪ٚ‬ااوىفیذز قیجب سف و‪ٙٙ‬ؽ) اِجش‪ ٝ‬ثب ایٗ‬
‫آٔ‪ٛ‬قي ‪ٞ‬ب ‪ ٚ‬سّفیك آٖ ‪ٞ‬ب ث‪ ٝ‬وبؼٌی سٕبْ ایٗ وبـ‪ٞ‬بیی و‪ ٝ‬ث‪ ٝ‬ػ‪ٛٙ‬اٖ وؽ‪ٞ‬بی خب‪ٚ‬ااوىفیذز ثفای ‪ٚ‬ثالي ‪ٞ‬ب‬
‫اـائ‪ٔ ٝ‬ی ٌ‪ٛ‬ؼ ـا ؼـ ِ‪ٛ‬ـسی و‪ ٝ‬وٕی ثب ػّٓ ثف٘بٔ‪ٛ٘ ٝ‬یىی آٌ‪ٙ‬ب ثبٌیؽ ا٘دبْ ؼ‪ٞ‬یؽ)‬
‫خَب حاال اس ایي تِ تعذ چِ کار تایذ کزد؟‬
‫ٌبْ ثؼؽی یبؼٌیفی ‪ AJAX ٚ jQuery ، HTML DOM‬اوز) اٌف ٔی غ‪ٛ‬ا‪ٞ‬یؽ یه قثبٖ وٕز‬
‫وف‪ٚ‬ـ ـا ففاثٍیفیؽ ‪ٌ ASP.NET ٚ PHP‬كی‪ٞ ٝٙ‬بی دیً ـ‪ٚ‬ی ٌٕبوز‬
‫‪HTML DOM‬‬

‫‪ HTML DOM‬اوشب٘ؽاـؼی ثفای ؼوشفوی ‪ ٚ‬وبـ وفؼٖ ‪ ٚ‬ایدبؼ سغییف ـ‪ٚ‬ی ػ‪ٙ‬بِف ‪ HTML‬اوز)‬
‫یه دّشففْ ‪ٔ ٚ‬ىشمُ اق قثبٖ ثف٘بٔ‪ٛ٘ ٝ‬یىی اوز و‪ٌٕ ٝ‬ب ٔی س‪ٛ‬ا٘یؽ ؼـ قثبٖ ‪ٞ‬بی ثف٘بٔ‪ٛ٘ ٝ‬یىی ٔػشّف اػٓ اق‬
‫‪ ))) ٚ VBScript ،JavaScript ،Java‬اق آٖ اوشفبؼ‪ ٜ‬و‪ٙ‬یؽ)‬
‫ضشٕبً ایٗ دّشففْ ـا ثیبٔ‪ٛ‬قیؽ قیفا و‪ ٝ‬ثىیبـ ث‪ ٝ‬خب‪ٚ‬ااوىفیذز ‪ ٚ‬خب‪ٚ‬ااوىفیذز ث‪ ٝ‬آٖ ‪ٚ‬اثىش‪ ٝ‬اوز ‪$‬غّ‪ِٛ‬بً‬
‫اق وٕز خب‪ٚ‬ااوىفیذز‪ٌ #‬بیؽ ثؼؽ اق خی وئفی ‪ ٚ‬یب ٌبیؽ ‪ٕٞ‬كٔبٖ ثب ‪ ٓٞ‬آٔ‪ٛ‬قي ایٗ ثػً ـا ‪ٌ ٓٞ‬ف‪ٚ‬ع‬
‫و‪ٙ‬یٓ)‬
‫‪jQuery‬‬
‫یه وشبثػب٘‪ ٝ‬خب‪ٚ‬ااوىفیذز اوز)‬
‫ثف٘بٔ‪ٛ٘ ٝ‬یىی ثب خب‪ٚ‬ااوىفیذز ـا ثىیبـ ثىیبـ وبؼ‪ٔ ٜ‬ی و‪ٙ‬ؽ)‬
‫‪AJAX‬‬
‫‪ AJAX = Asynchronous JavaScript and XML‬خب‪ٚ‬ااوىفیذز ‪٘ XML ٚ‬ب‪ٍٕٞ‬بْ‬
‫یه قثبٖ ثف٘بٔ‪ٛ٘ ٝ‬یىی ٘یىز ‪ِٚ‬ی ـا‪ٞ‬ی خؽیؽ ثفای اوشفبؼ‪ ٜ‬اق اوشب٘ؽاـ‪ٞ‬بی ٔ‪ٛ‬خ‪ٛ‬ؼ اوز)‬
‫ؼـثبـ‪ ٜ‬خبثدب وفؼٖ ؼاؼ‪ٞ ٜ‬ب ثب یه وف‪ٚ‬ـ ‪ ٚ‬ث‪ ٝ‬ـ‪ٚ‬قـوب٘ی ثػٍی اق ِفط‪ ٝ‬ثؽ‪ ٖٚ‬ثبـٌكاـی ٔدؽؼ ِفط‪ٝ‬‬
‫اوز)‬
‫ٔثبَ ‪ٞ‬بیی اق آلاوه ٔثبَ ٌ‪ٔ ٌُٛ‬خ‪ ،‬خیٕیُ‪ ،‬ی‪ٛ‬سی‪ٛ‬ة ‪ ٚ‬ست ‪ٞ‬بی فیه ث‪ٛ‬ن اوز)‬
‫‪ASP.NET / PHP‬‬

‫‪ٕٞ‬ب٘‪ٛٙ‬ـ و‪ ٝ‬یه فبیُ ‪ HTML‬ؼـ وٕز والیٗ ‪$‬ؼـ ؼاغُ ٔف‪ٚ‬ـٌف‪ #‬اخفا ٔی ٌ‪ٛ‬ؼ یه فبیُ‬
‫‪ ASP.NET/PHP‬ؼـ وٕز وف‪ٚ‬ـ اخفا ٔی ٌ‪ٛ‬ؼ)‬
‫ثب اوشفبؼ‪ ٜ‬اق ایٗ قثبٖ ‪ٞ‬ب ٌٕب ٔی س‪ٛ‬ا٘یؽ ث‪ِٛ ٝ‬ـر د‪ٛ‬یب ‪ٞ‬ف ٔطش‪ٛ‬ایی ـا ث‪ٚ ٝ‬ة وبیششبٖ أبف‪ ،ٝ‬اق آٖ وٓ ‪ٚ‬‬
‫یب آٖ ـا ‪ٚ‬یفایً و‪ٙ‬یؽ) ٔی س‪ٛ‬ا٘یؽ اق ؼیشبثیه ‪ٞ‬ب ثفای ؾغیف‪ ٜ‬ا٘الػبر اوشفبؼ‪ٕ٘ ٜ‬بییؽ)‬
‫به زودی‪...‬‬

2

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

2

Uploaded by

Copyright:

Available Formats

Hadi Ahmadi Learning Java Script

‫از تمام عسیساوی کٍ با اوتقادَا ي راَىمایی َای خًد‬

‫محرکی برای وًشته يیرایش ديم شدود‪.‬‬

‫استفادٌ از ایه مىبع با ذکر صلًات بر‬

‫ایي کتاب را تِ صَرت رایگاى دریافت کٌیذ‪ .‬‬

‫تِ صَرت رایگاى تا دٍستاًتاى تِ اضتزاك تگذاریذ‪.‬‬

‫راي داًلَد در سایت‪ٍ/‬تالگ خَد قزار دّیذ ‪ .‬‬

‫ضوا اجاسُ ًذاریذ‪:‬‬

‫هطالة ایي کتاب را تِ اسن خَد کپی ٍ هٌتطز کٌیذ ‪ .‬‬

‫اس ایي کتاب استفادُ تجاري کٌیذ‪ .‬‬

‫در هحتَاي ایي کتاب دست تثزیذ‪ .‬‬

‫سدى ایي هٌثغ کاری تِ دٍر اس ػذل ٍ اًصاف خَاّذ تَد‪.‬‬

‫ٍیژگی ّای ٍیزایص دٍم‬

‫‪ ‬تزطزف کزدى اضتثاّات اهالیی ٍ ًگارضی ٍیزایص اٍل‪.‬‬

‫صفحَ‬ ‫فِزست هطالب‬

‫‪2‬‬ ‫فصل اّل ‪ :‬شزّع کار با جاّ اسکزیپت‬

‫‪3‬‬ ‫آشٌایی با جاّا اسکزیپت ّ هفِْم اسکزیپت ًْیسی‬

‫‪11‬‬ ‫فصل دّم ‪ :‬هتغیزُا در جاّا اسکزیپت‬

‫‪12‬‬ ‫آشٌایی با هفاُین هتغییز ُا ّدادٍ‬

‫‪12‬‬ ‫تبذیل بَ عذد‬

‫‪22‬‬ ‫فصل سْم ‪ :‬تْابغ‬

‫‪22‬‬ ‫استفادٍ اس تْابغ در جاّا اسکزیپت‬

‫‪32‬‬ ‫فصل چِارم‪ :‬ػولگزُا‬

‫‪33‬‬ ‫هؼزفی ػولگزُای هْرد استفادٍ در ‪JAVASCRIPT‬‬

‫‪22‬‬ ‫فصل پٌجن‪ :‬حلقَ ُا‬

‫‪22‬‬ ‫هؼزفی دستْر شزطی ‪ ّ IF...ELSE‬کاربزدُای هختلف آى‬

‫‪23‬‬ ‫فصل ششن ‪ :‬رّیذادُا‬

73 ‫ اشیا‬: ‫فصل ُفتن‬

72 ‫بزًاهَ ًْیسی شیءگزا‬

17 DOM : ‫فصل ُشتن‬

11 DOM‫هذل شی گزاي سٌذ ؛‬

129 ٍ‫ اشیاء پٌجز‬: ‫فصل ًِن‬

211 THE CLOSED PROPERTY

131 َ‫ آرای‬: ‫فصل دُن‬

131 َ‫ًاهگذاری یک آرای‬

245 THE CONCAT() METHOD

127 ‫اشیاء ریاضی‬: ‫فصل یاسدُن‬

171 ‫ رشتَ ُای هتٌی‬: ‫فصل دّاسدُن‬

171 THE STRING OBJECT

282 THE LENGTH PROPERTY

291 ‫ فزم در جاّا اسکزیپت‬: ‫فصل سیشدُن‬

291 ‫دستزسی بَ فزم ُا‬

213 THE ACTION PROPERTY

222 ‫ فزین در جاّا اسکزیپت‬: ‫فصل چِاردُن‬

227 FRAME OPTIONS

‫‪1‬‬ ‫دَلران پی سی‬

‫فصل اٍل ‪ :‬ضزٍع کار تا جاٍ اسکزیپت‬

‫‪2‬‬ ‫دَلران پی سی‬

‫آضٌایی تا جاٍا اسکزیپت ٍ هفَْم اسکزیپت ًَیسی‬

‫آضٌایی تا چگًَگی استفادُ اس فزاهیي جاٍا اسکزیپت‬

‫‪ٚ‬اـؼ وفؼٖ وؽ‪ٞ‬بی خب‪ٚ‬ا اوىفیذز ؼـ لىٕز <‪ِ <head‬فط‪ٝ‬‬ ‫‪(,‬‬

‫‪ٚ‬اـؼ وفؼٖ وؽ‪ٞ‬بی خب‪ٚ‬ا اوىفیذز ؼـ ثػً <‪ِ <body‬فط‪ٝ‬‬ ‫‪(-‬‬

‫اوشفبؼ‪ ٜ‬اق وؽ‪ٞ‬بی خب‪ٚ‬ا اوىفیذز ٔ‪ٛ‬خ‪ٛ‬ؼ ؼـ ی‪ ٝ‬فبیُ غبـخی‬ ‫‪(.‬‬

‫ٍارد کزدى کذّای جاٍا اسکزیپت در قسوت <‪ >head‬صفحِ‬

‫‪3‬‬ ‫دَلران پی سی‬

ِ‫> صفح‬body< ‫ٍارد کزدى کذّای جاٍا اسکزیپت در تخص‬

‫استفادُ اس کذّای جاٍا اسکزیپت هَجَد در یِ فایل خارجی‬

‫‪5‬‬ ‫دَلران پی سی‬

‫٘ىبر ٔ‪ ٟٓ‬ؼـ ٘‪ٌٛ‬شٗ وؽ‪ٞ‬بی خب‪ٚ‬ا اوىفیذز‬

‫‪ (,‬خب‪ٚ‬ا اوىفیذز ث‪ ٝ‬ثكـٌی ‪ ٚ‬و‪ٛ‬زىی ضف‪ٚ‬ف ضىبن اوز‬

‫ثفای ؼـج س‪ٔٛ‬یطبر یه غ‪ٙ‬ی اق** ؼـ اثشؽای آٖ غٗ‬ ‫‪(.‬‬

‫تَضیحات جاٍا اسکزیپت‬

‫س‪ٔٛ‬یطبر یه غ‪ٙ‬ی ثب ** ٌف‪ٚ‬ع ٔی ٌ‪٘ٛ‬ؽ )‬

‫‪7‬‬ ‫دَلران پی سی‬