Java Script 2
Java Script 2
أوﻻ ﻫــﻲ ﻟﻴﺴــﺖ ﺟﺎﻓــﺎ ،ﻓﺎﻟﺠﺎﻓــﺎ ﻫــﻲ ﻟﻐــﺔ ﺑﺮﻣﺠــﺔ ﺻــﻤﻤﺖ ﺑﻮاﺳــﻄﺔ ﺷــﺮﻛﺔ ﺻــﻦ Sun
Microsystemsأﻣﺎ اﻟﺠﺎﻓﺎ ﺳﻜﺮﻳﺒﺖ ﻓﻘﺪ ﺻﻤﻤﺖ ﺑﻮاﺳﻄﺔ اﻟﺸﺮﻛﺔ اﻟﻤﻨﺘﺠﺔ ﻟﻤﺘﺼﻔﺢ ﻧﻴﺘﺴﻜﻴﺐ
.Netscape
ﻟﺬا ﻓﺎﻟﺠﺎﻓﺎ واﻟﺠﺎﻓﺎ ﺳـﻜﺮﻳﺒﺖ ﻟﻴﺴـﺎ ﻧﻔـﺲ اﻟﺸـﻴﻲء .اﻟﺒﺮﻧـﺎﻣﺞ اﻟـﺬي ﻳـﺘﻢ ﺗﺼـﻤﻴﻤﻪ ﺑﺈﺳـﺘﺨﺪام
اﻟﺠﺎﻓﺎ ﻫﻮ ﺑﺮﻧﺎﻣﺞ ﻗﺎﺋﻢ ﺑﺬاﺗﻪ أﻣﺎ ﺑﺮاﻣﺞ اﻟﺠﺎﻓﺎ ﺳﻜﺮﻳﺒﺖ ﻏﻴﺮ ﻗﺎﺋﻤﺔ ﺑـﺬاﺗﻬﺎ ﺣﻴـﺚ أﻧﻬـﺎ ﻻ ﺗﻌﻤـﻞ إﻻ
ﻣﻦ داﺧﻞ ﺻﻔﺤﺔ اﻟﻮﻳﺐ .وﺻﻔﺤﺔ اﻟﻮﻳﺐ اﻟﺘﻲ ﺗﺤﺘﻮي ﻋﻠﻲ ﺟﺎﻓﺎ ﺳﻜﺮﻳﺒﺖ ﻻ ﺑﺪ أن ﻳﺘﻢ ﺗﺼـﻔﺤﻬﺎ
ﻣﻦ ﺧﻼل ﻣﺘﺼﻔﺢ ﻳﻔﻬﻢ ﻟﻐﺔ اﻟﺠﺎﻓﺎ ﺳﻜﺮﻳﺒﺖ ،واﻵن ﻛﻞ اﻟﻤﺘﺼﻔﺤﺎت اﻟﺤﺪﻳﺜﺔ ﺗﺪﻋﻢ ﻫﺬه اﻟﻠﻐﺔ .
ﻟﻐﺔ اﻟﺠﺎﻓﺎ ﺳﻜﺮﻳﺒﺖ ﺗﺴﺘﺨﺪم أﺳـﻠﻮب اﻟﺒﺮﻣﺠـﺔ ﺑﺎﻟﻜﺎﺋﻨـﺎت )(Object Oriented Programming
أي oopواﻟﺬي ﻳﺴﻤﺢ ﺑﺎﻟﺘﻌﺎﻣﻞ ﻣﻊ اﻟﺒﻴﺎﻧﺎت ﻋﻠﻲ ﺷﻜﻞ ﻛﺎﺋﻨـﺎت ) (Objectsﻣﺜـﻞ documentو
windowوﻟﻜﻞ ﻛﺎﺋﻦ ﻣﻨﺎﻫﺞ ) (Methodsوﺧﺼﺎﺋﺺ ) (Propertiesﺧﺎﺻﺔ ﺑـﻪ .و ﻣـﻦ ﻋﻨـﺪه ﻓﻜـﺮة
ﺑﻠﻐﺎت اﻟﺒﺮﻣﺠﺔ ﻳﻜﻮن ﻋﺎرف ﺑﺘﻠﻚ اﻟﻤﺼﻄﻠﺤﺎت .
www.Arab-Team.com
javascript
أﺧﻲ اﻟﻜﺮﻳﻢ ﻗﺒﻞ أن ﺗﻘﺮا اﻟﺪورة ﻳﺠﺐ ﻋﻠﻴﻚ ﻓﻬﻢ ﻣﺎﻳﻠﻲ :
ﺗﺤﺘﺎج أﺧﻲ ﻟﺘﻌﻠﻢ ﻫﺬه اﻟﻠﻐﺔ إﻟﻰ ﻣﻌﺮﻓﺔ اﻟـــ htmlوﻟﻜﻦ ﺳﺘﺠﺪ ﺻﻌﻮﺑﺔ إن ﻟﻢ ﺗﻌﺮف ﻟﻐﺔ ﺑﺮﻣﺠـﺔ
ﻗﺒﻠﻬﺎ ﻣﺜﻞ c & java & vb & pascalوﻳﻔﻀﻞ أن ﺗﻜﻮن ﺗﻌﺮف cأو pascalﻷﻧﻪ ﻗﺮﻳﺒﺔ ﻣﻦ اﻟﺘﺮﻛﺒﻴـﺔ
اﻟﻨﺤﻮﻳﺔ ل .. javascript
ﻋﻠﻰ ﻛﻞ ﺣﺎل وإن ﻛﻨﺖ ﻣﻦ ﻣﺒﺮﻣﺠﻲ اﻟﻔﻴﺠﻮال ﺑﻴﺰك ﻳﻤﻜﻨـﻚ ﺑﺴـﻬﻮﻟﺔ ﻣﺠـﺎراة ﻫـﺬه اﻟﻠﻐـﺔ ﻓـﻲ
اﻟﺘﻌﻠﻢ ....
ﻣﻊ أﻧﻪ ﺗﻌﻠﻤﻚ ﻟﻐﺔ vscriptﺳﻴﻜﻮن أﺳﻬﻞ وﻟﻜﻦ ﺟﺮب أن ﺗﺘﻌﻠﻢ ﻫﺬه وﻟﻦ ﺗﻨﺪم ﻷﻧﻬـﺎ أﻗـﻮى ﻣـﻦ
اﻟـــ vbscriptﺑﻜﺜﻴﺮ ...
اﻟﺠﺎﻓﺎ ﺳﻜﺮﻳﺒﺖ ﺗﻜﺘﺐ داﺧﻞ ﻣﺴﺘﻨﺪ ال HTMLإﻣﺎ ﻓﻲ اﻟﺮأس ) (headأو ﻓـﻲ اﻟﺠﺴـﻢ )(body
ﺣﻴﺚ ﻳﺘﻢ ﺣﻔﻈﻬﺎ ﻛﻨﺺ ﻣﺪﻣﺞ داﺧﻞ ﻣﺴﺘﻨﺪ ال HTML .
ﻻ أرﻳﺪ أن أﻃﻴﻞ ﻋﻠﻴﻜﻢ و أﻛﺘﻔﻲ ﺑﻬﺬه اﻟﻤﻘﺪﻣﺔ وﺳﻨﺒﺪأ ﺑﺎﻟﺪروس ﻣـﻦ اﻟﻐـﺪ إن ﺷـﺎء اﷲ ﺗﻌـﺎﻟﻰ،
وأرﻳﺪ ﺑﺈذن اﷲ ﺗﻌﺎﻟﻰ أن أﻋﻤﻞ ﺣﺮﻛﺔ ﺟﺪﻳﺪة ﻓﻲ ﻫﺬه اﻟـﺪورة أن أﺿـﻊ اﻟﻌﺪﻳـﺪ ﻣـﻦ اﻟﻤﺼـﻄﻠﺤﺎت
اﻟﺘﻲ ﺗﻬﻢ ﻟﻐﺎت اﻟﺒﺮﻣﺠﺔ واﻟﺤﺎﺳﻮب ﻓﻲ ﻧﻬﺎﻳﺔ ﻛﻞ درس ﺣﺘـﻰ ﻧﺮﻓـﻊ ﻣـﻦ ﻣﺴـﺘﻮى اﻟـﺪورة إﻟـﻰ
أﻋﻠﻰ ﻣﺴﺘﻮى ﻣﻄﻠﻮب...
وﻟﻜﻲ ﻳﺘﻨﺴﻰ ﻟﻠﺬي ﻟﻐﺘﻪ ﺿـﻌﻴﻔﺔ ﻓـﻲ ﻣﺼـﻄﻄﻠﺤﺎت اﻟﺤﺎﺳـﺐ اﻟﻮﺑﺮﻣﺠـﺔ أن ﻳﻘـﻮي ﻣـﻦ ﻟﻐﺘﻌـﻪ
ﺑﺪون أن ﻳﺸﻌﺮ...
وﻻ ﺗﻨﺴﻮا أن اﺳﻤﻬﺎ دورس وﻟﻴﺴﺖ ﻣﺠﻤﻮﻋﺔ دروس ﻳﻨﻲ ﻓﻴﻬﺎ اﻟﺘﺤﺎور وإﺑﺪاء اﻟﺮأي وأﺻﺤﺢ ﻟﻜﻢ
وﺗﺼﺤﺤﻮن ﻟﻲ ﻳﻌﻨﻲ ﻛﺄﻧﻬﺎ دورة ﻓﻲ ﻣﻌﻬﺪ وأﻓﻀﻞ إن ﺷﺎء اﷲ ...
ﻻﺗﻨﺴﻮﻧﻲ ﻣﻦ دﻋﻮة ﺻﺎﻟﺤﺔ ﻓﻲ ﻇﻬﺮ اﻟﻐﻴﺐ ﺗﻜﻮن ﻟﻲ ﺳﻨﺪاً ﻓﻲ أن أﺣﻀﺮ ﺑﻘﻴﺔ اﻟﺪروس ..
www.Arab-Team.com
اﻟﻤﺼﻄﻠﺤﺎت اﻟﺠﺪﻳﺪة
Introduction
ﺗﻌﻨﻲ ﻣﻘﺪﻣﺔ وﺗﻜﻮن ﻋﺎدة ﻓﻲ أول اﻟﻜﺘﺐ ﻣـﺜﻼ ﻛﻤـﺎ ﻻﺣﻈـﺘﻢ اﺳـﺘﺨﺪﻣﺘﻬﺎ ﻓـﻲ أول اﻟـﺪورة ﻓـﻲ
اﻷﻋﻠﻰ ...
Overwiew
ﻛﺬﻟﻚ اﻷﻣﺮ ﺑﺎﻟﻨﺴﺒﺔ ﻟﻬﺬه اﻟﻜﻠﻤﺔ ﻓﻬـﻲ ﺗﺴـﺘﺨﺪم ﻓـﻲ ﺑﺪاﻳـﺔ اﻟﻜﺘـﺐ وﻣﻌﻨﺎﻫـﺎ ﺗﻤﻬﻴـﺪ أو ﻟﻤﺤـﺔ
ﺳﺮﻳﻌﺔ ﻛﻤﺎ اﺗﺴﺨﺘﺪﻣﺘﻬﺎ أﻧﺎ ﻫﻨﺎ......
www.Arab-Team.com
اﻟﺪرس اﻟﺜﺎﻧﻲ
<script >"LANGUAGE="javascript
ﻫﻨﺎ ﻛﻮد اﳉﺎﻓﺎ ﺳﻜﺮﺑﺖ
></SCRIPT
<script >"LANGUAGE="javascript
)"document.write("WElcome in my site
></SCRIPT
ﺛﻢ اﺣﻔﻆ اﻟﻤﻠﻒ ﺑﻼﺣﻘﺔ htmوﺷﻐﻠﻪ ﻓﺘﻼﺣﻆ ﻇﻬﻮر اﻟﻌﺒﺎرة WElcome in my site
إﺑﺘﺴﻢ ﻗﻠﻴﻼً وأﺣﻀﺮ ﻛﻮﺑﺎً ﻣﻦ اﻟﺸﺎي اﻟﺴﺎﺧﻦ إذا ﻛﻨﺖ ﻓﻲ اﻟﻠﻴﻞ أو ﻓﻨﺠﺎن ﻗﻬﻮة ﻓﻲ اﻟﺼﺒﺎح ..
وﺧﺬ ﻧﻔﺴﺎً ﻋﻤﻴﻘﺎً وأﻛﻤﻞ اﻟﺪرس ..
اﻵن أرﻳﺪ إﻳﺼﺎل ﻓﻜﺮة رﺋﻴﺴﻴﺔ ﻓﻲ ﻫﺬا اﻟﺪرس وﻫﻲ دﻣﺞ ﻛﻮد htmlﻣﻊ ﻟﻐﺔ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ
وﺑﻤﻌﻨﻰ آﺧﺮ ﺗﻮﻟﻴﺪ ﻛﻮد htmlﻋﻦ ﻃﺮﻳﻖ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ..
www.Arab-Team.com
إذا ﻗﻠﺖ ﻟﻜﻢ أرﻳﺪ أن أﺿﻊ ﻋﻨﻮان اﻟﺼﻔﺤﺔ ﺑﺄﻛﺒﺮ ﺳﻤﺔ ﻣﻮﺟﻮدة ﻓﻲ htmlﺗﻘﻮﻟﻮن
أﻛﺘﺐ ﻣﺎﻳﻠﻲ:
ﻓﺄﻗﻮل ﻣﻤﺘﺎز.....
ﻣﺎذا ﻟﻮ ﻛﻨﺖ أرﻳﺪ ﻛﺘﺎﺑﺔ ﻫﺬا اﻟﻜﻮد ﻋﻦ ﻃﺮﻳﻖ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ أﻛﻴﺪ ﺳﺘﻌﺮﻓﻮن اﻷﺟﺎﺑﺔ ؟ أﻛﺘﺐ
ﻣﺎﻳﻠﻲ ﻟﻠﺬي ﻟﻢ ﻳﻌﺮف اﻹﺟﺎﺑﺔ
<script >"LANGUAGE="javascript
)">document.write("<h1>WElcome in my site</h1
></SCRIPT
اﻻﺟﺎﺑﺔ :
ﻧﻌﻢ <<< ﻣﻤﺘﺎز
ﻻ <<< ﻻ ﻋﻠﻴﻚ ﺳﺘﺘﻀﺢ اﻷﻣﻮر ﻓﻲ اﻟﺪرس اﻟﻘﺎدم ..
ﻟﻘﺪ ﺗﻌﺮﻓﻨﺎ اﻷن ﻋﻠﻰ اﻟﻐﺮض documentوﻳﻘﺼﺪ ﻓﻴﻪ اﻟﺸﺎﺷﺔ اﻟﺘﻲ ﻳﻄﻠﻊ ﻋﻠﻴﻬﺎ ﻣﻌﻠﻮﻣﺎت ﻓﻲ
اﻟﻤﺘﺼﻔﺢ وﻻﺣﻆ أﻧﻪ ﺑﻌﺪ إﺳﻢ اﻟﻐﺮض وﺿﻌﺖ ﻧﻘﻄﺔ ﺛﻢ وﺿﻌﺖ writeﻫﺬا اﻷﻣﺮ writeﻳﺴﻤﻰ
ﻣﻴﺜﻮد أي methodوﻫﻮ ﻳﻜﻮن ﺗﺎﺑﻊ ﻟﻠﻐﺮض اﻟﺬي ﻛﺘﺐ ﻗﺒﻠﻪ
ﻓﻤﺜﻼً أﻗﻮل ال method writeﺗﺎﺑﻊ ﻟﻞobject document
واﺿﻊ ﺑﻴﻨﻬﻢ ﻋﻼﻣﺔ .ﻧﻘﻄﺔ ...ﻛﻤﺎ ﻳﻠﻲ document.write
www.Arab-Team.com
اﻵن اﻟﺴﺆال ﻟﻘﺪ ﺣﺼﻠﺖ ﻋﻠـﻰ اﻟﻤـﻨﻬﺞ ﻓﻤـﺎذا أﻛﺘـﺐ إذا أردت ﺗﻄﺒﻴـﻖ اﻟﻘﺎﻋـﺪة اﻟﺬﻫﺒﻴـﺔ ﻟﻠﺠﺎﻓـﺎ
ﺳﻜﺮﺑﺖ اﻟﺘﻲ ﻫﻲ:
object.method
ﻟﻘﺪ ﺣﺼﻠﺖ ﻋﻠﻰ ال methodواﻟﻨﻘﻄﺔ ﺳـﺄدﻟﻜﻢ ﻋﻠـﻰ ﻣﻮﻗﻌﻬـﺎ ﻋﻠـﻰ اﻟﻜﻴﺒـﻮرد اﻵن اﻟﺘـﻲ ﻫـﻲ
ﻣﻜﺎن ﺣﺮف اﻟﺰال ﻓﻲ اﻟﻌﺮﺑﻲ وﺗﺤﺖ ﺣﺮف اﻟﻤﻴﻢ!!! ﻫﻞ وﺟﺪﺗﻢ اﻟﻨﻘﻄﺔ ﻋﻠﻰ ﻟﻮﺣﺔ اﻟﻤﻔﺎﺗﻴﺢ ؟
ﻻ :إذا اﻟﻜﻴﺒﻮرد ﻧﺎﻗﺺ ﻋﻨﺪك أو أﻧﺖ ﻧﻌﺴﺎن ..
ﻧﻌﻢ :إذا ﺳﻨﻜﻤﻞ ..
اﻵن ﻳﺠﺐ ﻋﻠﻲ أن أﻧﺸﺎ ﻏﺮض ﻟﻜﻲ أﻃﺒﻖ اﻟﻘﺎﻋﺪة وﻟﻜﻦ ﻣﺎﻧﻮع اﻟﻐﺮض اﻵن أﺗﻌﺎﻣـﻞ ﻣـﻊ اﻟﺘـﺎرﻳﺦ
واﻟﻮﻗﺖ إذا ﻫﻮ اﻟﻐﺮض date
أﻛﺘﺐ ﻣﺎﻳﻠﻲ ﻹﻧﺸﺎء اﻟﻐﺮض وﺗﻄﺒﻖ أﺣﺪ اﻟﻤﻨﺎﻫﺞ ﻋﻠﻴﻪ
<script >"LANGUAGE="javascript
;)(RightNow = new Date
))(document.write(RightNow.getDay
></SCRIPT
www.Arab-Team.com
<script >"LANGUAGE="javascript
;)(RightNow = new Date
))(document.write(RightNow.getday
></SCRIPT
رﺑﻤﺎ ﺗﻘﻮل ﻟﻲ ﻫﺬا اﻟﻜﻮد ﻧﻔـﺲ اﻟﻜـﻮد اﻟﺴـﺎﺑﻖ ﻓـﺄﻗﻮل ﻟـﻚ إذﻫـﺐ ﻟﻌﻨـﺪ دﻛﺘـﻮر اﻟﻌﻴـﻮن واﻓﺤـﺺ
ﻋﻴﻮﻧﻚ!!!
ﻻﺗﺰﻋﻞ ﻣﻨﻲ ﺑﺲ أﻟﻢ ﺗﻼﺣﻆ أن إﺳﻢ اﻟﻤﻨﻬﻢ أﺻﺒﺢ )( getdayوﻟﻴﺲ )(getDay
أي أﻧﻪ ﺣﺮف Dﻛﺒﻴﺮ وﻟﻴﺲ ﺻﻐﻴﺮ dإذا اﻟﺨﻼﺻﺔ ﻟﻐﺔ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻟﻐﺔ ﺣﺴﺎﺳﺔ ﻟﺤﺎﻟﺔ اﻷﺣﺮف
ﻛﻤﺎ ﻓﻲ ﻟﻐﺔ ﺳﻲ.. ++
ﻣﻼﺣﻈﺔ:
ﻫﻨﺎك ﻋﻴﺐ وﺣﻴﺪ ﻓﻲ ﻫﺬا اﻟﻜﻮد اﻟﺴﺎﺑﻖ ..وﻟﻜﻨﻪ ﻋﻴـﺐ واﷲ ﻋﻴـﺐ ..وﻫـﻮ أن اﻟﺠﺎﻓـﺎ ﺳـﻜﺮﻳﺒﺖ
ﺗﺒﺪأ ﻓﻲ ﻋﺪ اﻟﺸﻬﻮر ﻣﻦ اﻟﺼﻔﺮ ،ﺑﻤﻌﻨﻲ أن ﺷﻬﺮ ﻳﻨﺎﻳﺮ ﻫﻮ ﺷﻬﺮ ﺻـﻔﺮ وﺷـﻬﺮ ﻓﺒﺮاﻳـﺮ ﻫـﻮ ﺷـﻬﺮ
واﺣﺪ وﻫﻜﺬا ..
ﻳﻤﻜﻨﻨﺎ ﺣﻞ ﺗﻠﻚ اﻟﻤﺸﻜﻠﺔ ﺑﺒﺴﺎﻃﺔ ﺑﺈﺿﺎﻓﺔ ١إﻟﻲ اﻟﺸﻬﻮر ﻓﻲ اﻟﻜﻮد ﺑﺄﻋﻠﻲ ﻟﻴﻜﻮن ﻫﻜﺬا :
Rightnow.getMonth ( ) + 1
<script >"LANGUAGE="javascript
;) (RightNow = new Date
"(document.writeﺗﺎرﻳﺦ اﻟﻴﻮم ﻳﻜﻮن " + RightNow.getMonth( )+
"-" + RightNow.getDate( ) + "-" + RightNow.getYear( ) +
"وأﻧﺖ دﺧﻠﺖ إﱃ اﻟﺼﻔﺤﺔ اﻵن واﻟﺴﺎﻋﺔ ﻫﻲ : " +
RightNow.getHours( ) +
) ) (":" + RightNow.getMinutes
></SCRIPT
ﻃﻴﺐ ﻫﺬا اﻟﻜﻮد اﻟﺘﺎﻟﻲ ﻧﻔﺲ اﻟﺴﺎﺑﻖ وﻟﻜﻦ ﻳﺨﺘﻠﻒ ﻗﻠﻴﻼ ﺣﺎول أن ﺗﻜﺘﺸﻒ ﻣﺎ ﻓﻌﻠﻨﺎ :
<script >"LANGUAGE="javascript
;) (RightNow = new Date
www.Arab-Team.com
"(document.writeﺗﺎرﻳﺦ اﻟﻴﻮم ﻳﻜﻮن " + RightNow.getMonth( )+
"-" + RightNow.getDate( ) + "-" + RightNow.getYear( ) +
"<hr>" +
"وأﻧﺖ دﺧﻠﺖ إﱃ اﻟﺼﻔﺤﺔ اﻵن واﻟﺴﺎﻋﺔ ﻫﻲ : " +
RightNow.getHours( ) +
) ) (":" + RightNow.getMinutes
></SCRIPT
ﻟﻘﺪ ﻗﻤﺖ ﺑﺘﻌﺪﻳﻞ ﺑﺴﻴﻂ ﺣﺎول أن ﺗﺴﻔﻴﺪ ﻣﻨﻪ وﺗﻄﻮره إﻟﻰ اﻷﻓﻀﻞ ..
وﻻﺗﻨﺴﻮا أن ﺗﺴﺄﻟﻮا ﻋﻦ اﻷﺷﻴﺎء اﻟﺘﻲ ﻟﻢ ﺗﻔﻬﻤﻮﻫﺎ ..
Object.method
www.Arab-Team.com
اﻟﺪرس اﻟﺜﺎﻟﺚ
أرﺟﻮا اﷲ أن ﻳﻜﻮن اﻹﺧﻮة ﻗﺪ درﺳﻮا اﻟﺪروس اﻟﻤﺎﺿﻴﺔ ﺑﺸﻜﻞ ﺟﻴﺪ ...ﺣﺘﻰ ﻧﻜﻤﻞ درس اﻟﻴﻮم
إن ﺷﺎء اﷲ
)"document.write ("hello
object.properties=value
أوﻻ ﻧﻀﻎ اﻟﻐﺮض وﻣﻦ ﺑﻌﺪه اﻟﻨﻘﻄﺔ وﻣﻦ ﺑﻌﺪه اﻟﺨﺎﺻﻴﺔ ﻟﻬﺬا اﻟﻐﺮض وﻣﻦ ﺛﻢ اﻟﻨﺎﺗﺞ ﺑﻌﺪ
ﻋﻼﻣﺔ "="
ﻓﻤﺜﻼً إذا ﻛﺎﻧﺖ اﻟﺨﺎﺻﻴﺔ ﻧﺺ ﻧﻀﻊ اﻟﺠﻮاب ﻧﺺ وإذا ﻛﺎﻧﺖ اﻟﺨﺎﺻﻴﺔ ﻟﻮن ﻧﻀﻊ اﻟﻔﺎﻟﻴﻮ valueﻗﻴﻤﺔ
اﻟﻠﻮن وﻫﻜﺬا ..
اﻟﺨﻼﺻﺔ:
ﺧﻼﺻﺔ اﻟﻜﻼم :أي ﺣﺮﻛﺔ ﻓﻲ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ أﺗﻌﺎﻣﻞ أﻧﺎ ﻣﻊ ﻏﺮض ،وﻟﻤﺤﺎﻛﺎة ﻫﺬا اﻟﻐﺮض
أﺳﺘﺨﺪم ﺧﺼﺎﺋﺼﺔ propertiesوﻣﻨﺎﻫﺠﻪ ، methodsﻃﺒﻌﺎ أﺿﻊ ﻋﻼﻣﺔ اﻟﻴﺴﺎوي ﺑﻌﺪ اﻟﺨﺎﺻﻴﺔ
اﻟﻤﺜﺎل اﻷول:
اﻛﺘﺐ اﻟﻜﻮد اﻟﺘﺎﻟﻲ :
><script language=javascript
'document.bgColor='000000
></script
www.Arab-Team.com
ﻫﻞ ﻻﺣﻈﺖ ﻣﺎ ﺟﺮى ؟
ﻟﻘﺪ ﺗﻐﻴﺮ ﻟﻮن اﻟﺨﻠﻔﻴﺔ ﺑﺎﻟﻠﻮن اﻷﺳﻄﻮد ﻷﻧﻲ ﺗﻜﻠﻤﺖ ﻣﻊ اﻟﻐﺮض documentﻋﻦ ﻃﺮﻳﻖ اﻟﺨﺎﺻﻴﺔ
bgColorﻟﺘﻐﻴﺮ ﻟﻲ ﺧﻠﻔﻴﺔ اﻟﺼﻔﺤﺔ إﻟﻰ اﻟﻠﻮن اﻷﺳﻄﻮد اﻟﺬي ﻗﻴﻤﺘﻪ ٠٠٠٠٠٠ﺳﺖ أﺻﻔﺎر ..
ﻟﻘﺪ رأﻳﺘﻢ ﻛﻴﻒ ﺗﻢ اﻟﺘﻌﺎﻣﻞ ﻣﻊ اﻟﺨﻮاص ..
><script language=javascript
'document.bg^Color='000000
></script
-ﺳﺄﺷﺮح ﻛﻴﻒ ﻳﺘﻢ ﺗﺠﻤﻴﻊ اﻟﻸﻟﻮن ﻓﻤﺜﻼ ٠٠٠٠٠٠أﺳﻮد و ffffffاﻟﻠﻮن اﻷﺑﻴﺾ ....اﻟﺦ.
ﻳﺘﻜﻮن اﻟﺮﻗﻢ اﻟﺬي ﻳﻌﺒﺮ ﻋﻦ اﻟﻠﻮن ﻣﻦ ﺳﺖ ﺧﺎﻧﺎت :
اﻷوﻟﻰ واﻟﺜﺎﻧﻴﺔ ﻟﻠﻮن اﻷﺣﻤﺮ
و ٣و ٤ﻟﻠﻮن اﻷزرق
و ٥و ٦ﻟﻠﻮن اﻷﺧﻀﺮ
ﻃﻴﺐ ﻛﻴﻒ ﺑﺪي أﻛﺘﺐ اﻟﻘﻴﻤﺔ ٢٥٥أو ٢٤٠أو ٢٠٠داﺧﻞ اﻟﺨﺎﻧﺘﻴﻦ اﻟﻤﺨﺼﺼﺔ ﻟﻠﻮن اﻷﺣﻤﺮ ؟؟
ﻻﺗﻘﻠﻖ ﻓﺎﻟﻜﺘﺎﺑﺔ ﺗﻜﻮن ﺑﺎﻟﺴﺖ ﻋﺸﺮي ...
ﻃﻴﺐ ﻛﻴﻒ أﺣﻮل اﻟﺮﻗﻢ إﻟﻰ ﺳﺖ ﻋﺸﺮي ؟
ﻻﺗﻘﻠﻖ إذا ﻛﻨﺖ ﻻﺗﻌﺮف ﻛﻴﻒ ﺗﺤﻮل ﺑﻴﻦ ﻧﻈﻢ اﻷﻋﺪاد ) أي ﻣﻦ ﻋﺸﺮي إﻟﻰ ﺳﺖ ﻋﺸﺮي (
ﻣﺎﻋﻠﻴﻚ إﻻ أن ﺗﻔﺘﺢ اﻵﻟﺔ ﺣﺎﺳﺒﺔ وﺗﺠﻌﻠﻬﺎ ﻓﻲ اﻟﻮﺿﻊ اﻟﻌﻠﻤﻲ وذﻟﻚ ﻟﻜﻲ ﺗﻈﻬﺮ زر hexأﻛﺘﺐ
اﻟﺮﻗﻢ ٢٥٥ﺛﻢ إﺿﻐﻂ ﻋﻠﻰ اﻟﺰر hexﻓﻴﻌﻄﻴﻚ اﻟﺮﻗﻢ ﺑﺎﻟﺴﺖ ﻋﺸﺮي ..وﻳﻜﻮن اﻟﺠﻮابff
www.Arab-Team.com
أﺣﻤﺮ ff = ٢٥٥
أﺧﻀﺮ ff = ٢٥٥
أزرق ff = ٢٥٥
إذا اﻟﻠﻮن ffffffﻫﻮ ﻟﻮن أﺑﻴﺾ ..
ﻃﻴﺐ اﻵن أرﻳﺪ رﻣﺎدي ﻛﻴﻒ ﻳﻄﻠﻊ ﻟﻮن رﻣﺎدي
أﺣﻤﺮ d٧ = ١٢٥
أﺧﻀﺮ d٧ = ١٢٥
أزرق 7d = ١٢٥
ﻃﻴﺐ ﻛﻴﻒ أﺣﺼﻞ ﻫﻞ ﻟﻮن ﻣﻌﻴﻦ ﻻ ﺗﻘﻠﻖ ﻳﻮﺟﺪ ﻣﺮاﺟﻊ ﻟﻬﺬه اﻟﻘﺼﺔ ...وﺑﻜﻞ ﺑﺴﺎﻃﺔ ﻳﻤﻜﻦ
ﻟﺒﺮﻧﺎﻣﺞ frontpageأن ﻳﻜﺘﺐ ﻟﻚ اﻟﻠﻮن اﻟﺬي ﺗﺮﻳﺪه ...ﺑﺲ ﺣﺪد اﻟﻠﻮن وﻫﻮ ﻳﻌﻄﻴﻚ ﻛﻮده.....
><script language=javascript
)"document.write ("hello
'document.bgColor='7d7d7d
'document.fgColor='fff446
></script
ﻃﻴﺐ اﻵن ﻛﻞ دروﺳﻨﺎ اﻟﺴﺎﺑﻘﺔ ﻋﻤﺎ ﻧﻌﻤﻞ ﻣﻊ اﻟﻐﺮض documentدﻋﻮﻧﺎ اﻵن ﻧﻐﻴﺮه.....
اﻵن ﺳﻨﺴﺘﺨﺪم اﻟﻐﺮضWindow
ﻟﻮﻫﺬا اﻟﻐﺮض ﺧﺎﺻﻴﺔ اﻟﺘﻲ ﺗﻌﺮف ﺑــ statusوﻫﻲ ﻋﺒﺎرة ﻋﻦ اﻟﻨﺺ اﻟﺬي ﻳﻈﻬﺮ ﻓﻲ أﺳﻔﻞ ﻧﺎﻓﺬة
اﻟﻤﺘﺼﻔﺢ ﻋﻨﺪك..
اﻵن اﻛﺘﺐ اﻟﻜﻮد اﻟﺘﺎﻟﻲ وﺳﺘﻔﻬﻢ ﻗﺼﺪي:
www.Arab-Team.com
><script language=javascript
'window.status='Hi : welcome in my site
></script
اﻟﻤﺼﻄﻠﺤﺎت اﻟﺠﺪﻳﺪة:
propertiesﺗﻌﻨﻲ اﻟﺨﺼﺎﺋﺺ ...وﻛﻞ ﻏﺮض ﻓﻲ ﻟﻐﺎت اﻟﺒﺮﻣﺠﺔ ﻟﻪ ﻣﺎﻳﻠﻲ
propertiesﺧﺼﺎﺋﺺ وﻟﻘﺪ درﺳﻨﺎﻫﺎ اﻟﻴﻮم
methodsﻣﻨﺎﻫﺞ وﻟﻘﺪ درﺳﻨﺎﻫﺎ اﻟﺒﺎرﺣﺔ
eventsأﺣﺪاث واﻟﺘﻲ ﺳﻨﺪرﺳﻬﺎ ﻓﻲ اﻟﺪرس اﻟﻘﺎدم ﺑﺈذﻧﻪ ﺗﻌﺎﻟﻰ.
Statusﺗﻌﻨﻲ وﺿﻊ أو ﺣﺎﻟﺔ ...ﻛﻤﺎ ﺗﻼﺣﻈﻮن أﻧﻪ ﻓﻌﻼ اﻟﺸﺮﻳﻂ اﻟﺴﻔﻠﻲ ﻟﻠﻤﺘﺼﻔﺢ ﻳﺴﻤﻮﻧﻪ
ﺷﺮﻳﻂ اﻟﺤﺎﻟﺔ أي ﻟﻜﻲ ﺗﻌﺮف ﻣﻨﻪ ﺣﺎﻟﺔ اﻟﺼﻔﺤﺔ ..
www.Arab-Team.com
اﻟﺪرس اﻟﺮاﺑﻊ
Events
"<A HREF="http://www.arab-team.com
'اﻟﻌﺮﺑﻲ ﻣﻮﻗﻊ اﻟﻔﺮﻳﻖ'=onMouseOver="window.status
return true">Click Here
ﻻﺣﻆ اﺳﺘﺨﺪﻣﺖ اﻟﺤﺪث onMouseOverأي ﻋﻨﺪ وﺿﻊ اﻟﻔﺄرة ﻓﻮق اﻟﺮاﺑﻂ ﺗﻈﻬﺮ اﻟﻌﺒﺎرة اﻟﻤﺤﺪدة
وأﻛﻴﺪ ﻻﺣﻈﺖ وﺟﻮد; return trueوﺗﺴﺘﺨﺪم ﻫﺬه ﻟﻴﻈﻬﺮ اﻟﻨﺺ ﻋﻠﻲ ﺷﺮﻳﻂ اﻟﺤﺎﻟﺔ وﺳﻴﻠﺘﺼﻖ
ﺑﻪ وﻟﻦ ﻳﺰول إﻻ إذا أﻋﺪت ﺗﺤﻤﻴﻞ اﻟﺼﻔﺤﺔ ..
أﻣﺎ إذا ﻟﻢ ﺗﻮﺿﻊ return true
ﻓﻲ ﻫﺬه اﻟﺤﺎﻟﺔ ﻟﻦ ﻳﺘﻢ أي ﻓﺤﺺ وﺳﻴﻈﻬﺮ اﻟﻨﺺ اﻹﻓﺘﺮاﺿﻲ اﻟﺬي ﻳﻈﻬﺮ ﻋﻨﺪ ﺗﻤﺮﻳﺮ اﻟﻤﺆﺷﺮ
ﻋﻠﻲ أي وﺻﻠﺔ وﻫﻮ راﺑﻂ اﻟﺼﻔﺤﺔ اﻟﺘﻲ ﺗﺆدي إﻟﻴﻬﺎ ﺗﻠﻚ اﻟﻮﺻﻠﺔ اﻟﺘﺸﻌﺒﻴﺔ .وﻋﻨﺪﻣﺎ ﺗﺒﻌﺪ ﻣﺆﺷﺮ
اﻟﻤﺎوس ﻋﻦ اﻟﻮﺻﻠﺔ اﻟﺘﺸﻌﺒﻴﺔ ﺳﻴﻈﻬﺮ اﻟﻨﺺ اﻟﺬي ﺣﺪدﺗﻪ ﻓﻲ اﻷﻣﺮ وﺳﻴﺘﻢ ﺣﺪوث اﻟﺤﺪث...
ﻳﻌﻨﻲ ﺑﺈﺧﺘﺼﺎر ﻳﻨﻔﺬ اﻟﺤﺪث ﻋﻨﺪ إﺑﻌﺎد اﻟﻔﺄرة ﻣﻦ ﻓﻮق اﻟﺮاﺑﻂ..
"[align=left][code]<A HREF="http://www.arab-team.com
' ">Clickﻣﻮﻗﻊ اﻟﻔﺮﻳﻖ اﻟﻌﺮﺑﻲ'=onMouseOver="window.status
>Here</A
><br
"<A HREF="http://www.alostora.com
>'">Click Here</Aاﻷﺳﻄﻮرة ﻣﻮﻗﻊ'=onMouseOver="window.status
ﻧﻌﻢ ﻳﻤﻜﻨﻚ وﺿﻊ ﻣﺎﺷﺌﺖ ﻣﻦ اﻷﻛﻮاد واﻻﺳﻄﺮ ﺿﻤﻦ اﻟﺤﺪث اﻟﻮاﺣﺪ وذﻟﻚ ﺑﻮاﺳﻄﺔ ﻃﺮﻳﻘﺘﻴﻦ
: html إﻣﻜﺎﻧﻴﺎت-١
:اﻛﺘﺐ اﻟﻤﺜﺎل اﻟﺘﺎﻟﻲ
<A HREF="http://www.arab-team.com"
onMouseOver="document.bgColor='yellow';
onMouseOver=window.status='asd';
onMouseOver=document.fgColor='0055e3';
return true ">Click Here</A>
WELCOME!!!!!!
<A HREF="http://www.arab-team.com"
onMouseOver=
"
Java script code line;
Java script code line;
Java script code line;
Java script code line;
Java script code line;22..;
"
>Click Here</A>
WELCOME!!!!!!
www.Arab-Team.com
-٢ﻋﻦ ﻃﺮﻳﻖ اﻟﻔﺎﻧﻜﺸﻦ Functionاﻟﺘﻲ ﻫﻲ ﻣﻮﺿﻮع درﺳﻨﺎ اﻟﻘﺎدم ....ﺑﺈذﻧﻪ ﺗﻌﺎﻟﻰ...
اﻵن أرﻳﺪ أن أﻃﻠﻌﻜﻢ ﻋﻠﻰ ﻣﻨﻬﺞ ﻟﻠﻐﺮض windowوﻫﻮ alertاﻟﻤﺴﻮؤل ﻋﻦ أﻇﻬﺎر رﺳﺎﻟﺔ
ﻟﻠﻤﺴﺘﺨﺪم ..
ﺟﺮب اﻟﻜﻮد اﻟﺘﺎﻟﻲ وﻻﺣﻆ ﻣﺎ ﻳﺤﺪث:
"<A href="http://www.$$$$$$$.com
";)'اﻟﺴﻼم ﻋﻠﻴﻜﻢ'(onMouseOver="window.alert
></Aﲢﻴﺔ>
ﻫﺬا اﻟﺤﺪث ﻳﺴﻤﺢ ﻟﻚ ﺑﺘﺤﺪﻳﺪ ﻣﺎ ﺗﺮﻳﺪ ﺣﺪوﺛﻪ ﻋﻨﺪ اﻟﻀﻐﻂ ﻋﻠﻲ زر اﻹدﺧﺎل )(Submit Button
www.Arab-Team.com
onMouseOver
www.Arab-Team.com
اﻟﺪرس اﻟﺨﺎﻣﺲ
اﻟﺴﻼم ﻋﻠﻴﻜﻢ ورﺣﻤﺔ اﷲ أرﺟﻮا ﻣﻦ اﷲ ﺗﻌﺎﻟﻰ أن ﺗﻜﻮﻧﻮا ﺑﺨﻴﺮ وﻛﻞ ﺷﻲ ﻋﻠﻰ ﻣﺎﻳﺮام ...
ﻫﺬه اﻟﺨﻄﻮط اﻟﻌﺮﻳﻀﺔ اﻟﺘﻲ اﺗﺒﻌﻨﺎﻫﺎ ﻓﻲ اﻟﺪروس اﻟﻤﺎﺿﻴﺔ اﻟﻴﻮم ﺳﻨﺘﻜﻠﻢ ﻋﻦ:
-١اﻟﻮﻇﺎﺋﻒ Functionاﻟﺘﻲ ﻧﺤﻦ ﻧﻘﻮم ﺑﺒﻨﺎﺋﻬﺎ ..
-٢اﻟﻤﺘﺤﻮﻻتVariable
اﻵن ﺳﻨﻘﻮم ﺑﻜﺘﺎﺑﺔ اﻟﻤﺜﺎل اﻟﺘﺎﻟﻲ وﻣﻦ ﺑﻌﺪﻫﺎ ﻧﻘﻮم ﺑﺎﻟﺸﺮح :
><html
><head
></head
>")(<body onload="mofak
><script
)(function mofak
{
;)"ﻋﻠﻴﻜﻢ اﻟﺴﻼم"(alert
}
></Script
></body
></html
ﺑﻜﻞ اﺧﺘﺼﺎر ﻳﻤﻜﻨﻨﺎ ﺗﻠﺨﻴﺺ اﻟﻮﻇﻴﻔﺔ ﺑــــ ﺑﻜﺘﺎﺑﺔ اﻟﻌﺪﻳﺪ ﻣﻦ أﺳﻄﺮ اﻟﻜﻮد ﺿﻤﻦ ﻗﻮﻳﻴﻴﻦ
وﻧﺴﺘﺪﻋﻲ ﻫﺬه اﻟﻜﺘﺎﺑﺎت ﻋﻦ ﻃﺮﻳﻖ إﺳﻢ اﻟﻮﻇﻴﻔﺔ ﻳﻌﻨﻲ ﻫﻜﺬا:
<A HREF="http://www.arab-team.com"
onMouseOver="document.bgColor='yellow';
onMouseOver=window.status='asd';
onMouseOver=document.fgColor='0055e3';
return true ">Click Here</A>
WELCOME!!!!!!
:ًاﻵن ﺳﻨﻌﺪل اﻟﻜﻮد ﻟﻴﻜﻲ ﻳﻌﻤﻞ ﺑﻮاﺳﻄﺔ وﻇﻴﻔﺔ وذﻟﻚ أﺳﻬﻞ وأﻗﻞ ﻛﻮدا
: اﻛﺘﺐ ﻣﺎ ﻳﻠﻲ ﻟﺘﻌﺪﻳﻞ اﻟﻤﺜﺎل
<html>
<head>
</head>
<body>
<a HREF="http://www.arab-team.com"
onMouseOver="mofak()">Click Here</a>
<script>
function mofak()
{
document.bgColor='yellow';
window.status='asd';
document.fgColor='0055e3';
}
</Script>
.. ﻟﻴﺲ ﻣﻨﺎ ﺷﺨﺺ ﻻ ﻳﻌﺮف ﻣﺎﻫﻲ اﻟﻤﺘﺤﻮﻻت إذا ﻛﺎن ﻳﻌﺮف ﻋﻠﻰ اﻷﻗﻞ ﻟﻐﺔ ﺑﺮﻣﺠﺔ وﺣﻴﺪة
><script
;var a
;var b
;var c
;a=5
;b=10
;c=a*b
;)alert(c
></Script
ﻫﻞ ﻻﺣﻈﺖ ﻛﻴﻒ أﻧﻨﻲ ﻋﺮﻓﺖ اﻟﻤﺘﺤﻮﻻت ﻋﻦ ﻃﺮﻳﻖ اﻟﻜﻠﻤﺔ varﺛﻢ ﺑﻌﺪﻫﺎ اﺧﺘﺎر إﺳﻢ اﻟﻤﺘﺤﻮل
ﻻﺣﻆ أﻧﻨﻲ ﻗﻤﺖ ﺑﺈﻋﻄﺎء اﻟﻤﺘﺤﻮﻟﻴﻦ ﻗﻴﻢ واﻟﻤﺘﺤﻮل اﻟﺜﺎﻟﺚ ﺟﻌﻠﺘﻪ ﺟﺪاﺋﻬﻤﺎ
ﺛﻢ أﺧﺮﺟﺖ اﻟﻨﺎﺗﺞ ﻋﻠﻰ ﺷﻜﻞ ﻣﺮﺑﻊ ﺣﻮار Alert
;var a=5
اﻵن ﺳﺄﻃﺮح اﻟﻤﺜﺎل اﻟﺘﺎﻟﻲ واﻟﺬي ﻳﺪﻣﺞ ﻟﻜﻢ أﻓﻜﺎر ﻋﺪة دروس ﻣﻌﺎً :
-١وﻇﺎﺋﻒ اﻟﺘﺎرﻳﺦ واﻟﻮﻗﺖ ﻣﻦ اﻟﺼﻨﻒdate
-٢اﻟﻮﻇﺎﺋﻒfunction
-٣اﻟﻤﺘﺤﻮﻻتvariable
>)(<body onload=ccc
><script
)(function ccc
{
;)(var f = new Date
;)(var y = f.getYear
;var m = f.getMonth() + 1
;)(var d = f.getDay
;' ' var t = m + ;'/' + d + '/'+ y +
;) "" + t + ".اﻟﺘﺎرﻳﺦ اﻵن"(document.write
www.Arab-Team.com
}
></Script
ﺧﻼﺻﺔ اﻟﺪرس:
-١اﻟﻮﻇﺎﺋﻒ ﻫﻲ ﻋﺒﺎرة ﻋﻦ ﻗﻮﺳﻴﻦ ﻣﻜﺘﻮب ﺑﺪاﺧﻠﻬﻤﺎ اﻟﻌﺪﻳﺪ ﻣﻦ أﺳﻄﺮ اﻟﻜﻮد واﻟﺘﻲ ﻧﺴﺘﺪﻋﻴﻬﺎ
ﻋﻦ ﻃﺮق إﺳﻢ اﻟﻮﻇﻴﻔﺔ ..
-٢اﻟﻤﺘﺤﻮﻻت ﻫﻲ ﺣﺠﺮ ﻓﻲ اﻟﺬاﻛﺮة ﻧﺨﺰن ﻣﺎﻧﺸﺎء ﻣﻦ اﻟﻘﻴﻢ ﻓﻴﻬﺎ ..
واﻟﺘﻲ ﻫﻲ:
أوﻻً :ﻗﻮاﻋﺪ ﺗﺴﻤﻴﺔ اﻟﻤﺘﺤﻮﻻت:
إذ ﻻﻳﻤﻜﻦ ﺗﺴﻤﻴﺔ إﺳﻢ ﻣﺘﺤﻮل ٤٤أي رﻗﻢ أو أول اﻟﻤﺘﺤﻮل رﻗﻢ name٤٤
اﻟﻤﺘﺤﻮﻻت ﻓﻲ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﺗﻨﺨﻀﻊ ﻟﻸﻣﻮر اﻟﺘﺎﻟﻴﺔ:
-١اﻟﺨﺎﻧﺔ اﻷوﻟﻲ ﻣﻦ إﺳﻢ اﻟﻤﺘﻐﻴﺮ ﻻﺑﺪ أن ﺗﻜﻮن أﺣﺪ اﻷﺣﺮف اﻹﻧﺠﻠﻴﺰﻳﺔ ﺳﻮاءً ﺣﺮﻓﺎ ﻛﺒﻴﺮا أو
ﺻﻐﻴﺮا ﻣﻊ ﻣﻼﺣﻈﺔ اﻟﻔﺮق ﺑﻴﻨﻬﻤﺎ ،وﻳﻤﻜﻦ اﻟﺒﺪء ﺑﻌﻼﻣﺔ _ أو ﻋﻼﻣﺔ ، $ﻣﻊ أﻧﻪ ﻻﻳﻨﺼﺢ
ﺑﺈﺳﺘﺨﺪام اﻟﻌﻼﻣﺔ اﻷﺧﻴﺮة.
-٢اﻷﺳﻤﺎء ﻻﻳﻤﻜﻦ أن ﺗﺤﻮي ﻣﺴﺎﻓﺎت ﺑﻴﻦ اﻷﺣﺮف ،ﻟﻜﻦ ﻳﻤﻜﻨﻚ إﺳﺘﺨﺪام اﻟﻌﻼﻣﺔ _ ﺑﺪل
اﻟﻤﺴﺎﻓﺎت.
-٣ﻻﻳﻤﻜﻨﻚ إﻃﻼﻗﺎ إٍﺳﺘﺨﺪام رﻗﻢ ﻛﺄول ﺧﺎﻧﺔ ﻓﻲ اﻹﺳﻢ .ﻛﻤﺎ ﻗﻠﺖ ﻓﻲ اﻟﻤﻘﺪﻣﺔ.
-٤ﻻﻳﻤﻜﻦ ﻷي إﺳﻢ أن ﻳﻤﺎﺛﻞ أﻳﺎ ﻣﻦ اﻟﻜﻠﻤﺎت اﻟﻤﺤﺠﻮزة( راﺟﻊ اﻟﺼﻔﺤﺔ اﻟﺴﺎﺑﻘﺔ ( وﻫﺬه
اﻟﻘﺎﻋﺪة ﻋﺎﻣﺔ ﻟﺠﻤﻴﻊ ﻟﻐﺎت اﻟﺒﺮﻣﺠﺔ ،ﻣﺜﻞ forأو ifأو function
ﺛﺎﻧﻴﺎً :
ﺳﻼﺳﺔ اﻟﻤﺘﻐﻴﺮات ﻓﻲ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻣﻦ ﺛﻼﺛﺔ ﻧﻮاﺣﻲ:
-١ﺳﻬﻮﻟﺔ ﻓﻲ اﻟﺘﻌﺮﺑﻒ ﺣﻴﺚ ﻳﻤﻜﻨﻨﺎ أن ﻧﻌﺮف أﻛﺜﺮ ﻣﻦ ﻣﺘﺤﻮل ﺑﻨﻔﺲ اﻟﺴﻄﺮ
; var x,y,z
; var x=400
www.Arab-Team.com
-٣ﺳﻬﻮﻟﺔ ﺗﻐﻴﻴﺮ ﻣﺤﺘﻮﻳﺎت اﻟﻤﺘﻐﻴﺮ ﻓﻠﻐﺔ ﺟﺎﻓﺎ ﺳﻜﺮﺑﺖ ﺗﻌﺒﺮ ﻟﻴﻨﺔ ﻓﻲ اﻟﻤﺘﺤﻮﻻت ..
ﻓﻤﺜﻼ أﻧﺎ وﺿﻌﺖ داﺧﻞ اﻟﻤﺘﺤﻮل cاﻟﻘﻴﻤﺔ ٢٠٠
; var c=200
www.Arab-Team.com
اﻟﺪرس اﻟﺴﺎدس
ﺗﻜﻠﻤﻨﺎ ﻓﻲ اﻟﺪرس اﻟﻤﺎﺿﻲ ﻋﻦ اﻟﻤﺘﺤﻮﻻت variableواﻟﻮﻇﺎﺋﻒfunction
اﻟﻴﻮم ﺳﻨﺘﺎﺑﻊ اﻟﺤﺪﻳﺚ ﻋﻦ اﻟﻮﻇﺎﺋﻒ وﻟﻜﻦ اﻟﻮﻇﺎﺋﻒ اﻟﺘﻲ ﺗﻘﺒﻞ وﺳﻴﻄﺎتparametr
ﻣﺎذا ﻳﻌﻨﻲ ﻫﺬا ؟ أﻇﻦ أﻧﻲ ﻗﻠﺖ ﻟﻜﻢ أﻧﻲ ﻻأﺣﺐ اﻟﻤﻘﺪﻣﺎت إﻟﻰ اﻷﻣﺌﻠﺔ ﻣﺒﺎﺷﺮة :
>)(<body onload=start
><script
; )(function start
{
; ;)document.write(2*3
}
></Script
><body
><script
)start(2,5
{; ; )function start(a,b
} ; ;)document.write(a*b
></Script
><body
><script
;var x,y
;)"x=prompt("please enter number1
;)"y=prompt("please enter number2
)start(x,y
; )function start(a,b
{
; ;)document.write(a*b
}
></Script
www.Arab-Team.com
ﻫﻞ ﻓﻬﻤﺖ ﻣﺎﺟﺮى ﻟﻘﺪ أرﺳﻨﺎ اﻟﻮﺳﻴﻂ اﻷول اﻟﻤﺘﺤﻮل xاﻟﺬي ﺳﻴﺪﺧﻠﻪ اﻟﻤﺴﺘﺨﺪم ..
واﻟﻮﺳﻴﻂ اﻟﺜﺎﻧﻲ ﻫﻮ yواﻟﺬي ﻳﻘﻮم ﺑﺈدﺧﺎﻟﻪ اﻟﻤﺴﺘﺨﺪم ..
ﺑﻜﻞ إﺧﺘﺼﺎر ﻳﻤﻜﻨﻨﺎ أن ﻧﻘﻮل أن اﻟﻮﻇﻴﻔﺔ أﺳﻨﺪت ﻗﻴﻤﺔ xإﻟﻰ aوﻗﻴﻤﺔ yإﻟﻰ bﺛﻢ ﻗﺎﻣﺖ
ﺑﻄﺒﺎﻋﺔ ﺟﺪاﺋﻬﻤﺎ ..
وﻫﻜﺬا ﻧﻜﻮن ﻗﺪ ﻓﻬﻤﻨﺎ ﻣﺎﻫﻲ اﻟﻤﺘﻐﻴﺮات واﻟﻮﻇﺎﺋﻒ اﻟﺘﻲ ﺗﻘﺒﻞ وﺳﻴﻄﺎت ..
وﻟﻜﻦ ﻟﺪي اﻟﻌﺪﻳﺪ ﻣﻦ اﻟﻤﻼﺣﻈﺎت ﻳﺠﺐ أن أﻗﻮﻟﻬﺎ ﺑﺨﺼﻮص ﻣﺎﺳﺒﻖ :
-١ﻳﻤﻜﻨﻚ اﺳﺘﺨﺪام أي اﺳﻢ ﻟﻠﻮﻇﻴﻔﺔ وﻟﻜﻦ ﻣﺎﻋﺪا اﺳﺘﺌﺜﻨﺎءات ﻫﺬه اﻟﻠﻐﺔ واﻟﺘﻲ ﺳﺒﻖ
ﺷﺮﺣﻬﺎ ﻓﻲ اﻟﻤﺘﻐﻴﺮات
ﻣﺜﻞ اﻟﻜﻠﻤﺎت اﻟﻤﺤﺠﻮزة ،ﻓﻼ ﻳﻤﻜﻨﻚ ﻣﺜﻼً أن ﺗﺴﻤﻲ وﻇﻴﻔﺔ forأو var ...اﻟﺦ.
-٢ﻳﻤﻜﻨﻚ اﺳﺘﺨﺪام ﻣﺎﺗﺸﺎء ﻣﻦ ﻋﺪد اﻟﺒﺮاﻣﺘﺮات ..
ﻓﻤﺜﻼ أﺣﻴﺎﻧﺎُ ﻗﺪ ﺗﺤﺘﺎج ﻟﺤﻞ ﻣﻌﺎدﻟﺔ ﻣﻦ اﻟﺪرﺟﺔ ﻓﻴﻠﺰﻣﻚ ﺣﻴﻨﻬﺎ ﺛﻼﺛﺔ ﺑﺮاﻣﺘﺮات ،وأﺣﻴﺎﻧﺎ ﺗﻀﻄﺮ
ﻹﺳﺘﺨﺪام أﻛﺜﺮ ﻣﻦ ﺛﻼﺛﺔ ..
ﻻﺗﺤﺪك اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﺑﻌﺪد اﻟﻮﺳﻴﻄﺎت ﻣﺎﻋﺪ اﻟﺮﻗﻢ اﻟﻨﻬﺎﺋﻲ ﻷﺻﻮل اﻟﻠﻐﺔ ..
ﻳﻌﻨﻲ ﻋﻨﺪﻣﺎ أﻗﻮل أو ﻏﻴﺮي ﻳﻘﻮل ﻛﻠﻤﺔ "ﺑﻼ ﺣﺪ " ﻟﻴﺲ ذﻟﻚ أﻧﻪ ﻻﻳﻮﺟﺪ ﺣﺪ ﻧﻬﺎﺋﻲ ..ﻣﺜﺎل
ﺑﺮﻧﺎﻣﺞ اﻹﻛﺴﻞ أﻗﻮل ﻟﻜﻢ أﻧﻪ ﻻﺣﺪود ﻟﻸﻋﻤﺪة اﻟﺘﻲ ﻓﻴﻪ أو اﻟﺼﻔﻮف وﻟﻜﻦ ﻓﻲ اﻟﻨﻬﺎﻳﺔ ﻟﻬﺎ ﺣﺪود
آﺧﺮ اﻟﺼﻔﻮف ﻫﻮ IV65536
ﻳﻌﻨﻲ ﺧﻤﺲ وﺳﺘﻮن أﻟﻒ ..
آﺳﻒ ﻟﺨﺮوﺟﻲ ﻋﻦ اﻟﻤﻮﺿﻮع ..
وﻟﻜﻦ أﺣﺒﺒﺖ أن أﻧﻮه ﻟﻬﺬه اﻟﻤﺴﺄﻟﺔ ..
أرﺟﻮا أن ﻳﻜﻮن درس اﻟﻴﻮم ﻣﻔﻬﻮم وإن ﺷﺎء اﷲ ﻓﻲ اﻟﻤﺴﺎء ﺳﺄﻛﻤﻞ وأﻧﻬﻲ اﻟﻮﻇﺎﺋﻒ function
اﻵن ﺳﻨﺘﺎﺑﻊ اﻟﺤﺪﻳﺚ ﻋﻦ ﻧﻮع ﺟﺪﻳﺪ ﻣﻦ اﻟﻮﻇﺎﺋﻒ وﻫﻲ اﻟﻮﻇﺎﺋﻒ اﻟﺘﻲ ﺗﺮﺟﻊ ﻗﻴﻤﺔ...
أﻧﻮاع اﻟﻮﻇﺎﺋﻒ ﻓﻲ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻫﻲ :
-١اﻟﻮﻇﺎﺋﻒ اﻟﻌﺎدﻳﺔ ...اﻟﺘﻲ ﺗﻨﻔﺬ ﻛﻮد ﻓﻘﻂ ..وﻳﺘﻢ اﺳﺘﺪﻋﺎﺋﻬﺎ ﺑﻜﺘﺎﺑﺔ إﺳﻤﻬﺎ ﻓﻘﻂ.
-٢اﻟﻮﻇﺎﺋﻒ اﻟﺘﻲ ﺗﺄﺧﺬ وﺳﻴﻄﺎت ....وﻧﺴﺘﺪﻋﻴﻬﺎ ﺑﻜﺘﺎﺑﺔ إﺳﻤﻬﺎ وﻛﺘﺎﺑﺔ اﻟﺒﺮاﻣﺘﺮات )اﻟﻮﺳﻴﻄﺎت(
ﺑﻴﻦ ﻗﻮﺳﻴﻦ.
-٣اﻟﻮﻇﺎﺋﻒ اﻟﺘﻲ ﺗﺮﺟﻊ ﻗﻴﻤﺔ ﺑﺪون أن ﺗﺄﺧﺬ أي ﺑﺮاﻣﺘﺮات.
-٤اﻟﻮﻇﺎﺋﻒ اﻟﺘﻲ ﺗﺮﺟﻊ ﻗﻴﻤﺔ ﻣﻊ وﺟﻮد ﺑﺮاﻣﺘﺮات.
أﻣﺎ ﻋﻦ اﻟﻨﻮع اﻷول واﻟﺜﺎﻧﻲ ﻓﻘﺪ ﺗﻄﺮﻗﻨﺎ ﻟﻪ ،أﻣﺎ ﻋﻦ اﻟﻨﻮﻋﻴﻦ اﻟﺜﺎﻟﺚ واﻟﺮاﺑﻊ ﻓﺴﻨﻌﻤﻞ ﺑﻬﻢ ﻓﻲ
ﻫﺬا اﻟﺪرس ...ﺑﺈذن اﷲ ﺗﻌﺎﻟﻰ.
www.Arab-Team.com
اﻛﺘﺐ اﻟﻤﺜﺎل اﻟﺘﺎﻟﻲ :
><body
><script
;))(document.write(hello
; )(function hello
{
;var r
"r="<b><i>"+اﻟﺴﻼم ﻋﻠﻴﻜﻢ ورﲪﺔ اﷲ وﺑﺮﻛﺎﺗﻪ ;">"+"</i></b
;return r
}
></Script
;))(document.write(hello
ﻟﻘﺪ ﻃﺒﻌﺖ أﻧﺎ اﻟﺘﺎﺑﻊ وﻛﺄﻧﻪ ﻣﺘﺤﻮل ﻋﺎدي ،وﻓﻌﻼً ﻫﻮ أﺻﺒﺢ ﻣﺜﻞ ﻣﺘﺤﻮل ﻋﺎدي وﺧﺰن ﺑﺪاﺧﻠﻪ
ﻗﻴﻤﺔ اﻟﻤﺘﺤﻮل r
أرﺟﻮا أن ﻳﻜﻮن اﻟﺒﺮﻧﺎﻣﺞ ﺳﻬﻞ وأن ﺗﻜﻮن اﻟﻔﻜﺮة ﻗﺪ وﺻﻠﺖ ..
><body
><script
;))"document.write(hello("mofakfree
; )function hello(text
{
;"*********" return "********" + text +
}
></Script
><body
><script
;))"document.write(hello("<i>","</i>","mofakfree@hotmail.com
; )function hello(tag1,tag2,text
{
;return tag1 + text + tag2
}
></Script
www.Arab-Team.com
ﻫﺬا اﻟﺘﺎﺑﻊ ) اﻟﻮﻇﻴﻔﺔ ( ﻳﻘﺒﻞ وﺳﻴﻄﺎت وﻳﺮﺟﻊ ﻗﻴﻤﺔ وﻫﻲ ﻛﻮد htmlﻣﻨﺴﻖ ﺟﺎﻫﺰ.......
أرﺟﻮا أن ﺗﻜﻮن اﻷﻣﺜﻠﺔ ﻛﺎﻓﻴﺔ وواﻓﻴﺔ ....وإن ﺷﺎء اﷲ ﺳﻨﺘﺪرب اﻟﻜﺜﻴﺮ ﻋﻠﻰ اﻟﻮﻇﺎﺋﻒ ﻣﻦ ﺧﻼل
اﻟﺪروس اﻟﻘﺎدﻣﺔ...
www.Arab-Team.com
اﻟﺪرس اﻟﺴﺎﺑﻊ
اﻟﺴﻼم ﻋﻠﻴﻜﻢ ورﺣﻤﺔ اﷲ وﺑﺮﻛﺎﺗﻪ :
ﻟﻘﺪ أﻧﻬﻴﻨﺎ ﻋﻤﻠﻨﺎ ﻣﻊ اﻟﻮﻇﺎﺋﻒ ﻓﻲ اﻟﺪرس اﻟﻤﺎﺿﻲ وذﻛﺮﻧﺎ أﻧﻮاع اﻟﻮﻇﺎﺋﻒ اﻟﺘﻲ :
-١ﻇﺎﺋﻒ اﻟﻌﺎدﻳﺔ ...اﻟﺘﻲ ﺗﻨﻔﺬ ﻛﻮد ﻓﻘﻂ ..وﻳﺘﻢ اﺳﺘﺪﻋﺎﺋﻬﺎ ﺑﻜﺘﺎﺑﺔ إﺳﻤﻬﺎ ﻓﻘﻂ.
-٢اﻟﻮﻇﺎﺋﻒ اﻟﺘﻲ ﺗﺄﺧﺬ وﺳﻴﻄﺎت ....وﻧﺴﺘﺪﻋﻴﻬﺎ ﺑﻜﺘﺎﺑﺔ إﺳﻤﻬﺎ وﻛﺘﺎﺑﺔ اﻟﺒﺮاﻣﺘﺮات )اﻟﻮﺳﻴﻄﺎت(
ﺑﻴﻦ ﻗﻮﺳﻴﻦ.
-٣اﻟﻮﻇﺎﺋﻒ اﻟﺘﻲ ﺗﺮﺟﻊ ﻗﻴﻤﺔ ﺑﺪون أن ﺗﺄﺧﺬ أي ﺑﺮاﻣﺘﺮات.
-٤اﻟﻮﻇﺎﺋﻒ اﻟﺘﻲ ﺗﺮﺟﻊ ﻗﻴﻤﺔ ﻣﻊ وﺟﻮد ﺑﺮاﻣﺘﺮات.
وإن ﺷﺎء اﷲ ﻛﻤﺎ ﻗﻠﻨﺎ أﻧﻪ ﺳﻴﺘﻢ اﻟﺘﺪرب ﻋﻠﻰ اﻟﻮﻇﺎﺋﻒ ﺧﻼل ﻛﻞ درس ﻣﻦ اﻟﺪورة.
اﻟﻴﻮم ﺳﻨﺘﺤﺪث ﻋﻦ أﻫﻢ ﻣﻮﺿﻮع ﻣﻦ ﻣﻮاﺿﻴﻊ اﻟﺒﺮﻣﺠﺔ ..وﻫﻮ اﻟﻌﺒﺎرات اﻟﺸﺮﻃﻴﺔ ..
وﺑﺪون اﻟﻌﺒﺎرات اﻟﺸﺮﻃﻴﺔ ﻻﻳﺴﺘﻄﻴﻊ اﻟﻜﻤﺒﻴﻮﺗﺮ اﻟﺘﺨﺎﻃﺐ ﻣﻊ اﻹﻧﺴﺎن واﻟﺘﻔﺎﻋﻞ ﻣﻌﻪ ..
ﻋﻠﻰ ﺳﺒﻴﻞ اﻟﻤﺜﺎل أرﻳﺪ أﻧﺎ إﻇﻬﺎر ﺻﻮت ﻣﻌﻴﻦ ﻓﻲ اﻟﺴﺎﻋﺔ اﻟﺨﺎﻣﺴﺔ ﻣﺴﺎء وﻓﻲ اﻟﺴﺎﻋﺔ
اﻟﺴﺎدﺳﺔ أرﻳﺪ أ ،أﺟﻠﺐ اﻟﺒﺮﻳﺪ ...وﻓﻲ اﻟﺴﺎﻋﺔ اﻟﻌﺎﺷﺮة أرﻳﺪ ﻣﻦ اﻟﺠﻬﺎز أن ﻳﺸﻐﻞ ﻣﺘﻔﻘﺢ
اﻷﻗﺮاص SCANDISKوﻓﻲ اﻟﺤﺎدﻳﺔ ﻋﺸﺮ أرﻳﺪ ﻣﻦ اﻟﺤﺎﺳﺐ اﻟﺘﻮﻗﻒ ﻋﻦ اﻟﻌﻤﻞ ؟ ﻛﻴﻒ أﻧﻔﺬ
ذﻟﻚ ؟ ﻫﻞ أﺿﻊ أﻧﺎ ﻣﻮﻇﻒ ﺧﺎص ﻟﻬﺬه اﻷﻣﻮر ؟ أم ﻣﺎذا ؟
اﻟﺠﻮاب ﻻ ؟ اﻟﺤﻞ ﻓﻲ ﺗﻌﻠﻢ اﻟﻌﺒﺎرات اﻟﺸﺮﻃﻴﺔ وﺗﻌﻠﻢ ﻟﻐﺔ ﺑﺮﻣﺠﺔ ﻟﻜﻲ ﺗﻄﺒﻖ اﻟﻌﺒﺎرات اﻟﺸﺮﻃﻴﺔ
ﺑﺪاﺧﻠﻬﺎ ؟
ﻃﺒﻌﺎً اﻟﻘﺼﺔ اﻟﺘﻲ ﺳﺮدﺗﻬﺎ ﻣﻨﺬ ﻗﻠﻴﻞ ﻟﻴﺴﺖ ﻣﻦ إﻣﻜﺎﻧﻴﺔ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ أو ﺑﺎﻷﺣﺮى ﻟﻴﺴﺖ ﻣﻦ
اﺧﺘﺼﺎﺻﻬﺎ...
اﻵن ﺳﻨﺪﺧﻞ إﻟﻰ أول ﻣﺜﺎل ﻟﻠﻌﺒﺎرت اﻟﺸﺮﻃﻴﺔ وﻣﻦ ﺛﻢ ﺑﻌﺪ ﺳﻨﺸﺮح ﺑﺎﻟﺘﻔﺼﻴﻞ ﻏﻴﺮ اﻟﻤﻤﻞ ﺑﺈذن
اﷲ ﺗﻌﺎﻟﻰ..
><body
><script
;var a
;)"ﻣﻦ ﻓﻀﻠﻚ أدﺧﻞ اﻟﻌﻼﻣﺔ"(a=prompt
)'if (a=='10
{
;)"ﳑﺘﺎز"( document.write
}
></Script
ﺑﻜﻞ إﺧﺘﺼﺎر ﻫﺬا اﻟﻤﺜﺎل إذا ﻛﺎن اﻟﻤﺘﺤﻮل ﺗﺴﺎوي ﻗﻴﻤﺘﻪ ١٠ﻓﻴﻄﺒﻊ اﻟﺒﺮﻧﺎﻣﺞ درﺟﺔ ﻣﻤﺘﺎز ..
ﺟﺮب أن ﻻﺗﻜﺘﺐ ﻟﻪ ﺷﻲ ؟ ﻓﻤﺎ ﻳﺤﺼﻞ ؟ ﺑﺎﻟﺘﺄﻛﻴﺪ ﻟﻦ ﻳﻄﺒﻊ ﺷﺊ ﻷﻧﻪ ﻟﻢ ﻳﺤﻘﻖ اﻟﺸﺮط ..
www.Arab-Team.com
)if (condition
{
ﺟﻮاب اﻟﺸﺮط اﻷول
ﺟﻮاب اﻟﺸﺮط اﻟﺜﺎﻧﻲ
....اﱁ
}
)if (condition
ﺟﻮاب اﻟﺸﺮط اﻷول
><body
><script
;var a
"(a=promptﻣﻦ ﻓﻀﻠﻚ أدﺧﻞ اﻟﻌﻼﻣﺔ;)"
)'if (a=='10
"( document.writeﳑﺘﺎز;)"
></Script
== ﻟﻠﻤﺴﺎواة
< أﻛﺒﺮ
> أﺻﻐﺮ
=! ﻻﺗﺴﺎوي
=< أﻛﺒﺮ أو ﺗﺴﺎوي
=> أﺻﻐﺮ أو ﺗﺴﺎوي
-٤ﻳﻤﻜﻦ دﻣﺞ اﻟﻌﺪﻳﺪ ﻣﻦ اﻟﺸﺮوط ﻓﻤﺜﻼً ﻳﺠﺐ اﻟﻄﺎﻟﺐ أن ﻳﻜﻮن ﺣﺎﺻﻞ ﻋﻠﻰ اﻟﻌﻼﻣﺔ ﻋﺸﺮة ١٠
وﺳﺎﻛﻦ ﻣﺜﻼً ﻓﻲ اﻟﺴﻌﻮدﻳﺔ.
وﻫﺬا ﻣﺎﺳﻨﺄﺧﺬه ﻓﻲ اﻟﺪرس اﻟﻘﺎدم ﺑﺈذن اﷲ ﺗﻌﺎﻟﻰ...
www.Arab-Team.com
ﻟﻘﺪ أﺧﺬﻧﺎ اﻟﺼﻴﻐﺔ اﻷوﻟﻰ ﻟﻠﻌﺒﺎرت اﻟﺸﺮﻃﻴﺔ واﻵن ﺳﻮف ﻧﻨﺘﻘﻞ إﻟﻰ اﻟﺼﻴﻐﺔ اﻟﺜﺎﻧﻴﺔ ﻟﻠﻌﺒﺎرات
اﻟﺸﺮﻃﻴﺔ.
)if (condition
{
ﻫﺬا اﻟﻜﻮد ﻫﻨﺎ ﻳﻨﻔﺬ ﰲ ﺣﺎل ﲢﻘﻖ اﻟﺸﺮط
}
else
{
ﻫﺬا اﻟﻜﻮد ﻳﻨﻔﺬ ﰲ ﺣﺎل ﻋﺪم ﲢﻘﻖ اﻟﺸﺮط
}
ﻣﺜﺎل :
><body
><script
;var pass
"(pass=promptﻣﻦ ﻓﻀﻠﻚ أدﺧﻞ أدﺧﻞ ﻛﻠﻤﺔ اﻟﺴﺮ;)"
)'if (pass=='123
"( document.writeﻛﻠﻤﺔ اﻟﺴﺮ ﺻﺤﻴﺤﺔ;)"
else
"( document.writeﻛﻠﻤﺔ اﻟﺴﺮ ﻏﲑ ﺻﺤﻴﺤﺔ;)"
></Script
إذا أدﺧﻞ اﻟﻤﺴﺘﺨﺪم ﻛﻠﻤﺔ اﻟﺴﺮ ﺻﺤﻴﺤﺔ ﺗﻄﺒﻊ اﻟﻌﺒﺎرة اﻟﻤﺤﺪدة وإذا ﻟﻢ ﺗﻜﻦ ﺻﺤﻴﺤﺔ ﺗﻄﺒﻊ
اﻟﻌﺒﺎرة اﻟﻤﺤﺪدة ﻟﺬﻟﻚ.
وﻫﺬا ﺗﻮﻓﺮ ﻋﻠﻴﻚ ﻛﺘﺎﺑﺔ ﺟﻤﻠﺔ ﺷﺮﻃﻴﺔ أﺧﺮى ﺑﻜﺘﺎﺑﺔ""else
اﻵن ﺳﻨﻄﻮر اﻟﻤﺜﺎل اﻟﺴﺎﺑﻖ اﻟﺬي أﺧﺬﻧﺎه ﻓﻲ اﻟﺪرس اﻟﺴﺎﺑﻖ إﻟﻰ ﻧﻤﻂ ﻣﻄﻮر وذﻛﻲ...
اﻟﻜﻮد :
><body
><script
;))"document.write(hello("<i>","</i>","mofakfree@hotmail.com
; )function hello(tag1,tag2,text
{
;return tag1 + text + tag2
}
></Script
><body
><script
;)"اﻟﻨﺺ اﻟﺮﺟﺎء أدﺧﻞ"(text=prompt
;)"اﻟﻨﻤﻂ أدﺧﻞ"(x=prompt
;))document.write(hello(x,text
www.Arab-Team.com
; )function hello(type,text
{
)"if (type=="b
;">return "<b>" + text + "</b
)"if (type=="i
;">return "<i>" + text + "</i
}
; ></Script
اﻵن ﺳﻨﻜﻤﻞ ﻣﺸﻮار اﻟﻌﺒﺎرات اﻟﺸﺮﻃﻴﺔ ﻣﻊ ﻧﻤﻂ ﺟﺪﻳﺪ ﻟﻬﺎ ،وﻟﻬﺎ ﻫﻲ ﺛﻼﺛﺔ ﺻﻴﻎ وﻟﻘﺪ أﺧﺬﻧﺎ
ﺻﻴﻐﺘﻴﻦ وﻫﻤﺎ :
)if (condition
{
ﺟﻮاب اﻟﺸﺮط
}
)if (condition
{
ﺟﻮاب اﻟﺸﺮط
}
else
{
اﻟﻜﻮد ﰲ ﺣﺎل ﻋﺪم ﲢﻘﻖ اﻟﺸﺮط
}
)if(condition 1
}{
)else if (condition 2
}{
)else if (condition 3
}{
www.Arab-Team.com
واﻵن ﺳﻨﻄﺒﻖ ﻣﺜﺎل ﻋﻤﻠﻲ ﻋﻦ ﻫﺬه اﻟﺼﻴﻐﺔ :
><body
><script
;var t
;)"t=prompt("please Enter number
;)) " + mofak(tأﻧﺖ ﻛﺘﺒﺖ اﻟﺮﻗﻢ "(document.write
; )function mofak(num
{
;"واﺣﺪ" if (num=="1") return
;"اﺛﻨﺎن" else if(num=="2") return
;"ﺛﻼﺛﺔ" else if(num=="3") return
;"أرﺑﻌﺔ" else if(num=="4") return
;"ﲬﺴﺔ" else if(num=="5") return
;"ﺳﺘﺔ" else if(num=="6") return
;"ﺳﺒﻌﺔ" else if(num=="7") return
;"ﲦﺎﻧﻴﺔ" else if(num=="8") return
;"ﺗﺴﻌﺔ" else if(num=="9") return
;"ﻋﺸﺮة" else if(num=="10") return
}
></Script
أرﺟﻮا أن ﻳﻜﻮن اﻟﻤﺜﺎل ﻣﻔﻬﻮم وﻧﻜﻮن ﺑﻬﺬا ﻗﺪ أﻧﻬﻴﻨﺎ ﺻﻴﻎ اﻟﻌﺒﺎرات اﻟﺸﺮﻃﻴﺔ
ﺑﺲ ﻧﺴﻴﺖ أن أﻗﻮل ﻟﻜﻢ أن اﻟﻤﻤﺎرﺳﺔ وﻛﺜﻴﺮة اﻟﺘﻄﺒﻴﻘﺎت ﻋﻠﻰ اﻟﻌﺒﺎرات اﻟﺸﺮﻃﻴﺔ ﺗﻜﻮن ﻋﻨﺪك
ﻣﻬﺎراة ﻓﻲ ﺑﻨﺎء اﻟﺒﺮاﻣﺞ...
ﻃﺒﻌﺎً ﻳﻮﺟﺪ ﺑﻌﺾ اﻷﻣﻮر ﻳﺠﺐ ﻋﻠﻴﻚ ﺗﻨﻔﻴﺬﻫﺎ ﺣﺘﻰ اﻟﺪرس اﻟﻘﺎدم:
اﻛﺘﺐ ﺑﺮﻧﺎﻣﺞ ﻟﺤﻞ ﻣﻌﺎدﻟﺔ ﻣﻦ اﻟﺪرﺟﺔ اﻟﺜﺎﻧﻴﺔ ﻃﺒﻌﺎً ﺑﺎﻹﻋﺘﻤﺎد ﻋﻠﻰ اﻟﻮﻇﺎﺋﻒ أي function
واﻟﻌﺒﺎرات اﻟﺸﺮﻃﻴﺔ ..........ﻣﻊ ﻋﺪم إﺳﺘﺨﺪام أي ﺷﺊ ﻟﻢ ﻧﺴﺘﺨﺪﻣﻪ إﻟﻰ اﻵن...
ﻳﻌﻨﻲ ﻓﻘﻂ ﺑﺎﻷﻣﻮر اﻟﺘﻲ أﺧﺬﻧﺎﻫﺎ.....
www.Arab-Team.com
اﻟﺪرس اﻟﺜﺎﻣﻦ
switch
وأﻗﺼﺪ ب j1و j2و j3ﺑﺠﻮاب اﻟﺸﺮط اﻷول وﺟﻮاب اﻟﺸﺮط اﻟﺜﺎﻧﻲ وﺟﻮاب اﻟﺸﺮط اﻟﺜﺎﻟﺚ ..اﻟﺦ
><body
><script
;var t
;)"t=prompt("please Enter number
;)) " + mofak(tأﻧﺖ ﻛﺘﺒﺖ اﻟﺮﻗﻢ "(document.write
; )function mofak(num
{
;"واﺣﺪ" if (num=="1") return
;"اﺛﻨﺎن" else if(num=="2") return
;"ﺛﻼﺛﺔ" else if(num=="3") return
;"أرﺑﻌﺔ" else if(num=="4") return
;"ﲬﺴﺔ" else if(num=="5") return
;"ﺳﺘﺔ" else if(num=="6") return
;"ﺳﺒﻌﺔ" else if(num=="7") return
;"ﲦﺎﻧﻴﺔ" else if(num=="8") return
;"ﺗﺴﻌﺔ" else if(num=="9") return
;"ﻋﺸﺮة" else if(num=="10") return
}
></Script
www.Arab-Team.com
: واﻵن ﺳﻴﺼﺒﺢ اﻟﻤﺜﺎل ﺑﺎﻟﺸﻜﻞ اﻟﺘﺎﻟﻲ
<HTML>
<script>
var t;
t=prompt("please Enter number");
document.write(" " أﻧﺖ ﻛﺘﺒﺖ اﻟﺮﻗﻢ+ mofak(t));
function mofak(num) ;
{
switch(num) ; {
case "1" : ; return ";"واﺣﺪ
case "2" : ;return ";"اﺛﻨﺎن
case "3" : return ";"ﺛﻼﺛﺔ
case "4" : return ";"أرﺑﻌﺔ
case "5" : return ";"ﲬﺴﺔ
case "6" : return ";"ﺳﺘﺔ
case "7" : return ";"ﺳﺒﻌﺔ
case "8" : return ";"ﲦﺎﻧﻴﺔ
case "9" : return ";"ﺗﺴﻌﺔ
case "10" : return ";"ﻋﺸﺮة
}
}
</Script>
</HTML>
.... ﻟﻘﺪ وﻓﺮ ﻋﻠﻴﻨﺎ ﻫﺬا اﻟﻜﻮد اﻟﻜﺜﻴﺮ ﻣﻦ اﻟﻜﻠﻤﺎت وﺷﻜﻠﻪ ﻣﻨﻈﻢ أﻛﺜﺮ وأﺳﻬﻞ ﻟﻠﻘﺮاءة واﻟﻔﻬﻢ
ﻣﻼﺣﻈﺔ ﻋﻠﻰ ﺷﺎن اﻷﻛﻮاد اﻟﺘﻲ ﻓﻲ اﻷﻋﻠﻰ
اﻟﺘﻲ ﻫﻲ ﻣﺜﻞ
www.Arab-Team.com
اﻟﺪرس اﻟﺘﺎﺳﻊ
اﻟﻴﻮم ﺳﻨﺒﺪأ ﻓﻲ درس ﺟﺪﻳﺪ وﻫﻮ " اﻟﺤﻠﻘﺎت " Loop .وﻻ ﻧﻘﺪر أن ﻧﺼﺒﺢ ﻗﺎدرﻳﻦ ﻋﻠﻰ ﺑﻨﺎء
ﺑﺮﻧﺎﻣﺞ ﻣﺘﻜﺎﻣﻞ ﺑﺪون اﻟﺤﻠﻘﺎت..
وإن ﺷﺎء اﷲ ﺗﻌﺎﻟﻰ ﺳﺄﻗﻮم ﺑﺸﺮح أول ﻧﻮع ﻣﻦ اﻟﺤﻠﻘﺎت ﻓﻲ ﻫﺬا اﻟﺪرس وﻫﻮ اﻟﺤﻠﻘﺔ ، for
وﻃﺒﻌﺎً ﺑﺲ ﻓﻬﻤﻨﺎ اﻟﺤﻠﻘﺔ forﺑﻘﻴﺔ اﻟﺤﻠﻘﺎت ﺗﺼﺒﺢ ﻋﺎدﻳﺔ ﺟﺪاً...
واﻟﺤﻠﻘﺎت ﻣﻬﻤﺔ ﺟﺪاً ﻓﻲ اﻟﺒﺮاﻣﺞ ،وﻣﻦ اﻟﻤﺴﺘﺤﻴﻞ أن ﺗﺠﺪ ﺳﻜﺮﺑﺖ أو ﺑﺮﻧﺎﻣﺞ ﺑﺪون وﺟﻮد
ﺣﻠﻘﺎت....
For
)for(a;b;c
{
n
}
)for(i=1;i<=3;i++
{
;)"alert("welcome
}
www.Arab-Team.com
اﻵن ﺳﻨﻜﺘﺐ ﻣﺜﺎل ﻳﻄﺒﻊ ﻟﻨﺎ ﻋﻠﻰ ﻧﺎﻓﺬة اﻟﻤﺘﺼﻔﺢ أرﻗﺎم ﻣﻦ اﻟﻮاﺣﺪ ﺣﺘﻰ اﻟﻌﺸﺮة:
><HTML
><script
)for(i=1;i<=10;i++
{
;)document.write(i
}
></Script
></HTML
ﻣﺜﺎل ﻳﻄﺒﻊ ﻋﺸﺮة أرﻗﺎم وﻟﻜﻦ ﻣﻊ ﻓﺎﺻﻞ ﺑﻴﻦ اﻟﺮﻗﻢ واﻟﺮﻗﻢ ﻋﻼﻣﺔ "*" :
><HTML
><script
)for(i=1;i<=10;i++
{
;)"*"document.write(i+
}
></Script
></HTML
ﻻﺣﻆ ﻇﻬﻮر اﻟﻨﺠﻤﺔ ﻓﻲ اﻟﻨﻬﺎﻳﺔ ﻣﻊ أﻧﻪ ﻻﻳﻮﺟﺪ رﻗﻢ ﺑﻌﺪﻫﺎ وﻟﺘﻼﻓﻲ اﻟﻤﺸﻜﻠﺔ ﻧﻀﻊ ﻋﺒﺎرة
ﺷﺮﻃﻴﺔ ﻛﻤﺎ ﻓﻲ اﻟﻤﺜﺎل اﻟﺘﺎﻟﻲ:
><HTML
><script
)for(i=1;i<=10;i++
{
)if(i!=10
;)"*"document.write(i+
else
;)document.write(i
}
www.Arab-Team.com
></Script
></HTML
ﻣﺜﺎل ﻳﻄﺒﻊ اﻷرﻗﺎم ﻣﻦ واﺣﺪ إﻟﻰ ﻋﺸﺮة وﻟﻜﻦ ﺑﺎﻟﻤﻘﻠﻮب ﻣﻦ ﻋﺸﺮة إﻟﻰ اﻟﻮاﺣﺪ:
><HTML
><script
)for(i=10;i>=1;i--
{
;)document.write(i
}
></Script
></HTML
وﻻﺣﻆ إﺧﺘﻼف ﺷﺮط إﻧﺘﻬﺎء اﻟﺤﻠﻘﺔ وﻻﺣﻆ أﻳﻀﺎً اﺧﺘﻼف ﺑﺪاﻳﺔ اﻟﻤﺘﺤﻮل وﻧﻬﺎﻳﺔ اﻟﻤﺘﺤﻮل...
ﻣﺜﺎل ﻳﻄﺒﻊ اﻷرﻗﺎم ﻣﻦ واﺣﺪ إﻟﻰ ﻋﺸﺮة وﻟﻜﻦ ﺑﺎﻟﻤﻘﻠﻮب ﻣﻦ ﻋﺸﺮة إﻟﻰ اﻟﻮاﺣﺪ وﻟﻜﻦ ﻣﻊ ﻓﺎﺻﻞ
ﺑﺨﻂ html
><HTML
><script
)for(i=10;i>=1;i--
{
;)">document.write(i+"<hr
}
></Script
></HTML
ﻻﺣﻆ أﻧﻨﺎ أﺿﻔﻨﺎ اﻟﺘﺎغ > <hrﻓﻘﻂ ...إذا ﻗﻤﻨﺎ ﺑﺘﻮﻟﻴﺪ ﻛﻮد htmlﻣﻦ ﺧﻼل اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ وأﻫﺬه
أﻛﺜﺮ ﻣﻴﺰة ﺳﻨﺮﻛﺰ ﻋﻠﻴﻬﺎ ﻓﻲ اﻟﺤﻠﻘﺎت ....ﻷﻧﻬﺎ ﺗﻬﻤﻨﺎ ﻓﻲ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ وال phpوال aspوﺑﻜﻞ
ﻟﻐﺎت اﻟﻮﻳﺐ...
www.Arab-Team.com
اﻟﺪرس اﻟﻌﺎﺷﺮ
ﺳﻨﺘﺎﺑﻊ اﻟﻴﻮم ﻣﺴﻴﺮﻧﺎ ﻣﻊ اﻟﺤﻠﻘﺎت ،اﻟﻴﻮم درﺳﻨﺎ ﻛﻠﻬﺎ أﻣﺜﻠﺔ ﻋﻤﻠﻴﺔ ﻋﻦ اﻟﺤﻠﻘﺎت ..
اﻟﻤﺜﺎل اﻷول :اﻛﺘﺐ ﺳﻜﺮﺑﺖ ﻳﻘﻮم ﺑﻄﺒﺎﻋﺔ ﻋﺒﺎرة "ﺑﺴﻢ اﷲ اﻟﺮﺣﻤﻦ اﻟﺮﺣﻴﻢ"
ﺳﺖ ﻣﺮات أول ﻣﺮة ﺑﺎﻟﺤﺠﻢ اﻟﻜﺒﻴﺮ وﺛﺎﻧﻲ ﻣﺮة ﺑﺎﻟﺤﺠﻢ اﻷﺻﻐﺮ ....اﻟﺦ ﻳﻌﻨﻲ اﻟﻌﺒﺎرة اﻷﺧﻴﺮة
ﺑﺤﺠﻢ أﺻﻐﺮ ﺷﻲ.
واﻟﻔﻜﺮة ﺗﻌﺘﻤﺪ ﻋﻠﻰ اﻟﺘﺎغ > <hnﻓﻲ htmlو nﻫﻲ رﻗﻢ اﻟﺨﻂ أﻛﺒﺮه><h1
اﻟﺴﻜﺮﺑﺖ :
><HTML
><body
><script
)for(i=1;i<=6;i++
{
ﺑﺴﻢ اﷲ اﻟﺮﲪﻦ" document.write("<h" + ;i +">"+
;)">""+"</h"+i+اﻟﺮﺣﻴﻢ
}
></Script
></body
></HTML
><HTML
><body
><script
;var t=40
; )for(i=1;i<=12;i++
{
;t=t-4
)for(y=0;y<=t;y++
;)"*"(document.write
;)">document.write("<br
}
www.Arab-Team.com
></Script
></body
></HTML
ﻫﺬا اﻟﻜﻮد ﻗﺪ دﺧﻠﺖ ﺣﻠﻘﺘﻴﻦ ﻣﻌﺎً ...وﻟﺤﻞ ﻫﺬه اﻟﺘﻤﺎرﻳﻦ أﺳﻬﻞ ﺷﺊ ﻫﻮ ﺗﺒﺴﻴﻂ اﻟﻤﺴﺄﻟﺔ
وﻳﺘﻢ ﺗﺒﺴﻴﻂ اﻟﻤﺴﺄﻟﺔ ﻛﺎﻟﺘﺎﻟﻲ:
أﻧﺎ أرﻳﺪ أن أﻃﺒﻊ ١٢ﺻﻒ ﻣﻦ اﻟﻨﺠﻢ وﻟﻌﻤﻞ ﻫﺬا ﻳﺠﺐ أن أﻛﺘﺐ ﺣﻠﻘﺔ ﺗﻄﺒﻊ ذﻟﻚ
ﺛﻢ أرﻳﺪ أن أرﺳﻢ ﻓﻲ أول ﺻﻒ ٤٠ﻧﺠﻤﺔ واﻟﺼﻒ اﻟﺜﺎﻧﻲ ٣٥ﻧﺠﻤﺔ وﻫﻜﺬا ..ﻓﺄﻛﺘﺐ ﺑﺤﻠﻘﺔ ﺛﺎﻧﻴﺔ
ﺷﺮط اﻟﺘﻮﻗﻒ ﺗﺒﻬﺎ ﻫﻮ ﻋﺒﺎرة ﻋﻦ ﻣﺘﺤﻮل tوﻳﺘﻢ إﻧﻘﺎص اﻟﻤﺘﺤﻮل tﻓﻲ ﻛﻞ دورة ﻣﻦ اﻟﺤﻠﻘﺔ
><HTML
><body
><script
;var t=-1
; )for(i=1;i<=16;i++
{
;t=t+1
)for(y=0;y<=t;y++
;)"*"(document.write
;)">document.write("<br
}
></Script
></body
></HTML
وﻫﻜﺬا أﺗﻤﻨﻰ أن ﺗﻜﻮﻧﻮا ﻗﺪ اﺳﺘﻔﺪﺗﻢ ﻣﻦ ﻫﺬه اﻟﺘﻤﺎرﻳﻦ وإن ﺷﺎء اﷲ ﺳﻨﻜﻤﻞ ﻓﻲ دروس
اﻟﺴﺎﺑﻘﺔ.............
www.Arab-Team.com
اﻟﺪرس اﻟﺤﺎدي ﻋﺸﺮ
وﺻﻠﻨﺎ ﻓﻲ اﻟﺪرس اﻷﺧﻴﺮ ﻟﺘﻄﺒﻴﻘﺎت ﻋﻤﻠﻴﺔ ﻓﻲ اﻟﺤﻠﻘﺎت وﺗﻮﻟﻴﺪ ﻛﻮد htmlﻣﻦ ﺧﻼل اﻟﺤﻠﻘﺎت
وﻟﻘﺪ ﺗﻜﻠﻤﻨﺎ ﻋﻦ اﻟﺤﻠﻘﺔ forواﻟﻴﻮم ﺳﻨﺄﺧﺬ اﻟﻌﺪﻳﺪ ﻣﻦ اﻷﻣﺜﻠﺔ:
ﺧﻄﻮات اﻟﻌﻤﻞ أدرج ﺟﺪول ﻣﻦ ﻋﻤﻮدﻳﻦ وﺻﻒ واﺣﺪ ﻓﻲ اﻟﻔﺮوﻧﺖ ﺑﻴﺞ .
ﻃﻴﺐ أﻧﺎ أرﻳﺪ اﻵن أﻧﻪ أﺛﻨﺎء ﺗﺤﻤﻴﻞ اﻟﺼﻔﺤﺔ ﻛﺘﺎﺑﺔ ﺟﺪول ﺑﻌﻤﻮدﻳﻦ وﻟﻜﻦ ﺑﻌﺪد أﻧﺎ أﺣﺪده ﻣﻦ
اﻟﺼﻔﻮف..
><tr
><td width="50%">;</td
><td width="50%">;</td
>;</tr
ﻃﻴﺐ ﺳﺄﻛﺘﺐ ﻟﻜﻢ اﻟﻤﺜﺎل اﻟﺘﺎﻟﻲ ﻛﺎﻣﻼً ﻓﻲ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ وأﻧﺘﻢ ﺣﺎوﻟﻮا أن ﺗﻄﻮر اﻟﺘﻤﺮﻳﻦ وﺗﺠﺮﺑﻮ
ﺗﻤﺎرﻳﻦ أﻛﺜﺮ :
><script
document.write("<table border=1 cellpadding=0 cellspacing=0
style=border-collapse: collapse bordercolor=#111111
;)">width=100%
; )for(i=1;i<=20;i++
{
document.write("<tr>"+
">"<td width=50%>;</td +
">"<td width=50%>;</td +
www.Arab-Team.com
;)">"</tr
}
; )">document.write("</table
></Script
ﻻﺣﻆ أﻧﻨﻲ ﻛﺘﺒﺖ ﺑﺪاﻳﺔ اﻟﺘﺎغ > <tableﻗﺒﻞ اﻟﺤﻠﻘﺔ ﻷﻧﻨﻲ ﻻأرﻳﺪ إدراﺟﻪ ﻏﻴﺮ ﻣﺮة واﺣﺪ .
أﻣﺎ ﻋﻦ اﻟﺘﺎغ > <trﻓﺈﻧﻨﻲ ﻗﻤﺖ ﻳﻮﺿﻌﺔ ﺿﻤﻦ اﻟﺤﻠﻘﺔ ﻷأﻧﻨﻲ أرﻳﺪ ﺗﻜﺮار اﻟﺼﻔﻮف..
أﻣﺎ ﺑﻌﺪ اﻟﺤﻠﻘﺔ ﻓﻮﺿﻌﺖ ﻧﻬﺎﻳﺔ اﻟﺘﺎغ></table
ﻣﻼﺣﻈﺎت :
-١إذا وﺟﺪت ﺑﻌﺾ اﻟﺼﻌﻮﺑﺔ ﻓﻲ ﺗﺎﻏﺎت htmlﻳﻌﻨﻲ ﻣﻌﺮﻓﺎﺗﻬﺎ > <tagﻓﻴﺠﺐ ﻋﻠﻴﻚ أن ﺗﻘﺮأ ﻋﻦ
اﻟــ htmlوﻣﻌﺮﻓﺎﺗﻬﺎ اﻟﻜﻔﺎﻳﺔ ،ﻷﻧﻨﺎ ﻓﻲ اﻟﺪروس اﻟﻘﺎدﻣﺔ ﺳﻨﺸﺮح ﻋﻦ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ وﻟﻦ أﺷﺮح
ﻋﻦ ﺗﺎﻏﺎت htmlﻷن ﻣﺘﺎﺑﻌﻲ اﻟﺪورة ﻳﺠﺐ أن ﻳﻜﻮﻧﻮا ﻳﻌﺮﻓﻮا اﻟـــhtml ....
-٢إذا أﻋﻄﺎﻛﻢ ﺧﻄﺎً ﻓﻲ ﺗﻨﻔﻴﺬ اﻟﺴﻜﺮﺑﺖ ﻓﻴﺠﺐ ﺣﺬف إﺷﺎرﺗﻲ اﻟﺘﻨﺼﻴﺺ ﻣﻦ ﻛﻮدhtml ..
ﺧﻠﻴﻬﺎ ﻓﻲ اﻟﺒﺎل داﺋﻤﺎً ﻫﺬه اﻟﻘﺎﻋﺪة:
== "" html +ﺗﻌﺎرض ﻓﻲ اﻟﻜﻮد
إذا اﺣﺬف ﻛﻞ إﺷﺎرات "" ﻣﻦ ﻛﻮد htmlﻷﻧﻪ ﻳﻌﻤﻞ ﻣﺸﺎﻛﻞ ﻓﻲ اﻟﻔﺼﻞ ﺑﻴﻦ ﻗﻄﻊ اﻟﻜﻮد.
وﻋﻠﻰ ﻓﻜﺮة ﻣﺎ ﺑﺲ ﻓﻲ ﺟﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻻ ﺑﻞ ﻓﻲ ﻛﻞ ﻟﻐﺎت اﻟﺒﺮﻣﺠﺔ اﻟﺘﻲ اﻟﺘﻲ ﺗﺘﺒﻊ أﺳﻠﻮب
object.write
><td width="50%">;</td
><td width=50%>;</td
أرﺟﻮا أن أﻛﻮن ﻗﺪ وﻓﻘﺖ ﻓﻲ إﻳﺼﺎل ﻫﺬه اﻟﻘﻜﺮة ﻷﻧﻬﺎ ﺿﺮوﻳﺔ إذا ﻛﻨﺎ ﻃﺎﻣﺤﻴﻦ ﻟﺘﻌﻠﻢ ﺟﺎﻓﺎ
ﺳﻜﺮﺑﺖ ﻋﻠﻰ أﺻﻮﻟﻬﺎ ...
www.Arab-Team.com
اﻟﺪرس اﻟﺜﺎﻧﻲ ﻋﺸﺮ
واﻟﻨﻬﺎﻳﺔ اﻟﻤﺴﺘﺨﺪم ﻳﺤﺪدﻫﺎ.. اﻛﺘﺐ ﺳﻜﺮﺑﺖ ﻳﻄﺒﻊ ﻣﻀﺎﻋﻔﺎت اﻟﻌﺪد ﺧﻤﺴﺔ ﻓﻲ ﺟﺪول:س
ﻣﻦ ﺧﻼل ﺻﻨﺪوق ﺣﻮار
...... وﻫﻜﺬا١٠٠ إﻟﻰ٥ ﻓﻴﻄﺒﻊ اﻟﺒﺮﻧﺎﻣﺞ ﻣﻦ١٠٠ ﻳﻌﻨﻲ ﻳﺪﺧﻞ اﻟﻤﺴﺘﺨﺪم
: اﻟﻜﻮد:ج
<script>
var num_last=prompt(" ﻣﻦ ﻓﻀﻠﻚ أدﺧﻞ١٠٠"،";)"اﻟﻌﺪد اﻷﺧﲑ
document.write("<table border=1 cellpadding=0 cellspacing=0
style=border-collapse: collapse bordercolor=#111111
width=100%>");
for(i=5;i<=num_last;i=i+5)
{
document.write("<tr>"+
"<td>" + i + "</td>" +
"</tr>");
}
document.write("</table>");
</Script>
: واﻵن ﺳﻮف ﻧﻄﻮر اﻟﻜﻮد ﺑﺤﻴﺚ اﻟﻤﺴﺘﺨﺪم ﻳﻜﺘﺐ اﻟﺮﻗﻢ اﻟﺬي ﻳﺮﻳﺪ ﻣﻀﺎﻋﻔﺘﻪ
<script>
var f=prompt(" ﻣﻦ ﻓﻀﻠﻚ أدﺧﻞ اﻟﺮﻗﻢ اﻟﺬي٢"،";)"ﺗﺮﻳﺪ ﻣﻀﺎﻋﻔﺘﻪ
var num_last=prompt(" ﻣﻦ ﻓﻀﻠﻚ أدﺧﻞ اﻟﻌﺪد١٠٠"،";)"اﻷﺧﲑ
document.write("<table border=1 cellpadding=0 cellspacing=0
style=border-collapse: collapse bordercolor=#111111
width=100%>");
for(i=Number(f);i<=num_last;i=i+Number(f))
{
document.write("<tr>"+
"<td>" + i + "</td>" +
"</tr>");
}
document.write("</table>");
</Script>
ﻫﺬا اﻟﻤﺜﺎل ﻳﻤﻜﻦ أن ﻳﻜﺘﺐ ﻣﺴﺘﺨﺪم اﻟﺼﻔﺤﺔ أن ﻳﻜﺘﺐ رﻗﻢ ﻳﺮﻳﺪ ﻣﻀﺎﻋﻔﺘﻪ و ﻳﺤﺪد أﻳﻀﺎً اﻟﻤﺠﺎل
.....ًأﻳﻀﺎ
..... وﻫﻲ داﻟﺔ ﻟﺘﺤﻮﻳﻞ اﻟﻨﺺ إﻟﻰ اﻟﺮﻗﻢNumber وﻟﻜﻦ أﻟﻢ ﺗﻼﺣﻈﻮا أﻧﻲ اﺳﺘﺨﺪﻣﺖ اﻟﻮﻇﻴﻔﺔ
www.Arab-Team.com
وﺑﺎﻷﺣﺮى ﺗﺠﻌﻞ اﻟﺘﻌﺎﻣﻞ ﻣﻊ اﻟﻤﺘﺤﻮل ﻋﻦ ﻃﺮﻳﻖ ﻗﻴﻤﺘﻪ ﻳﻌﻨﻲ"" ﻳﺘﻢ اﻟﺘﻌﺎﻣﻞ ﻣﻊ اﻟﻤﺘﺤﻮل ﻛﺄﻧﻪ
رﻗﻢ وﻟﻴﺲ ﻧﺺ""
ﻓﻠﻮ ﻟﻢ ﻧﺴﺘﺨﺪم ﻫﺬه اﻟﻮﻇﻴﻔﺔ ﻟﺘﻢ ﺟﻤﻊ ٢٢ = ٢ + ٢وﻟﻴﺲ 4وﻫﺬا ﻣﺎﻳﺠﻌﻞ ﺣﻠﻘﺔ اﻟﺘﻜﺮار
ﺗﻔﻮت ﺑﺎﻟﺤﻴﻂ....
س :أﻛﺘﺐ ﺳﻜﺮﺑﺖ ﻳﻄﺒﻊ ﻣﺠﻤﻮع اﻷرﻗﺎم ﻣﻦ اﻟﺼﻔﺮ إﻟﻰ اﻟﺮﻗﻢ اﻟﺬي ﻳﺤﺪده اﻟﻤﺴﺘﺨﺪم ﻳﻌﻨﻲ
ﻣﺘﻮاﻟﻴﺔ ..
ج:
><script
;)"اﻟﻌﺪد ﻣﻦ ﻓﻀﻠﻚ أدﺧﻞ"(var num=prompt
;var r=0
)for(x=0;x<=num;x++
;r=r+x
;)document.write(r
></Script
ﻻﺣﻆ أﻧﻨﻲ اﺳﻨﺪت ﻗﻴﻤﺔ ٠ﻋﻨﺪ ﺗﻌﺮﻳﻒ اﻟﻤﺘﺤﻮل ، rﻷن اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻻﺗﻌﻄﻲ ﻗﻴﻤﺔ ﻟﻠﻤﺘﺤﻮل
ﻋﻨﺪ ﺗﻌﺮﻳﻒ إﻻ اﻟﻘﻴﻤﺔ NANوإذا ﻟﻢ أﺳﻨﺪ رﻗﻢ اﻟﺼﻔﺮ ﻻﻧﻘﺪر أن ﻧﺠﻤﻊ اﻟﻘﻴﻤﺔ nanﻣﻊx ...
www.Arab-Team.com
اﻟﺪرس اﻟﺜﺎﻟﺚ ﻋﺸﺮ
اﻟﻴﻮم ﺳﻨﻨﻬﻲ اﻟﻌﻤﻞ ﻣﻊ اﻟﺤﻠﻘﺎت ﺑﺈﺳﺘﻌﺮاض ﻧﻤﻮذﺟﻴﻦ ﺟﺪد ﻟﻠﺤﻘﺎت اﻟﺘﻜﺮار..
اﻟﻨﻤﻮذج اﻷول:
ﺣﻠﻘﺔ Whileوﻫﺬه اﻟﺤﻠﻘﺔ ﺗﺪﻣﺞ ﻣﺎﺑﻴﻦ اﻟﻌﺒﺎرة اﻟﺸﺮﻃﻴﺔ وﺣﻠﻘﺔ اﻟﺘﻜﺮار ..
وﻟﻔﻬﻤﺎ ﺑﺸﻜﻞ ﺳﺮﻳﻊ ﺳﺄﺿﺮب ﻣﺜﺎل وﻟﻜﻦ ﻗﺒﻞ اﻟﻤﺜﺎل ﺳﺄﻛﺘﺐ اﻟﺼﻴﻐﺔ اﻟﻌﺎﻣﺔ:
اﻟﺼﻴﻐﺔ اﻟﻌﺎﻣﺔ:
)while(condition
{
code
}
اﻟﻤﺜﺎل :
><script
;var i=0
)while(i<=10
{
;)">document.write(i+"<br
;i++
}
></Script
ﻫﺬا اﻟﻤﺜﺎل ﻳﻄﺒﻊ اﻷرﻗﺎم ﻣﻦ واﺣﺪ إﻟﻰ ﻋﺸﺮةو ﻟﻘﺪ ﻓﺴﺪت اﻟﺤﻠﻘﺔ ﻓﻲ ﺣﻴﻦ أن اﻟﻤﺘﺤﻮل iﻗﺪ
أﺻﺒﺢ أﻛﺒﺮ ﻣﻦ ﻋﺸﺮة .ﻳﻌﻨﻲ ﺑﺈﺧﺘﺼﺎر اﻟﺤﻠﻘﺔ ﺗﺴﺘﻤﺮ ﻃﺎﻟﻤﺎ iأﺻﻐﺮ ﻣﻦ ﻋﺸﺮة...
وﻻﺣﻈﻮا أﻧﻨﻲ ﻓﻲ ﻛﻞ دورة ﻟﻠﺤﻠﻘﺔ ﻗﻤﺖ ﺑﺰﻳﺎدة iواﺣﺪ واﺣﺪ ﻷﻧﻨﻲ ﻟﻮ ﻟﻢ أزد ﻗﻴﻤﺔ اﻟﻤﺘﺤﻮل i
واﺣﺪ ﻟﻈﻞ ﻋﻠﻰ ﺣﺎﻟﺔ ٠وﻟﺘﻤﺖ ﺗﻨﻔﻴﺬ اﻟﺤﻠﻘﺔ ﻟﻴﻮم اﻟﻘﻴﺎﻣﺔ..
ﺑﻌﻜﺲ ﺣﻠﻘﺔ forاﻟﺘﻲ ﺗﻘﻮم ﺑﺰﻳﺎدة اﻟﻤﺘﺤﻮل ﺑﻨﻔﺴﻬﺎ أوﺗﻮﻣﺎﺗﻴﻜﻴﺎً.....
اﻟﻤﺜﺎل اﻟﺘﺎﻟﻲ:
أﻛﻴﺪ ﺗﻌﺮﻓﻮا ﺷﻠﻮن ﺗﺪرﺟﻮا اﻟﻨﻤﺎذج ﻓﻲ اﻟﺼﻔﺤﺔ ،ﻳﻌﻨﻲ اﻷزرار وﻫﻮ textboxوﻏﻴﺮﻫﺎ ﻣﻦ أدوات
اﻟﻨﻤﺎذج ﻋﻦ ﻃﺮﻳﻖ اﻟﻤﻌﺮف> <input
وﺳﺄﻛﺘﺐ ﻣﺜﺎل ﻳﻮﻟﺪ اﻟﻜﺜﻴﺮ ﻣﻦ اﻷزرار ﻓﻲ اﻟﺼﻔﺤﺔ..
www.Arab-Team.com
:اﻟﻜﻮد
<script>
var i=0;
while(i<=10)
{
<script>
var i=0;
while(i<=50)
{
document.write("<input type=button value=" + i+ ;">");
i++;
}
</Script>
<script>
var i=0;
var space="";
while(i<=50)
{
space=space + "-";
document.write("<input type=button value=" + i+
;">"+space+"<br>");
i++;
}
</Script>
: ﻣﺜﺎل
<script>
var i=10;
do
{
www.Arab-Team.com
;)">document.write("<input type=button value=welcome
;i++
}
)while(i<=5
></Script
ﺑﻜﻞ إﺧﺘﺼﺎر ﺗﻌﺮﻳﻒ ﺣﻠﻘﺔ DOﻫﻲ ﻧﻔﺲ ﺣﻠﻘﺔ WHILEوﻟﻜﻦ ﺗﻨﻔﺬ اﻟﻜﻮد اﻟﻤﻜﺮر ﻣﺮة واﺣﺪة ﻗﺒﻞ
اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﺸﺮط ..ﻓﻤﻨﻰ ﻫﺬا اﻟﻜﻼم أﻧﻪ ﺗﻨﻔﺬ اﻟﻜﻮد وﻟﻮ ﻟﻢ ﻳﺘﺤﻘﻖ اﻟﺸﺮط ..
ﻓﻤﺜﻼً ﻻﺣﻆ ﻗﻴﻤﺔ Iﺗﺴﺎوي ١٠ﻓﺎﻟﺸﺮط ﻏﻴﺮ ﻣﺤﻘﻖ ،إذا اﻟﺤﻠﻘﺔ ﺗﻨﻔﺬ اﻟﻜﻮد اﻟﺬي ﺳﻴﻜﺮر ﺛﻢ
ﺑﻌﺪ ذﻟﻚ ﺗﺘﺤﻖ ﻣﻦ اﻟﺸﺮط اﻟﺬي ﻫﻮ I<5ﺛﻢ ﺑﻌﺪ ذﻟﻚ ﺗﺮى أن اﻟﺸﺮط ﻏﻴﺮ ﻣﺤﻘﻖ ﻓﺘﺨﺮج ﻣﻦ
اﻟﺤﻠﻘﺔ...
ﻷﻧﻪ إذا ﻏﻴﺮت ﻗﻴﻤﺔ i=0أو i=1أو أي ﻗﻴﻤﺔ أﺻﻐﺮ ﻣﻦ اﻟﺨﻤﺴﺔ ﻓﺴﻮف ﺗﻌﻤﻞ اﻟﺤﻠﻘﺔ doﻣﺜﻞ
.. while
www.Arab-Team.com
اﻟﺪرس اﻟﺮاﺑﻊ ﻋﺸﺮ
اﻟﻴﻮم درﺳﻨﺎ ﻫﺎم ﺟﺪاً ..وﻫﻮ اﻟﺘﻌﺎﻣﻞ ﻣﻊ اﻟﻨﻤﺎذج أي أدوات Htmlأي اﻟﻘﺮاءة واﻟﻜﺘﺎﺑﺔ ﻓﻴﻬﺎ ﻣﻊ
إﺟﺮاءات ﻋﻤﻠﻴﺎت ﻋﻠﻴﻬﺎ وﺗﻐﻴﻴﺮ ﺧﺼﺎﺋﺼﻬﺎ......
اﻵن ﺳﺄدرج أﻛﻮاد ﻻإدراج أدوات htmlﻫﻨﺎ وﻣﻦ ﺑﻌﺪﻫﺎ ﺳﻨﺒﺪأ ﺑﺎﻷﻣﺜﻠﺔ:
ﻳﻤﻜﻨﻚ إﺿﺎﻓﺔ اﻟﻌﺪﻳﺪ ﻣﻦ اﻷدوات اﻷﺧﺮى ﻣﻦ ﺧﻼل ﻣﻌﺮﻓﺘﻚ ﻟﻤﻌﺮﻓﺎت htmlأو ﻣﻦ ﺧﻼل ﺑﺮاﻣﺞ
ﻣﺨﺘﺼﺔ ﺑﻜﺘﺎﺑﺔ htmlأوﺗﻮﻣﺎﺗﻴﻚ ﻣﺜﻞ اﻟﻔﺮوﻧﺖ ﺑﻴﺞ واﻟﺪرﻳﻢ وﻳﻔﻴﺮ.......
><form name=mofak
></form
www.Arab-Team.com
ﺛﺎﻧﻴﺎً :أدرج ﻧﺎﺣﻴﺔ ﻧﺺ ﻣﻦ ﺧﻼل اﻟﻜﻮد
وﻟﻘﺪ ﺟﻌﻠﺖ إﺳﻢ اﻟﻨﺺ jamalوﻫﺬا اﻹﺳﻢ ﻣﻬﻢ ﺟﺪا ﻟﻜﻲ ﺗﺘﻌﺎﻣﻞ ﻣﻊ ﻫﺬا اﻟﻌﻨﺼﺮ
ﺗﺨﻴﻞ ﻫﺬا اﻹﺳﻢ ﻛﺈﺳﻤﻚ ﻓﻲ ﺻﻒ اﻟﻤﺪرﺳﺔ ...ﻛﻴﻒ ﻳﻨﺎدﻳﻚ اﻷﺳﺘﺎذ أو اﻟﻤﺤﺎﺿﺮ ..إذا ﻟﻜﻞ
ﻋﻨﺼﺮ إﺳﻢ ﻟﻜﻲ ﻧﺘﺨﺎﻃﺐ ﻣﻬﻊ وﻳﺘﺨﺎﻃﺐ ﻣﻌﻨﺎ......
وﻻﺣﻆ أن اﻟﻜﻮد ﻫﺬا ﺿﻤﻦ اﻟﻨﻤﻮذجform
><form name=mofak
>"<input type="text" name="jamal" size="20
></form
ﻻﺣﻆ أن إﺳﻤﻪ sendوأن اﻹﺳﻢ اﻟﻈﺎﻫﺮ ﻫﻮ اﻟﺘﺤﻴﺔ وأﻧﻪ ﻳﻨﻔﺬ اﻟﻮﻇﻴﻔﺔ helloﻓﻲ ﺣﺎل اﻟﻀﻐﻂ
ﻋﻠﻴﻪ
اﻟﻮﻇﻴﻔﺔ ﻫﻲ :
><script
)(function hello
{
;"ﻋﻠﻴﻜﻢ اﻟﺴﻼم"=document.mofak.jamal.value
}
></Script
اﻟﺠﺪ اﻟﻬﺮم ﻫﻨﺎ documentوﻫﻲ وﺛﻴﻘﺔ اﻹﻧﺘﺮﻧﺖ اﻟﺘﻲ ﻧﺘﻌﺎﻣﻞ ﻣﻌﻬﺎ وﻟﻬﺎ اﻟﻌﺪﻳﺪ ﻣﻦ اﻷوﻻد وﻫﻨﺎ
ﻟﻬﺎ وﻟﺪ واﺣﺪ أي ﻓﻮرم واﺣﺪ وﻏٍﻤﻪ mofakوﻫﺬا اﻟﻮﻟﺪ ﻟﻪ وﻟﺪ أﻳﻀﺎ اﻟﺬي ﻫﻮ ﻣﺮﺑﻊ اﻟﻨﺺ jamal
ﻃﻴﺐ اﻵن أرﻳﺪ أﻧﺎ أن أﻧﺎدي ﺟﻤﺎل ﻓﺄﻗﻮل ﻟﻪ ي ﺟﻤﺎل إﻳﻦ ﻣﻮﻓﻖ إﻳﻦ document
وإذا أردت ﺗﻐﻴﻴﺮ ﺧﺎﺻﻴﺔ ﻣﻦ ﺧﻮاص ﺟﻤﺎل أﻛﺘﺒﻬﺎ ﺑﻌﺪه ...ﻫﺬا ﻓﻲ ﻋﺎﻟﻤﻨﺎ أم ﻓﻲ ﻋﺎﻟﻢ اﻟﺒﺮﻣﺠﺔ
ﻓﻴﺼﺒﺢ ﻛﻼﻣﻲ
ﻫﻜﺬا
;"ﻋﻠﻴﻜﻢ اﻟﺴﻼم"=document.mofak.jamal.value
www.Arab-Team.com
.. ﻫﻲ أﺣﺪ اﻟﺨﻮاص ﻟﻤﺮﺑﻊ اﻟﻨﺺvalue وﻻﺣﻆ أن
<HTML>
<body>
<form name=mofak>
<input type="text" name="jamal" size="20">
<input type="button" value=" "اﻟﺘﺤﻴﺔname="send"
onclick="hello()">
</form>
<script>
function hello()
{
document.mofak.jamal.value=";"ﻋﻠﻴﻜﻢ اﻟﺴﻼم
}
</Script>
</body>
</HTML>
www.Arab-Team.com
اﻟﺪرس اﻟﺨﺎﻣﺲ ﻋﺸﺮ
إﺧﻮﺗﻲ ﻗﺒﻞ أن أﺑﺪأ ﺑﺪرﺳﻲ اﻟﻴﻮم أود أن أﻟﻔﺖ إﻧﺘﺒﺎﻫﻜﻢ إﻟﻰ أﻣﺮ ﻣﻬﻢ وﻫﻮ ﺳﺮﻋﺔ اﻟﺪروس ،
أﻟﻢ ﺗﻼﺣﻈﻮا أﻧﻨﻲ ﻓﻲ اﻟﻔﻴﺘﺮة اﻷﺧﻴﺮة ﻗﺪ أﻧﺸﺮ ﻓﻲ اﻟﻴﻮم درس أو درﺳﻴﻦ ﻳﻮﻣﻴﺎً ،وﻫﺬا أﻓﻀﻞ
ﺑﻜﺜﻴﺮ ﻷن اﻟﺪروس اﻟﺴﺮﻳﻌﺔ أﻓﻀﻞ ﺑﻜﺜﻴﺮ ﻣﻦ اﻟﺪروس اﻟﺒﻄﻴﺌﺔ...
وذﻟﻚ ﻟﻌﺪة أﺳﺒﺎب :
-١ﺳﺮﻋﺔ ﻓﻲ اﻟﺘﻌﻠﻢ ﻷن ﻣﺒﺮﻣﺠﺔ اﻟﻮﻳﺐ ﻳﻠﺰﻣﻪ اﻟﻜﺜﻴﺮ ﻣﻦ اﻟﻤﻮاد ﻟﺘﻌﻠﻤﻬﺎ.
-٢وذﻟﻚ ﻳﻌﻄﻲ ﻗﻴﻤﺔ أﻛﺜﻴﺮ ﻟﻠﺪورة وﻳﺠﻌﻠﻬﺎ أﻛﺜﺮ ﺣﻴﻮﻳﺔ.
وإ ن ﺷﺎء اﷲ ﻓﻲ ﺧﻼل اﻷﺳﺒﻮع اﻟﻘﺎدم ﺳﺄﻧﻬﻲ ﻫﺬه اﻟﺪورة ﻟﻜﻲ ﻧﻨﺘﻘﻞ إﻟﻰ دورة ﺛﺎﻧﻴﺔ ﺑﺈذن
اﷲ ﺗﻌﺎﻟﻰ ..
ﻣﻼﺣﻈﺔ ﻫﺎﻣﺔ ﺟﺪاً :إﺧﻮﺗﻲ وﺻﻠﻨﺎ ﻓﻲ دروﺳﻨﺎ ﻫﻨﺎ ﻟﻠﺘﻌﺎﻣﻞ واﻟﺨﻮض ﻣﻊ ﻣﻌﺮﻓﺎت htmlﺑﻜﺜﺮة ،
ﻓﺄرﺟﻮا ﻣﻦ اﻹﺧﻮة اﻟﻐﻴﺮ ﻣﺘﻤﻜﻨﻴﻦ ﻣﻦ htmlأن ﻳﺘﺮﻛﻮا اﻟﺪورة ﻟﻴﻮم أو ﻳﻮﻣﻴﻦ وﻳﺪرﺳﻮا htmlﺛﻢ
ﻳﻌﻮدوا إﻟﻰ اﻟﺪورة
ﻣﻊ اﻟﻌﻠﻢ أن اﻟﻤﻬﺘﻢ ﻟﺘﻌﻠﻢ htmlﻳﺘﻌﻠﻤﻬﺎ ﻓﻲ ﻇﺮف ﻳﻮﻣﻴﻦ .......وﻟﻜﻦ ﻳﻠﺰﻣﻬﺎ ﻫﻤﺔ ﻋﺎﻟﻴﺔ....
اﻟﺨﻄﻮات :
><form name=mofak
> :</bاﻟﺮﻗﻢ اﻷول><b
:اﻟﺜﺎﻧﻲ اﻟﺮﻗﻢ><input type="text" name="n1" size="20"> <b
></b
;> :</bاﻟﻨﺎﺗﺞ ;;><input type="text" name="n2" size="20"><b
<input type="text" name="n" size="20"><p>;<input
>"" name="b1ﺿﺮب"=type="button" value
>"" name="b2ﻗﺴﻤﺔ"=<input type="button" value
>"" name="b3ﲨﻊ"=<input type="button" value
>" name="b4"> </pﻃﺮح"=<input type="button" value
></form
وﻻﺣﻆ أﻫﻢ ﺷﻲ ﻫﻮ إﺳﻢ ﺧﺎﻧﺔ اﻟﺮﻗﻢ اﻷول n1وﺧﺎﻧﺔ اﻟﺮﻗﻢ اﻟﺜﺎﻧﻲ n2وﺧﺎﻧﺔ اﻟﺠﻮاب ﻫﻲn
ﻃﺒﻌﺎً أﺳﻬﻞ ﺷﻲ ﻟﺒﻨﺎء ﻧﻤﻮذج ﻣﺜﻞ اﻟﺬي ﻓﻲ اﻷﻋﻠﻰ ﻫﻮ ﻛﻤﺎ ﻗﻠﺖ ﺑﺮاﻣﺞ ﺟﺎﻫﺰة ﻣﺜﻞ درﻳﻢ
وﻳﻔﻴﺮ واﻟﻔﺮوﻧﺖ ﺑﻴﺞ.
وأن ﻓﻲ ﻫﺬا اﻟﻤﺜﺎل وﻣﻦ ﻫﺬا اﻟﺪرس وﻣﺎﺑﻌﺪ ﺳﺄﺳﺘﺨﺪم اﻟﺪرﻳﻢ وﻳﻔﻴﺮ ﻟﻜﺘﺎﺑﺔ اﺗﻤﺎرﻳﻦ ﻷﻧﻬﺎ
www.Arab-Team.com
ﻓﻬﺬا ﻻﻳﻀﺮﻧﺎ ﻓﻌﻠﻰ اﻟﻌﻜﺲ إﻧﻪ ﻳﻮﻓﺮ اﻟﻮﻗﺖhtml وإذا ﻛﻨﺎ ﻧﻌﺮف... ﺳﺘﺒﺪأ ﺑﺎﻟﻄﻮل أﻛﺜﺮ ﻓﺄﻛﺜﺮ
: وﺳﻨﺒﺪأ ﺑﺪاﻟﺔ اﻟﻀﺮب وﻫﻲ.... اﻵن ﺟﺎء دور ﻛﺘﺎﺑﺔ اﻟﻮﻇﺎﺋﻒ اﻟﻼزﻣﺔ ﻟﻬﺬا اﻟﺘﻤﺮﻳﻦ
function a()
{
var a=document.mofak.n1.value;
var b= document.mofak.n2.value;
document.mofak.n.value=a*b;
}
function a()
{
var a=mofak.n1.value;
var b= mofak.n2.value;
mofak.n.value=a*b;
}
: ﻟﻬﺬا اﻟﺰر ﻫﻮhtml وﻃﺒﻌﺎً اﻟﺪاﻟﺔ ﻫﺬه ﻳﺴﺘﺪﻋﻴﻬﺎ زر اﻟﻀﺮب وﻳﺼﺒﺢ ﻛﻮد
ﻓﻴﺼﺒﺢ ﻛﻮد زر اﻟﻘﺴﻤﺔ ﻫﻜﺬاb وﻫﻜﺬا أﻋﻤﻞ ﻟﻜﻞ اﻷزرار ﻣﺜﻼ وﻇﻴﻔﺔ اﻟﻘﺴﻤﺔ
www.Arab-Team.com
اﻟﺪرس اﻟﺴﺎدس ﻋﺸﺮ
.. ﺳﻨﻜﻤﻞ اﻟﻴﻮم ﻣﺸﻮارﻧﺎ ﻣﻊ اﻟﺘﻌﺎﻣﻞ ﻣﻊ اﻟﻨﻤﺎذج وﻧﻜﺘﺸﻒ اﻷﺳﺮار وأﺣﺪث اﻟﻄﺮق ﻟﺬﻟﻚ
<form name=mofak>
;<input type=text size=4 value=0 name="a">
<input type="button" value="+" name="b1" onclick="aa()">
<input type=text size=4 value=0 name="b"> =
<input type=text size=4 value=0 name="c">
</form>
<script>
function aa()
{
y=mofak.a.value;
x=mofak.b.value;
z=Number(y)+Number(x);
mofak.c.value=z;
}
</script>
ً وذﻟﻚ ﻟﺠﻤﻊ اﻟﻌﺪﻳﻦ رﻗﻤﻴﺎً وﻟﻴﺲ ﻧﺼﻴﺎNumber ﻻﺣﻆ اﻟﻤﺜﺎل ﻋﺎدي ﺟﺪا وﻟﻜﻦ اﺳﺘﺨﺪﻣﺖ اﻟﺪاﻟﺔ
.. ٣٣ وﻟﻴﺲ٦ = ٣ + ٣ أي...
...واﻵن ﺳﻮف أﻛﺘﺐ اﻟﺘﻤﺮﻳﻦ ﻣﺮة أﺧﺮى وﻟﻜﻦ ﺑﺎﻟﻄﺮﻳﻘﺔ اﻟﺠﺪﻳﺪة اﻟﺘﻲ ﺳﺄﺗﻌﻠﻤﻬﺎ
<form name=mofak>
;<input type=text size=4 value=0 name="a">
<input type="button" value="+" name="b1"
onclick="aa(this.form)">
<input type=text size=4 value=0 name="b"> =
<input type=text size=4 value=0 name="c">
</form>
<script>
function aa(f)
{
y=f.a.value;
x=f.b.value;
z=Number(y)+Number(x);
f.c.value=z;
}
</script>
ﻫﺬاthis.form وﻫﻮ ﻓﻲ اﻷﻋﻠﻰ ﻗﻤﺖ ﺑﺈدﺧﺎﻟﻪ اﻟﺬي ﻫﻮf ﻻﺣﻆ ﻟﻘﺪ دﺧﻠﺖ إﻟﻰ اﻟﻮﻇﻴﻔﺔ ﺑﺎراﻣﺘﺮ
اﻟﺬي أرﺳﻞform ﺷﻲ ﻣﺮﻋﺐ وﻣﺨﻴﻒ ﻟﻠﻐﺎﻳﺔ ﻫﺬﻫﺎ اﻟﻐﺮض ﻟﻪ أﺣﺪ اﻟﻤﻨﺎﻫﺞ اﻟﺬي ﻫﻮthis
ز وﻫﺬا ﻣﻔﻴﺪ ﺟﺪا ﻓﻲ ﺣﺎل اﻟﺘﻌﺎﻣﻞ ﻣﻊ.. ﻟﻠﺪاﻟﺔ اﻟﻨﻤﻮذج اﻟﻤﻮﺟﻮد ﺑﺪاﺧﻠﻪ اﻷداة اﻟﺘﻲ ﻧﻘﺮت ﻋﻠﻴﻬﺎ
www.Arab-Team.com
... أﻛﺜﺮ ﻣﻦ ﻧﻤﻮذج وﻏﻴﺮ ذﻟﻚ ﻣﻦ اﻟﺤﺎﻻت اﻟﺘﻲ ﺳﻤﻨﺘﻄﺮق إﻟﻴﻬﺎ ﻓﻲ اﻟﺪورس اﻟﻘﺎدﻣﺔ
واﻵن ﺳﺄﻋﻴﺪ ﻛﺘﺎﺑﺔ ﺑﺮﻧﺎﻣﺞ اﻵﻟﺔ اﻟﺤﺎﺳﺒﺔ اﻟﺬي ﻛﺘﺒﻨﺎه ﻓﻲ اﻟﺪرس اﻟﺨﺎﻣﺲ ﻋﺸﺮ ﺑﺼﻴﻐﺔ ﺟﺪﻳﺔ
: this ﻋﻠﻰ أﺳﻠﻮب
<script LANGUAGE="JavaScript">
function a_plus_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a+b
form.ans.value = c
}
function a_minus_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a-b
form.ans.value=c
}
function a_times_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a*b
form.ans.value=c
}
function a_div_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a/b
form.ans.value = c
}
</SCRIPT>
<BODY>
<CENTER>
<FORM name="formx"><input type=text size=4 value=12 name="a">
<input type="button" value=" ;+ ;"
onClick="a_plus_b(this.form)"> ;
<input type="button" value=" ;- ;"
onClick="a_minus_b(this.form)"> ;
<input type="button" value=" ;x ;"
onClick="a_times_b(this.form)"> ;
<input type="button" value=" ;/ ;"
onClick="a_div_b(this.form)"> ;
<input type="number" size=4 value=3 name="b"> = <input type
"number" value=0 name="ans" size=9>
</FORM>
</CENTER>
www.Arab-Team.com
اﻟﺪرس اﻟﺴﺎﺑﻊ ﻋﺸﺮ
.....ﻣﻦ ﺧﻼل اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ....... اﻟﻴﻮم ﺳﻨﺘﺤﻜﻢ ﺑﺎﻷدوات اﻟﺘﻔﻌﻴﻞ واﻹﻧﺘﻘﺎء
:اﻟﻤﺜﺎل اﻷول
<html dir="rtl">
<head> </head>
<body>
<b> ﻫﻞ ﲢﺐ اﳉﺎﻓﺎ ﺳﻜﺮﺑﺖ:</b><form name=f1>
<p>;;;ﻻ
<input type="radio" name="col1" value="a"><p></p>
<p>;ﻧﻌﻢ
<input type="radio" name="col1" value="b"> </p>
f1.col1(0).checked
. وﻫﺬا ﻳﻌﻨﻲ اﻷداة اﻷوﻟﻰ ﺗﺮﺗﻴﺒﻬﺎ ﻓﻲ اﻟﺼﻔﺤﺔ٠ وﻻﺣﻆ أﻧﻨﺎ ﻛﺘﺒﻨﺎ اﻟﺮﻗﻢ
.. وﻫﻜﺬا١ واﻷداة اﻟﺜﺎﻧﻴﺔ إﺳﻤﻬﺎ
<HEAD>
<script LANGUAGE="JavaScript">
function check(field) {
alert(field.length);
www.Arab-Team.com
}
</script>
</HEAD>
<BODY>
<center>
<form name=myform action="" method=post>
<table>
<tr><td>
<b>Your Favorite Scripts & Languages</b><br>
<input type=checkbox name=list value="1">Java<br>
<input type=checkbox name=list value="2">JavaScript<br>
<input type=checkbox name=list value="3">ASP<br>
<input type=checkbox name=list value="4">HTML<br>
<input type=checkbox name=list value="5">SQL<br>
<br> ; ; ; ; ; ; ; ; ; ; ; ; ; ; ; ; ; ; ; ; ; ; ; ; ; ;
<input type=button value="Check All" name=b1
onClick="check(this.form.list)">
</td></tr>
</table>
</form>
</center>
<div align="left">
ﻻﺣﻆ أﻧﻨﺎ أرﺳﻠﻨﺎ وﺳﻴﻂ إﻟﻰ اﻟﻮﻇﻴﻔﺔ ﻣﺠﻤﻮﻋﺔ أدوات اﻹﺧﺘﻴﺎر ﺑﻜﺘﺎﺑﺔ
this.form.list
fieldﻟﻠﻤﺠﻤﻮﻋﺔlength وﻋﺮﻓﻨﺎ ﻋﺪد اﻷدوات ﻋﻦ ﻃﺮﻳﻖ اﻟﻤﻨﻬﺞ
: field.lengthﻫﻜﺬا
......واﻵن ﺳﻨﻄﻮر اﻟﻤﺜﺎل ﺑﺤﻴﺚ ﻧﺠﻌﻞ زر ﻳﻔﻌﻞ ﻛﻞ اﻷدوات وز ﻳﻠﻐﻲ ﺗﻔﻌﻴﻞ ﻛﻞ اﻷدوات
: اﻟﻜﻮد ﻛﺎﻟﺘﺎﻟﻲ
<HEAD>
<script LANGUAGE="JavaScript">
function check(field) {
for(i=0;i<field.length;i++)
field[i].checked=1;
}
function discheck(field) {
for(i=0;i<field.length;i++)
field[i].checked=0;
}
</script>
</HEAD>
<BODY>
<center>
<form name=myform action="" method=post>
www.Arab-Team.com
<table>
<tr><td>
<b>Your Favorite Scripts & Languages</b><br>
<input type=checkbox name=list value="1">Java<br>
<input type=checkbox name=list value="2">JavaScript<br>
<input type=checkbox name=list value="3">ASP<br>
<input type=checkbox name=list value="4">HTML<br>
<input type=checkbox name=list value="5">SQL<br>
<br>
<input type=button value="Check All" name=b1
onClick="check(this.form.list)">
<input type=button value="Check All" name=b2
onClick="discheck(this.form.list)">
</td></tr>
</table>
</form>
</center>
....اﻟﻜﻮد ﻋﻠﻰ ﻓﻜﺮة ﺳﻬﻞ ﺟﺪاً ﺟﺪاً وﻟﻜﻦ ﻳﺤﺘﺎج اﻟﻘﻠﻴﻞ ﻣﻦ اﻟﺘﺮﻛﻴﺰ واﻟﻌﻨﺎﻳﺔ
..................... واﻟﺘﻤﺮﻳﻦ وﻣﺤﺎوﻟﺔ ﺗﻄﺒﻴﻖ أﻓﻜﺎر ﺟﺪﻳﺪة
: for ﻛﻠﻬﺎ ﻓﻲ ﻗﺎﺋﻤﺔ ﻋﻦ ﻃﺮﻳﻖ ﺣﻠﻘﺔ٢٠٢٠ إﻟﻰ ﻋﺎم١٩٥٠ ﻫﺬا اﻟﻜﻮد ﻹﺿﺎﻓﺔ اﻷﻋﻮام ﻣﻦ
<script LANGUAGE="JavaScript">
document.write("<form>");
document.write("<select name=dates size=1>");
for (var i= 1920;i <=2020; i++)
{
document.write("<option>");
document.write(i);
}
document.write("</select></form>");
// End -->
</SCRIPT>
www.Arab-Team.com
اﻟﺪرس اﻟﺜﺎﻣﻦ ﻋﺸﺮ
أﻟﻢ ﺗﻼﺣﻈﻮا أن دروس اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﺑﺪأت ﻓﻲ ﺗﺨﻄﻲ ﻣﺮﺣﻠﺔ اﻟﻤﺒﺘﺪئ اﻵن ....وﻫﺬا دﻟﻴﻞ
ﻋﻠﻰ ﺗﻘﺪم اﻟﺪورة واﻟﺤﻤﺪ ﷲ ..
ﻓﺄﻧﺖ ﻋﻨﺪﻣﺎ ﺗﺪﺧﻞ ﻣﻮﻗﻌﺎ ﺗﺮى أﺣﻴﺎﻧﺎ ﻧﺎﻓﺬة ﻣﻦ ﺑﺎب اﻟﺪﻋﺎﻳﺔ أو ﻻإﻋﻼن ﺷﺊ ﺟﺪﻳﺪ وﻳﺴﻤﻰ pop
up menusو ﺳﻨﺘﻌﻠﻢ ﻫﻨﺎ ﻛﻴﻒ ﻳﺘﻢ اﻧﺸﺎء ﻫﺬه اﻟﻨﻮاﻓﺬ ﺗﻐﻴﻴﺮ ﺣﺠﻤﻬﺎ و ﻣﺤﺘﻮاﻳﺎﺗﻬﺎ ...........اﻟﺦ
اﻟﺼﻴﻐﺔ اﻟﻌﺎﻣﺔ:
><html
><head
>"<script language="javascript
{)(function op
;)(window.open
}
></script
></head
><body
>")(" onclick="opاﻓﺘﺢ ﻧﺎﻓﺬة"=<input type="button" value
></body
></html
ﻻﺣﻆ ﻟﻘﺪ ﻛﺘﺒﺖ ﻓﻘﻂ إﺳﻢ اﻟﻤﻨﻬﺞ openوﻟﻢ أﻛﺘﺐ أي ﺑﺮاﻣﺘﺮ ﻟﻬﺬا اﻟﻤﻨﻬﺞ واﻵن ﺳﺄﻛﺘﺐ ﻣﺴﺎر
ﻟﻬﺬه اﻟﺼﻔﺤﺔ..
><html
><head
>"<script language="javascript
{)(function op
;)"window.open("http://www.arab-team.com/ib/","page1
www.Arab-Team.com
}
></script
></head
><body
"=<input type="button" valueاﻓﺘﺢ ﻧﺎﻓﺬة>")(" onclick="op
></body
></html
ﻻﺣﻆ ﻋﻨﺪ اﻟﻨﻘﺮ ﻋﻠﻰ اﻟﺰر ﺳﻴﺘﻢ ﻓﺘﺢ اﻟﻨﺎﻓﺬة وﺑﺪاﺧﻠﻬﺎ ﻣﻮﻗﻌﻨﺎ .. arab-team
ﻃﻴﺐ اﻵن ﺳﺄﻃﻮر اﻟﻤﺜﺎل ﻟﻜﻲ ﺗﻈﻬﺮ ﻧﺎﻓﺬة ﻣﻮﻗﻌﻨﺎ ﻋﻠﻰ ﻣﻠﺊ اﻟﺸﺎﺷﺔ :
><html
><head
>"<script language="javascript
{)(function op
window.open("http://www.arab-
team.com/ib/","page1","left=0,top=0,width=800,height=600,Menu
;)"bar=no
}
></script
></head
><body
>")(" onclick="opاﻓﺘﺢ ﻧﺎﻓﺬة"=<input type="button" value
></body
></html
ﻋـﺪل ﺑـﺎﻟﺨﻮاص ﻋﻠـﻰ ﻛﻴﻔـﻚ ﺟـﺮب واﺣـﺪة ﺛـﻢ اﺣـﺬﻓﻬﺎ ﺛـﻢ ﺿـﻊ اﻷﺧـﺮى وﺣـﺎول أن ﺗﻔﻬﻤـﺎ ﻛـﻞ
اﻟﺨﺼﺎﺋﺺ
www.Arab-Team.com
اﻵن ﺳﻨﺘﻜﻠﻢ ﻋﻦ اﻟﺘﺤﻜﻢ ﰲ اﻟﻨﺎﻓﺬة اﻟﱵ ﺳﺘﻨﺒﺜﻖ ﻣﻦ ﻣﻮﻗﻌﻨﺎ...
ز ﻻ ﺑﻞ ﻧﺴﺘﻄﻴﻊ.. ﻟﻴﺲ ﺑﺎﻟﻀﺮورة أن ﻳﻜﻮن ﻓﻴﻬﺎ ﻋﻨﻮان ﺻﻔﺤﺔ أو ﻣﻮﻗﻊ
ً ﻣﻨﻬﺎ ﳓﻦ أن ﻧﻜﺘﺐ
وﻧﻘﺮا
<html>
<head>
<script language="javascript">
function op(){
var mofak;
mofak=window.open("","a","height=100,width=550,toolbar=1,top=
200,left=200");
mofak.document.write("<body bgcolor='#00000'
text='#Fe0010'>");
mofak.document.write("<font size=10><b>Arab-
team.com</b></font>");
}
</script>
</head>
<body>
<input type="button" value=" "اﻓﺘﺢ ﻧﺎﻓﺬةonclick="op()">
</body>
</html>
وأﺻﺒﺤﻨﺎ ﻧﺘﺤﻜﻢ ﺑﻬﺎ ﻣﻦmofak ﻻﺣﻆ ﺑﻜﻞ ﺑﺴﺎﻃﺔ ﺗﻢ إﻧﺸﺎء ﻧﺴﺨﺔ ﻋﻦ ﻛﺎﺋﻦ اﻟﻨﺎﻓﺬة واﻟﺬي ﻫﻮ
(ﻫﺬا اﻟﻐﺮض اﻟﺠﺪﻳﺪ )اﻟﻮﺳﻴﻂ
<html>
<head>
<script language="javascript">
function op(){
var mofak;
mofak=window.open("","a","height=100,width=550,toolbar=0,top=
200,left=200");
mofak.document.write("<body bgcolor='#00000'
text='#Fe0010'>");
mofak.document.write("<marquee><font size=10><b>Arab-
team.com</b></font></marquee>");
}
</script>
</head>
<body>
<input type="button" value=" "اﻓﺘﺢ ﻧﺎﻓﺬةonclick="op()">
</body>
</html>
www.Arab-Team.com
.. اﻟﻘﻴﻤﺔ ﺻﻔﺮ ﻟﻜﻲ ﻻﻳﻈﻬﺮ ﺷﺮﻳﻂ اﻷادوات اﻟﻌﻠﻮيtoolbar وﻻﺣﻆ أﻧﻨﻲ أﻋﻄﻴﺖ اﻟﺨﺎﺻﻴﺔ
ﻣﺮة آﺧﺮى ﻃﻴﺐarab-team ﻻﺣﻆ إﻧﻘﺮ ﻋﺪة ﻣﺮات ﻋﻠﻰ اﻟﺰر اﻟﺬي ﻳﻔﺘﺢ اﻟﻨﺎﻓﺬة ﻓﺴﺘﻼﺣﻆ ﻛﺘﺎﺑﺔ
: ﻣﺎرأﻳﻚ ﻟﻮ ﻧﻌﻤﻞ ﺣﻠﻘﺔ ﻟﻜﺘﺎﺑﺔ اﻟﻌﺪﻳﺪ ﻣﻦ اﻷﺳﻄﺮ ﻓﻲ ﻧﻔﺲ اﻟﻨﻘﺮة ﻟﻴﺼﺒﺢ اﻟﻜﻮد ﻛﺎﻟﺘﺎﻟﻲ
<html>
<head>
<script language="javascript">
function op(){
var mofak;
mofak=window.open("","a","height=600,width=800,toolbar=0,top=
0,left=0");
mofak.document.write("<body bgcolor='#00000'
text='#Fe0010'>");
for(i=0;i<=10;i++)
mofak.document.write("<marquee><font size=10><b>Arab-
team.com</b></font></marquee>");
}
</script>
</head>
<body>
<input type="button" value=" "اﻓﺘﺢ ﻧﺎﻓﺬةonclick="op()">
</body>
</html>
<html>
<head>
<script language="javascript">
function op(){
var mofak;
mofak=window.open("","a","height=600,width=800,toolbar=0,top=
0,left=0");
mofak.document.write("<body bgcolor='#00000'
text='#Fe0010'>");
mofak.document.write("<input type=button value=اﳋﺮوج
onclick=window.close() >");
for(i=0;i<=10;i++)
mofak.document.write("<marquee><font size=10><b>Arab-
team.com</b></font></marquee>");
}
</script>
</head>
<body>
www.Arab-Team.com
<input type="button" value=" "اﻓﺘﺢ ﻧﺎﻓﺬةonclick="op()">
</body>
</html>
<html>
<head>
<title>Window Open</title>
<script LANGUAGE="JavaScript">
<!-- ; ; var newWindow;
// Open Window based on user defined attributes
function openWindow() {
// Build the windowFeatures parameter list
var winAtts = "";
if (document.winOptions.toolbarOption.checked) {
winAtts += "toolbar=1,"; }
if (document.winOptions.menubarOption.checked) {
winAtts += "menubar=1,"; }
if (document.winOptions.scrollbarsOption.checked) {
winAtts += "scrollbars=1,"; }
if (document.winOptions.resizableOption.checked) {
winAtts += "resizable=1,"; }
if (document.winOptions.statusOption.checked) {
winAtts += "status=1,"; }
if (document.winOptions.locationOption. checked) {
winAtts += "location=1,"; }
if (document.winOptions.directoriesOption.checked) {
winAtts += "directories=1,"; }
if (document.winOptions.copyHistoryOption.checked) {
winAtts += "copyhistory=1,"; }
if (document.winOptions.customSizeOption.checked) {
winAtts += "height=" + document.winOptions.heightBox.value +
",";
winAtts += "width=" + document.winOptions.widthBox.value +
",";
winAtts = winAtts.substring(0, winAtts.length-1);
// Determine URL and show window
if (document.winOptions.pageType[0].checked) {
var urlVar = document.winOptions.urlBox.value;
newWindow = window.open(urlVar,"newWindow",winAtts);
www.Arab-Team.com
}
else {
newWindow = window.open("","newWindow",winAtts);
newWindow.document.write("<H1>Window Open Test</H1><p>");
}}// Close Window
function closeWindow() {
newWindow.close();
}// -->
</SCRIPT>
</head>
<body >
<h1><font color="#008040">Window Open Example</font></h1>
<p><i><b>Please select the following display options and then
clickthe Open Window button. </i></B></p>
<form name="winOptions" method="POST">
<p>Would you like an existing page or one created on the
fly?</p>
<p><input type=radio checked name="pageType"
value="existing">Existing Page
<input type=text ;size=30 maxlength=256 name="urlBox"
value="http://www.arab-team.com"></p>
<input type=radio name="pageType" value="dynamic">Dynamic
Page</p>
<hr>
<p>Window Attributes:</p>
<input type=checkbox name="toolbarOption" value="ON">Toolbar
<input type=checkbox name="menubarOption" value="ON">Menubar
<input type=checkbox name="scrollbarsOption"
value="ON">Scrollbars
<input type=checkbox name="resizableOption"
;value="ON">Resizable
<input type=checkbox name="statusOption" value="ON">Status
<input type=checkbox name="locationOption"
value="ON">Location
<input type=checkbox name="directoriesOption"
value="ON">Directories
<input type=checkbox name="copyHistoryOption" value="ON">Copy
History
<br>
<input type=checkbox name="customSizeOption"
;value="ON">Custom Size
<br>
Width: <input type=text size=5 maxlength=5 name="widthBox">
Height: <input type=text size=5 ;maxlength=5
name="heightBox">
<br>
<input type="button" name="OpenButton" value="Open Window"
onClick="openWindow()">
<input type="button" name="CloseButton" value="Close Window"
www.Arab-Team.com
onClick="closeWindow()">
</form>
</body>
</html>
www.Arab-Team.com
اﻟﺪرس اﻟﺘﺎﺳﻊ ﻋﺸﺮ
أﺣﺪاث اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ
ﻫﺬا اﻟﺪرس ﺳﺄﺟﻌﻠﻪ ﻳﺪور ﺣﻮل ﻋﺪة ﻣﻮاﺿﻴﻊ ﻣﺘﻨﻮﻋﺔ وﻋﺪة أﻣﻮر ﻗﺪ ﺳﻬﻮﻧﺎ ﻋﻨﻬﺎ وﻟﻢ ﻧﻀﻌﻬﺎ ﻓﻲ
اﻟﺪروس اﻟﺴﺎﺑﻘﺔ ،وﺳﻨﺘﻄﺮق ﻟﺒﻌﺾ اﻷﻓﻜﺎر اﻟﺠﺪﻳﺪة واﻟﺠﻤﻴﻠﺔ اﻟﻤﺴﻠﻴﺔ........
ﻟﻘﺪ ﺗﻜﻠﻤﻨﺎ ﻋﻦ اﻷﺣﺪاث ﻣﻨﺬ ﻋﺪة دروس وﻟﻜﻦ ﻟﻢ ﻧﻀﻌﻬﺎ ﻛﻠﻬﺎ أم اﻵن ﻓﺴﺄﺿﻊ ﻛﻞ اﻷﺣﺪاث
اﻟﻤﺘﺎﺣﺔ ﻓﻲ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻣﻊ ﺷﺮح ﻛﻞ ﺣﺪث :
www.Arab-Team.com
ﻋﻨﺪ ﺗﻤﺮﻳﺮ اﻹﻃﺎر ﺧﺎص ﺑﺎﻟﺼﻔﺤﺔ
onscroll
وﺑﺎﻟﻨﺴﺒﺔ ﻟﺘﻄﺒﻴﻖ ﻫﺬه اﻷﻓﻜﺎر أﻣﺮ ﻋﺎدي ﺗﻜﺘﺐ وﻇﻴﻔﺔ functionوﺗﺴﺘﺪﻋﻴﻬﺎ ﻋﻨﺪ إﺷﺘﻌﺎل
اﻟﺤﺪث ﻛﻤﺎ ﻓﻲ اﻟﻤﺜﺎل اﻟﺘﺎﻟﻲ :
><BODY
>)(<input type="text" name="t1" size="20" onfocus=mofak
>"<script LANGUAGE="JavaScript
)(function mofak
{
;)"alert("welcome
}
></SCRIPT
ﻋﻨﺪ اﻹﻗﺘﺮاب واﻟﻨﻘﺮ ﻋﻠﻰ ﻣﺮﺑﻊ اﻟﻨﺺ ﻳﻌﻤـﻞ اﻟﻔﺎﻧﻜﺸـﻦ وﻫﻜـﺬا ﻛـﻞ اﻷﺣـﺪاث ﺗﻄﺒﻴـﻖ .....وﻓـﻲ
ﻳﻮﺟﺪ ﺷﺮح ﻟﻌﺪة أﺣﺪاث ﻣﻦ اﻟﻤﻼﺣﻈﺎت اﻟﺘﻲ ﻓﻲ ﻧﻔﺲ اﻟﺪرس
ﻣﺎﻫﻲ اﻟﺘﻌﻠﻴﻘﺎت ؟
ﻣﺜﻞ html
واﻷﺳﻤﺒﻠﻲ
;
><BODY
>)(<input type="text" name="t1" size="20" onfocus=mofak
>"<script LANGUAGE="JavaScript
)(function mofak
{
;)"alert("welcome
;)"ﺑﺴﻢ اﷲ"(//alert
}
></SCRIPT
واﻟﺴﻼم
alert
prompt
وﻟﻜﻞ واﺣﺪ ﻣﻦ ﻫﺬه اﻟﻤﺮﺑﻌﺎت ﻓﺎﺋﺪة ..
إذا ﻳﻈﻬﺮ ﻟﻠﻤﺴﺘﺨﺪم إﺧﺘﻴﺎر رز Okأو Cancelﻓﺈذا ﻧﻘﺮ okﻧﻔﺬﻧﺎ ﻟﻪ اﻟﻤﻄﻠﻮب وإذا ﻧﻘﺮ cancel
ﺗﺮاﺟﻌﻨﺎ ﻋﻦ ﻋﻤﻞ أي ﺷﺊ ..
>")(<body onload="mofak
>"<script language="JavaScript
{)(function mofak
"(if(confirmﻣﺎذا ﺗﺮﻳﺪ ان ﲣﺘﺎر؟؟؟))"
"(alertﻟﻘﺪ اﺧﱰت زر ﻣﻮاﻓﻖ )"
else
"(alertﻟﻘﺪ اﺧﱰت زر اﻻﻟﻐﺎء )"
www.Arab-Team.com
}
></script
></body
ﻓﻲ ﻫﺬه اﻟﻔﻜﺮة ﻧﻘﺪم ﻟﻜﻢ ﻃﺮﻳﻘﺔ ﻣﻤﺘﻌﻪ وﻣﻔﻴﺪه ﻓﻲ اﻟﺘﺤﻜﻢ ﺑﺎﻟﺼﻮر وﻳﺠﺪ اﻟﻜﺜﻴﺮون ﻫﺬه
اﻟﻄﺮﻳﻘﺔ ﻣﺴﺘﻌﻤﻠﺔ ﻓﻲ اﻏﻠﺐ ﻣﻮاﻗﻊ اﻻﻧﺘﺮﻧﺖ ﻻﻧﻬﺎ ﺗﻀﻴﻒ ﻟﻠﺼﻔﺤﺔ ﻣﺘﻌﺔ وﺟﻤﺎﻟﻴﺔ
ﻗﺪ ﻳﻌﺘﻘﺪ اﻟﻤﺒﺘﺪأ أن ﻫﺬه اﻟﻄﺮﻳﻘﺔ ﺻﻌﺒﺔ اﻟﺘﻌﺎﻣﻞ وﻟﻜﻨﻬﺎ ﻟﻴﺴﺖ ﻛﺬﻟﻚ ﻓﻴﻪ ﺳﻬﻠﺔ ﻟﻠﻐﺎﻳﺔ
pathﻣﺴﺎر اﻟﺼﻮرة
idإﺳﻢ اﻟﺼﻮرة وﻫﻮ ﻣﻬﻢ ﻟﻠﻐﺎﻳﺔ ﻛﻤﺎ ﻗﻠﻨﺎ ﻓﻲ اﻟﺪروس اﻟﺴﺎﺑﻘﺔ ﻟﻜﻲ ﻧﺘﺨﺎﻃﺐ ﻣﻊ اﻟﺼﻮرة
ﻫﺬا اﻟﻤﺜﺎل ﻳﺒﺪل اﻟﺼﻮرة ﺑﺼﻮرة ﺛﺎﻧﻴﺔ ﻋﻨﺪ ﻣﺮور اﻟﻔﺄرة ﻓﻮﻗﻬﺎ ..
><html
><body
>"<img src="1.gif" name=mofak onMouseOver=mofak.src="2.gif
></body
وﻳﺠﺐ ﻋﻠﻴﻚ وﺿﻊ اﻟﺼﻮرة .gif ١و.gif ٢ﺟﺎﻧﺐ اﻟﺼﻔﺤﺔ أو ﻳﺠﺐ ﺗﺤﺪﻳﺪ ﻣﺴﺎر اﻟﺼﻮرة ..
ﻣﻼﺣﻈﺔ أﺧﺮى ﺑﻜﻞ ﺑﺴﺎﻃﺔ ﻳﻤﻜﻨﻚ ﺗﻐﻴﻴﺮ ﺧﺼﺎﺋﺺ اﻟﺘﺎغ > <imgﻛﻌﺮض اﻟﺼﻮرة وﻏﻴﺮ ذﻟﻚ ﻣﻦ
اﻟﺨﺼﺎﺋﺺ .........وﻫﺬا ﻳﻨﺸﺊ ﻋﻨﺪك ﻣﻦ اﻟﻤﺆﺛﺮات اﻟﺸﻲ اﻟﻜﺜﻴﺮ...
><html
><body
>)(<img src=1.gif id=mofak onMouseOver=w1() OnMouseOut=w2
><script
{ )(function w1
mofak.width=200
mofak.height=200
}
{ )(function w2
mofak.width=300
www.Arab-Team.com
mofak.height=20
}
></script
></body
ﻋﻨﺪ ﻣﺮور اﻟﻔﺄرة ﻓﻮق اﻟﺼﻮرة ﺗﺘﻐﻴﺮ أﺑﻌﺎدﻫﺎ وﻋﻨﺪ إﺑﻌﺎد اﻟﻤﺆﺷـﺮ ﻣـﻦ ﻋﻠﻴﻬـﺎ ﺗﺘﻐﻴـﺮ أﺑﻌﺎدﻫـﺎ أﻳﻀـﺎ ،
وﻣﻦ اﻟﻤﻜﻦ أن ﻧﻀﻊ إﻋﺪادت اﻟﺮﺟﻮع ﻧﻔﺲ ﻗﻴﺎﺳﻬﺎ اﻷﺻﻠﻲ
ﻣﻼﺣﻈﺔ أﺧﺮى ﺑﻜﻞ ﺑﺴﺎﻃﺔ ﻳﻤﻜﻨﻚ ﺗﻐﻴﻴﺮ ﺧﺼﺎﺋﺺ اﻟﺘﺎغ > <imgﻛﻌﺮض اﻟﺼﻮرة وﻏﻴﺮ ذﻟﻚ ﻣﻦ
اﻟﺨﺼﺎﺋﺺ .........وﻫﺬا ﻳﻨﺸﺊ ﻋﻨﺪك ﻣﻦ اﻟﻤﺆﺛﺮات اﻟﺸﻲ اﻟﻜﺜﻴﺮ...
><html
><body
>)(<img src=1.gif id=mofak onMouseOver=w1() OnMouseOut=w2
><script
{ )(function w1
mofak.width=200
mofak.height=200
}
{ )(function w2
mofak.width=300
mofak.height=20
}
></script
></body
ﻋﻨﺪ ﻣﺮور اﻟﻔﺄرة ﻓﻮق اﻟﺼﻮرة ﺗﺘﻐﻴﺮ أﺑﻌﺎدﻫﺎ وﻋﻨﺪ إﺑﻌﺎد اﻟﻤﺆﺷـﺮ ﻣـﻦ ﻋﻠﻴﻬـﺎ ﺗﺘﻐﻴـﺮ أﺑﻌﺎدﻫـﺎ أﻳﻀـﺎ ،
وﻣﻦ اﻟﻤﻜﻦ أﻧﻨﻀﻊ إﻋﺪادت اﻟﺮﺟﻮع ﻧﻔﺲ ﻗﻴﺎﺳﻬﺎ اﻷﺻﻠﻲ
ﻛﻴﻒ ﺗﺨﻔﻲ ﺻﻮرة اﻳﻀﺎ ﻃﺮﻳﻘﻪ ﻣﻔﻴﺪه وﻣﻤﺘﻌﺔ واﻻﺧﻔﺎء ﻻ ﻳﻜﻮن ﻋﻦ ﻃﺮﻳﻖ اﻟﺠﺎﻓﺎ وﻟﻜﻦ ﻋﻦ
ﻃﺮﻳﻖ ﻣﺎ ﻳﺴﻤﻰ ﺑﺎﻟﻨﻤﻂ styleوﺗﺴﺘﺨﺪم اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻻﻋﻄﺎء اﻻﻣﺮ ﻫﺬا ﻓﺎﺋﺪة ﻣﻌﻴﻨﻪ ﺳﻮف
ﺗﺮاﻫﺎ اﻻن ﻟﻨﺮى ﻣﺎ ﻫﻮ اﻻﻣﺮ ﻻﺧﻔﺎء واﻇﻬﺎر اﻟﺼﻮرة visibilityاﻟﺮؤﻳﺔ وﻫﻮ ﻳﺤﺘﺎج اﻟﻰ اﻣﺮﻳﻦ وﻫﻤﺎ
hiddenاﺧﻔﺎء و visibleاﻇﻬﺎر
"Style="visibility: hidden
وﻟﻜﻦ اذا ﻓﻜﺮﻧﺎ ﺑﻄﺮﻳﻘﻪ ﻣﻌﻴﻨﻪ ﻻﺧﻔﺎء ﺻﻮرة ﻋﻨﺪ اﻟﻨﻘﺮ ﻋﻠﻴﻬﺎ ﻛﻴﻒ ﻳﻜﻮن اﻋﺘﻘﺪ اﻧﻨﺎ ﻻ ﺑﺪ ان ﻧﺤﺘﺎج
اﻟﻰ اﻟﺤﺪث onclickﻫﺬا ﺻﺤﻴﺢ اﻧﻈﺮ ﻛﻴﻒ ﻳﻜﺘﺐ ﻫﺬا اﻻﻣﺮ :
><html
><body
></span></pاﻟﺮﺣﻴﻢ ﺑﺴﻢ اﷲ اﻟﺮﲪﻦ>"<p><span lang="ar-sa
><p
>")(<img id="p" src="1.gif" onclick="hidepic
>"<script language="javascript
)(function hidepic
{
)"if(p.style.display=="none
""=p.style.display
else
"p.style.display="none
}
></script
></p
> </span></pاﳊﻤﺪ ﷲ رب اﻟﻌﺎﳌﲔ>"<p><span lang="ar-sa
></body
ﻻﺣﻆ ﻓﻲ ﺣﻴﻦ أﻧﻚ ﺿﻐﻂ ﻋﻠﻰ اﻟﺼﻮرة ﺗﺨﺘﻔﻲ ووﺗﻠﺘﺼﻖ اﻟﻜﺘﺎﺑﺎت ﺑﺒﻌﻀﻬﺎ..
إﺧﻮﺗﻲ ﻛﻞ ﻫﺬه اﻷﻣﻮر ﺗﺪﻋﻰ اﻟﺘﻌﺎﻣﻞ ﻣﻊ اﻷﻧﻤﺎط cssوإن ﺷﺎء اﷲ ﺳﺄﻋﻤﻞ ﻟﻬﺎ دورة ﻣﻦ اﻟﻌﺪﻳﺪ
ﻣﻦ اﻟﺪورس ﺑﻌﺪ دورة اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻟﻤﺎ ﻟﻬﺎ ﻣﻦ أﻫﻤﻴﺔ ﻛﺒﻴﺮة ﻓﻲ ﺑﺮﻣﺠﺔ اﻟﻮﻳﺐ ..
وﻻﻳﻤﻜﻨﻨﺎ أن ﻧﺼﺒﺢ ﻣﺤﺘﺮﻓﻴﻦ ﻓﻲ ﺗﺼﻤﻴﻢ اﻟﻮﻳﺐ وﺑﺮﻣﺠﺘﻪ ﺑﺪون ﺗﻌﻠﻢ اﻷﻧﻤﺎط وﺑﺮﻣﺠﺘﻬﺎ
www.Arab-Team.com
اﻟﺪرس اﻟﻌﺸﺮون
ﻟﻘﺪ وﺻﻠﻨﺎ اﻟﻴﻮم ﻓﻲ درﺳﻨﺎ اﻟﻌﺸﺮﻳﻦ ﻟﻤﻮﺿﻮع ﻫﺎم ﺟﺪاُ وأﻇﻦ أن اﻟﻜﺜﻴﺮ ﻣﻦ اﻟﻤﺸﺎرﻛﻴﻦ ﻓﻲ
اﻟﺪورة ﻓﻲ إﻧﺘﻈﺎره ..
أﻗﻮل ﻋﻦ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ oopوﻟﻜﻨﻬﺎ ﻟﻴﺴﺖ ﻛﺬﻟﻚ ﻓﻲ أﻧﻬﺎ ﻻ ﺗﺪﻋﻢ ﻋﺪة ﻣﻜﻮﻧﺎت ﻣﻦ oopﻣﺜﻞ
اﻟﻮراﺛﺔ ..
ﻟﻘﺪ ﺗﻌﺮﻓﻨﺎ اﻷن ﻋﻠﻰ اﻟﻐﺮض documentوﻳﻘﺼﺪ ﻓﻴﻪ اﻟﺸﺎﺷﺔ اﻟﱵ ﻳﻄﻠﻊ
ﻋﻠﻴﻬﺎ ﻣﻌﻠﻮﻣﺎت ﰲ اﳌﺘﺼﻔﺢ وﻻﺣﻆ أﻧﻪ ﺑﻌﺪ إﺳﻢ اﻟﻐﺮض وﺿﻌﺖ ﻧﻘﻄﺔ ﰒ
وﺿﻌﺖ writeﻫﺬا اﻷﻣﺮ writeﻳﺴﻤﻰ ﻣﻴﺜﻮد أي methodوﻫﻮ ﻳﻜﻮن ﺗﺎﺑﻊ
ﻟﻠﻐﺮض اﻟﺬي ﻛﺘﺐ ﻗﺒﻠﻪ
ﻓﻤﺌﻼ أﻗﻮل ال method writeﺗﺎﺑﻊ ﻟﻞobject document
واﺿﻊ ﺑﻴﻨﻬﻢ ﻋﻼﻣﺔ .ﻧﻘﻄﺔ ...ﻛﻤﺎ ﻳﻠﻲ
document.write
اﻵن اﻟﺴﺆال ﻟﻘﺪ ﺣﺼﻠﺖ ﻋﻠﻰ اﻟﻤﻨﻬﺞ ﻓﻤﺎذا أﻛﺘﺐ إذا أردت ﺗﻄﺒﻴﻖ اﻟﻘﺎﻋﺪة اﻟﺬﻫﺒﻴﺔ ﻟﻠﺠﺎﻓﺎ
ﺳﻜﺮﺑﺖ اﻟﺘﻲ ﻫﻲ:
object.method
ﻟﻘﺪ ﺣﺼﻠﺖ ﻋﻠﻰ الmethod .
اﻵن ﻳﺠﺐ ﻋﻠﻲ أن أﻧﺸﺎ ﻏﺮض ﻟﻜﻲ أﻃﺒﻖ اﻟﻘﺎﻋﺪة وﻟﻜﻦ ﻣﺎﻧﻮع اﻟﻐﺮض اﻵن أﺗﻌﺎﻣﻞ ﻣﻊ اﻟﺘﺎرﻳﺦ
واﻟﻮﻗﺖ إذا ﻫﻮ اﻟﻐﺮضdate
www.Arab-Team.com
أﻛﺘﺐ ﻣﺎﻳﻠﻲ ﻹﻧﺸﺎء اﻟﻐﺮض وﺗﻄﺒﻖ أﺣﺪ اﻟﻤﻨﺎﻫﺞ ﻋﻠﻴﻪ
>"<script LANGUAGE="javascript
;)(RightNow = new Date
))(document.write(RightNow.getDay
></SCRIPT
ﺧﻼﺻﺔ :
اﻟﻜﺎﺋﻨﺎت)اﻷﻏﺮاض( ﻧﻮﻋﻴﻦ ﻓﻲ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ..
-١اﻟﻜﺎﺋﻨﺎت اﻟﻤﺒﻴﺘﺔ.
-٢اﻟﻜﺎﺋﻨﺎت اﻟﻤﻨﺸﺌﺔ ﻳﺪوﻳﺎً ..إذا ﻳﻤﻜﻨﻨﺎ ﻧﺤﻦ أن ﻧﻨﺸﺎً ﻏﺮض ﻣﺎ ....ز
www.Arab-Team.com
اﻟﺪرس اﻟﺤﺎدي واﻟﻌﺸﺮون
ﻳﻮﺟﺪ اﻟﻜﺜﻴﺮ ﻣﻦ اﻟﻜﺎﺋﻨﺎت اﻟﻤﺒﻴﺘﺔ ﻓﻲ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ واﻟﺘﻲ ﺳﺄﺳﺮدﻫﺎ ﻫﻨﺎ وﺳﺄﺷﺮح ﻣﺎﺗﻴﺴﺮ
ﻣﻨﻬﺎ ﺑﺈذن اﷲ ﺗﻌﺎﻟﻰ
ActiveXObject Object
Array Object
Boolean Object
Date Object
Dictionary Object
Drive Object
Drives Collection
Enumerator Object
File Object
Files Collection
FileSystemObject Object
Folder Object
Folders Collection
Global Object
Function Object
Math Object
Number Object
Object Object
RegExp Object
Regular Expression Object
String Object
TextStream Object
VBArray Object
: ﻟﻤﺎ ﻟﻪ أﻫﻤﻴﺔ ﻛﺒﻴﺮة ﻓﻲ ﻋﺎﻟﻢ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖString ﺳﺄﺑﺪاً ﺑﺸﺮح ﻛﺎﺋﻦ اﻟﺴﻼﺳﻞ
ﺛﻢ ﻛﺘﺎﺑﺔstr اﻟﺨﺎﺻﺔ ﻟﻠﻐﺮض ﻋﻦ ﻃﺮﻳﻖ ﻛﺘﺎﺑﺔ إﺳﻢ ﻧﺴﺨﺔ اﻟﻐﺮضmethod وﻳﺘﻢ إﺳﺘﺪﻋﺎء ال
اﻟﻤﻨﻬﺞmethod اﻟﻨﻘﻄﺔ ﺛﻢ ال
str.method1
str.method2
str.method3
www.Arab-Team.com
وﻛﻞ ﻏﺮض ﺑﺈذن اﷲ ﺗﻌﺎﻟﻰ ﺳﺄﺳﺮد ﻟﻜﻢ اﻟﻤﻨﺎﻫﺞ واﻟﺨﺼﺎﺋﺺ اﻟﺨﺎﺻﺔ ﺑﻪ ﺛﻢ أﺷﺮح اﻟﻌﺪﻳﺪ ﻣﻨﻬﺎ
.. وأﺗﻄﺮق ﻟﻤﺎ ﺷﺎء اﷲ ﻣﻦ اﻷﻣﺜﻠﺔ
anchor
big
blink
bold
charAt
charCodeAt
concat
fixed
fontcolor
fontsize
fromCharCode
indexOf
italics
lastIndexOf
link
match
replace
search
slice
small
split
strike
sub
substr
substring
sup
toLowerCase
toUpperCase
toString
valueOf
length Property
prototype Property
www.Arab-Team.com
اﻟﻔﺮق ﺑﻴﻦ اﻟﻤﻨﻬﺞ واﻟﺨﺎﺻﻴﺔ ..
var a=Str.lenght
أي ﻳﻘﺮأ ﻣﻨﻬﺎ أي ﺗﺮﺟﻊ ﻗﻴﻤﺔ ﻣﺜﻼ ﻓﻲ اﻟﻤﺜﺎل ﺗﺎﻟﺒﻲ ﺳﻮف أﻧﺸﺊ ﺳﻜﺮﺑﺖ ﻳﻌﻴﺪ ﻟﻲ ﻋﺪد
اﻷﺣﺮف ..
اﻟﻤﺜﺎل:
ﻻﺣﻆ أﻧﻪ ﻋﻨﺪ ﺗﺸﻐﻴﻞ اﻟﺼﻔﺤﺔ ﻳﻄﺒﻊ ﻟﻚ رﻗﻢ ﺛﻼﺛﺔ ﻷن = xﺛﻼﺛﺔ أﺣﺮف ..
واﻵن ﺳﻮف أﻃﻮر اﻟﻤﺜﺎل ﺣﺘﻰ ﻳﻄﺒﻊ ﻟﻲ ﻋﺪد اﻷﺣﺮف اﻟﺘﻲ أدﺧﻠﻬﺎ ﻓﻲ ﻣﺮﺑﻊ اﻟﻨﺺ ﺑﻮاﺳﻄﺔ ..
><html
><body
><form name=myform
><input type=text name=t1
>")(<input type=button name=b1 Onclick="mofak
></form
><script LANGUAGE = JavaScript
{)(function mofak
;)(var x =new String
;x=myform.t1.value
)document.write(x.length
}
></SCRIPT
ﻻﺣﻆ أﻧﻪ ﻋﻨﺪ اﻟﻨﻘﺮ ﻋﻠﻰ اﻟﺰر ﻳﺘﻢ إﺳﺘﺪﻋﺎء اﻟﻮﻇﻴﻔﺔ mofakواﻟﺘﻲ ﻫﻲ ﺗﻄﺒﻊ ﻋﺪد أﺣﺮف x
وال xﻳﺴﺎوي اﻟﻨﺺ اﻟﻤﻮﺟﻮد ﻓﻲ ﻣﺮﺑﻊ اﻟﻨﺺt1
واﻵن ﺳﺄﺷﺮح اﻟﻌﺪﻳﺪ ﻣﻦ اﻟﻄﺮق methodﺑﻨﻔﺲ اﻟﻄﺮﻳﻘﺔ أﺳﺮد اﻟﻄﺮﻳﻘﺔ وأﻗﻮل ﻣﺎذا ﻋﻤﻠﻬﺎ ﺛﻢ
أﺳﺮد ﻣﺜﺎل ﻋﻠﻴﻬﺎ ..
-١اﻟﻄﺮﻳﻘﺔ)(fontcolor
www.Arab-Team.com
: ﻣﺜﺎل
ﻻﺣﻆ أن اﻟﻄﺮق اﻟﻤﺒﻴﺘﺔ ﻓﻲ أي ﻟﻐﺔ ﻛﺎﻧﺖ ﺗﻌﻄﻲ ﻗﻮة وﻣﺮوﻧﻪ وﺳﻬﻮﻟﻪ ﻓﻲ اﻟﻌﻤﻞ وﺗﻮﻓﺮ ﻣﻦ
وﺑﺎﻟﺴﺒﺔ ﻟﻠﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﺗﻌﺘﺒﺮ ﻃﺮﻗﻬﺎ وأﻏﺮاﺻﻬﺎ اﻟﻤﺒﻴﺘﺔ ﻣﻤﺘﺎزة ﺟﺪاً ﻣﻘﺎرﻧﺔ....... اﻟﻮﻗﺖ اﻟﻜﺜﻴﺮ
.. ﺑﺒﺎﻗﻲ اﻟﻠﻐﺎت
: toLowerCase() اﻟﻄﺮﻳﻘﺔ-٢
.....وﻫﺬه ﻟﺘﺤﻮﻳﻞ اﻷﺣﺮف ﻣﻦ اﻟﻜﺒﻴﺮ إﻟﻰ اﻟﺼﻐﻴﺮ ﻟﻬﺎ اﻟﻜﺜﻴﺮ ﻣﻦ اﻹﺳﺘﺨﺪاﻣﺎت ﻓﻲ ﺑﺮاﻣﺞ اﻟﻮﻳﺐ
:ﻣﺜﺎل
وﻟﻜﻦ ﺑﻌﺪ ﺗﻄﺒﻴﻖx وأﺳﻨﺪﻧﺎ إﻟﻴﻪ ﻗﻴﻤﺔ اﻟﻤﺘﺤﻮلtemp ﻻﺣﻆ أﻧﻨﺎ ﻗﻤﻨﺎ ﻳﺈﻧﺸﺎء ﻣﺘﺤﻮل إﺳﻤﻪ
.. وﻟﻜﻦ ﺑﺄﺣﺮف ﺻﻐﻴﺮةx ﺗﺴﺎوي ﻗﻴﻤﺔ اﻟﻤﺘﺤﻮلtemp اﻟﻤﻨﻬﺞ ﻋﻠﻴﻪ ﻓﻴﺼﺒﺢ ﻗﻴﻤﺔ اﻟﻤﺘﺤﻮل
www.Arab-Team.com
-٣اﻟﻄﺮﻳﻘﺔ اﻟﺜﺎﻟﺜﺔ)(: toUpperCase
وﻫﺬه ﺗﺤﻮل ﻣﻦ اﻷﺣﺮف اﻟﺼﻐﻴﺮة إﻟﻰ اﻟﻜﺒﻴﺮة .....وﺗﻄﺒﻴﻖ اﻟﻤﺜﺎل اﻟﺴﺎﺑﻖ ﺑﻔﻲ ﺑﺎﻟﻐﺮض ﺑﺲ
إﺳﺘﺒﺪل اﻟﻄﺮﻳﻘﺔ )( toLowerCaseﺑﺎﻟﻄﺮﻳﻘﺔ)(toUpperCase
وإﻟﻰ ﻫﻨﺎ اﻟﻴﻮم أﻛﺘﻔﻲ وﻓﻲ اﻟﻤﺴﺎء ﺳﺄﻣﻜﻞ إن ﺷﺎء اﷲ ....ﻓﻲ ﺗﻄﺒﻴﻘﺎت ﻋﻤﻠﻴﺔ ﻋﻠﻰ
اﻟﻨﺼﻮص ..
www.Arab-Team.com
اﻟﺪرس اﻟﺜﺎﻧﻲ واﻟﻌﺸﺮون
: match() اﻟﻄﺮﻳﻘﺔ
وﺗﻘﻮم ﻫﺬه اﻟﻄﺮﺑﻘﺔ ﺑﺈرﺟﺎع اﻟﻜﻠﻤﺔ اﻟﺘﻲ ﻧﺘﺄﻛﺪ ﻣﻦ وﺟﻮدﻫﺎ ﻓﻲ اﻟﻨﺺ وإذا ﻟﻢ ﺗﻜﻦ ﻣﻮﺟﻮد ﺗﻌﻮد
nullﺑﺎﻟﻘﻴﻤﺔ
: ١ﻣﺜﺎل
<html>
<body>
<form name=myform>
<input type=text name=t1>
<input type=button name=b1 Onclick="mofak()">
</form>
<script LANGUAGE = JavaScript>
function mofak()
{
var x =new String();
";ﺑﺴﻢ اﷲ اﻟﺮﲪﻦ اﻟﺮﺣﻴﻢx="
document.write(x.match(myform.t1.value));
}
</SCRIPT>
.. أﻛﺘﺐ ﻓﻲ داﺧﻞ ﻣﺮﺑﻊ اﻟﻨﺺ ﻛﻠﻤﺔ "اﷲ" وﺳﺘﻼﺣﻆ أﻧﻪ ﻗﺎم ﺑﻄﺒﻌﻬﺎ
null وﺟﺮﺑﺄن ﺗﻜﺘﺐ ﻛﻠﻤﺔ أﺧﺮة ﻏﻴﺮ ﻣﻮﺟﻮدة ﻣﺜﻞ "ﻻﻳﺒﻼي" وﺳﺘﻼﺣﻆ أﻧﻪ ﻃﺒﻊ اﻟﻘﻴﻤﺔ
: اﻟﻜﻮد
<html>
<body>
<form name=myform>
<input type=text name=t1>
<input type=button name=b1 Onclick="mofak()">
</form>
<script LANGUAGE = JavaScript>
function mofak()
{
www.Arab-Team.com
var x =new String();
x=";"اﷲ اﻟﺮﲪﻦ اﻟﺮﺣﻴﻢ ﺑﺴﻢ
if (x.match(myform.t1.value) != null )
document.write("<h1>"+" "ﻣﱪوك اﻟﻜﻠﻤﺔ ﻣﻮﺟﻮدة+"</h1>");
else
document.write(";)"اﻟﻜﻠﻤﺔ ﻏﲑ ﻣﻮﺟﻮدة
}
</SCRIPT>
html
anchor Method -١
big Method -٢
blink Method -٣
bold Method -٤
fixed Method -٥
charAt
<html>
<body>
<form name=myform>
<input type=text name=t1>
<input type=button name=b1 Onclick="charAtTest()">
</form>
<script LANGUAGE = JavaScript>
function charAtTest()
{
var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var s;
s = str.charAt(myform.t1.value);
document.write(s);}
</SCRIPT>
ﻻﺧﻄـﺎً وﻻﺷـﻲ.. ﻣﺎﻟﺨﻄـًﺎc ... ﻳﻌﻄﻴﻨـﺎ٢ وﻋﻨﺪ ﻛﺘﺎﺑـﺔb ﻳﻌﻄﻴﻨﺎ اﻟﺤﺮف١ ﻻﺣﻆ ﻋﻨﺪ ﻛﺘﺎﺑﺔ اﻟﺮﻗﻢ
....... وﻫﻜﺬا٠ ﻟﻪ اﻟﻘﻴﻤﺔa وﻟﻜﻦ ﻫﺬه اﻟﺪاﻟﺔ ﺗﻌﺪ اﻷﺣﺮف ﻣﻦ اﻟﺼﻔﺮ أي اﻟﺤﺮف
وإذا رأدت إﺻﻼح اﻟﻤﺸﻜﻠﺔ ﺑﻜﻞ ﺑﺴﺎﻃﺔ ﻗﻢ ﺑﺈﻧﻘﺎص واﺣﺪ ﻣﻦ اﻟﻘﻴﻤﺔ اﻟﺘﻲ ﻳﺪﺧﻠﻬﺎ اﻟﻤﺴﺘﺨﺪم
: ﺣﺘﻰ ﻳﺼﺒﺢ اﻟﻜﻮد ﻛﺎﻟﺘﺎﻟﻲ
<html>
<body>
<form name=myform>
<input type=text name=t1>
<input type=button name=b1 Onclick="charAtTest()">
</form>
<script LANGUAGE = JavaScript>
function charAtTest()
{
var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var s;
s = str.charAt(myform.t1.value-1);
document.write(s);}
</SCRIPT>
www.Arab-Team.com
s = str.charAt(myform.t1.value-1);ﻻﺣﻆ أﻧﻲ ﻋﺪﻟﺖ ﻓﻘﻂ اﻟﺴﻄﺮ
........وﻫﻜﺬا ﺗﻘﺪر أﻧﺖ أن ﺗﺘﺤﻜﻢ ﺑﺎﻟﻄﺮق ﻋﻠﻰ ذوﻗﻚ واﺣﺘﻴﺎﺟﺎت ﺑﺮﻧﺎﻣﺞ
....واﻵن ﺳﻮف أﻛﺘﺐ ﻣﺜﺎل ﻳﻘﻮﻳﻨﺎ ﻓﻲ اﻟﺨﻮازﻣﻴﺎت ﻋﻠﻰ ﺷﺎن ﻣﺆﺛﺮات اﻟﺠﺎﻓﺎ
<form name=myform>
<input type=text name=t1>
<input type=button name=b1 Onclick="charAtTest()">
</form>
<script LANGUAGE = JavaScript>
function charAtTest()
{
var str = myform.t1.value;
var s;
for(i=1; i<=26;i++)
{
s = str.charAt(i-1);
document.write(s+"<hr>");}
}
</SCRIPT>
ﻳﻘﻮم ﺑﻄﺒﺎﻋﺔ ﻛﻞ ﺣﺮف ﻋﻠﻰ ﺳﻄﺮ وﻟﻜﻦ ﻣﺎذاt1 ﻻﺣﻆ أﻧﻨﺎ إذا ﻗﻤﻨﺎ ﺑﻜﺘﺎﺑﺔ اﻷﺣﺮف اﻷﺑﺠﺪﻳﺔ ﻓﻲ
دورة٢٦ ﺣﺮف أي إﺳﻤﻲ ﻣﺜﻼً "ﻣﻮﻓﻖ" وﺣﻠﻘﺔ اﻟﻔﻮر ﺗﻌﻤﻞ٢٦ ﻟﻮ ﻛﻨﺖ أرﻳﺪ ﻛﺘﺎﺑﺔ ﻧﺺ أﺻﻐﺮ ﻣﻦ
.... ؟؟؟؟؟؟؟؟؟؟ ﻛﻴﻒ ذﻟﻚ....
lengthﺗﺬﻛﺮ اﻟﺪرس اﻟﻤﺎﺿﻲ اﻟﺨﺎﺻﻴﺔ
ﺣﺘﻰ ﻳﺼﺒﺢ اﻟﻜﻮد..... إذا ﺳﺄﻋﻤﻞ ﻋﺪد دورات اﻟﺤﻠﻘﺔ ﺑﻌﺪد أﺣﺮف اﻟﻨﺺ ؟ ﺷﻠﻮﻧﻲ ﻣﻌﻚ
: ﻛﺎﻟﺘﺎﻟﻲ
<body>
<form name=myform>
<input type=text name=t1>
<input type=button name=b1 Onclick="charAtTest()">
</form>
<script LANGUAGE = JavaScript>
function charAtTest()
{
var str = myform.t1.value;
var s;
for(i=1; i<=str.length;i++)
{
s = str.charAt(i-1);
document.write(s+"<hr>");}
}
</SCRIPT>
.. واﷲ اﻵن أﻧﺎ ﻧﻌﺴﺖ ﻛﺜﻴﺮ ﻷﻧﻮا ﺻﺎرت اﻟﺴﺎﻋﺔ اﻟﺜﺎﻣﻨﺔ ﺻﺒﺎﺣﺎ وﺣﺘﻰ اﻵن ﻟﻢ أﻧﻢ
.. وأﺣﻼم ﺳﻌﻴﺪة واﻟﺴﻼم ﻋﻠﻴﻜﻢ
..............واﷲ ﻳﺰﻗﻜﻢ رؤﻳﺔ اﻟﺤﺒﻴﺐ ﻣﺤﻤﺪ ﻓﻲ اﻟﻤﻨﺎم
www.Arab-Team.com
اﻟﺪرس اﻟﺜﺎﻟﺚ واﻟﻌﺸﺮون
إﺧﻮﺗﻲ اﻟﻜﺮام ﺳﻨﻜﻤﻞ ﻣﺸﻮارﻧﺎ اﻟﻴﻮم ﻣﻊ اﻟﻐﺮض Stringوﺷﺮح ﻃﺮﻗﻪ ..وﺧﻮاﺻﻪ..
ﻫﻞ ﻫﻮ ﺳﺤﺮ ؟؟؟؟ ﻟﻘﺪ ﻇﻬﺮ ﺣﺮف ال mﻧﻌﻢ إﻧﻪ ﻛﻮد ﺣﺮف اﻟـــ m ...ﻧﻌﻢ ﻟﻜﻞ ﻛﻮد ﻛﻮد أﺳﻜﻲ
ﻣﺜﻼً ﺣﺮف aﻟﻪ اﻟﻜﻮد .. ٩٧ﻋﻠﻰ ﻓﻜﺮة a = 97وﻫﻮ ﺣﺮف ﺻﻐﻴﺮ واﻟﺤﺮف اﻟﻜﺒﻴﺮ Aﻟﻪ ﻛﻮد آﺧﺮ
A=65
وﻛﻮد enterﻫﻮ ١٣واﻹﺳﻜﻴﺐ ٢٧واﻟﻔﺮاغ ... 32اﻟﺦ واﻵن ﺳﺄﺗﻄﺮق ﻟﺪاﻟﺔ ﺗﺤﻮل ﻟﻲ اﻟﺤﺮف
إﻟﻰ ﻓﻴﻤﺘﻪ ﻓﻲ اﻷﺳﻜﻲ ...وﻟﻬﺬه اﻟﺪاﻟﺔ اﻟﻔﻮاﺋﺪ اﻟﻜﺜﻴﺮة ﻣﻦ أﺣﺪﻫﺎ ﺗﺸﻔﻴﺮ اﻟﻨﺼﻮص .
ﻣﺜﺎل :
><html
><body
><form name=myform
><input type=text name=t1
>")(<input type=button name=b1 Onclick="charAtTest
></form
><script LANGUAGE = JavaScript
)(function charAtTest
{
;var str = myform.t1.value
;var s
;)s = str.charCodeAt(1- 1
;)document.write(s
}
></SCRIPT
></body
www.Arab-Team.com
أﻛﺘﺐ أي ﺣﺮف ﻓﻲ ﻣﺮﺑﻊ اﻟﻨﺺ وﺳﺘﻼﺣﻆ أن ﻃﺒﻊ ﻋﻠﻰ اﻟﺼﻔﺤﺔ ..
><html
><body
><form name=myform
><input type=text name=t1
>")(<input type=button name=b1 Onclick="charAtTest
></form
><script LANGUAGE = JavaScript
)(function charAtTest
{
;var str = myform.t1.value
;"var s="0
)for(i=1;i<=str.length;i++
;)s = s + str.charCodeAt(i- 1
;)document.write(s
}
></SCRIPT
></body
ﻫﺬا اﻟﻤﺜﺎل ﺗﻜﺘﺐ ﻟﻪ ﻋﺒﺎرة أو ﺟﻤﻠﺔ أو ﻛﻠﻤﺔ أو ﺣﺮف ﻓﻴﻌﻄﻴﻚ ﻛﻮد اﻷﺳﻜﻲ ﻟﻜﻞ اﻟﻌﺒﺎرة ..
ﻻﺣﻆ ﻣﺎذا ﻳﺤﺼﻞ ﻟﻘﺪ ﻋﻤﻠﺖ ﺣﻠﻘﺔ ﻣﻦ اﻟﻮاﺣﺪ أي ﻣﻦ اﻟﺤﺮف رﻗﻢ ١إﻟﻰ ﻋﺪد أﺣﺮف اﻟﺠﻤﻠﺔ
ﺛﻢ ﻳﺤﺼﻞ ﻋﻠﻰ ﻛﻮد اﻷﺳﻜﻲ ﻟﻠﺤﺮف اﻷول وﻳﺨﺰﻧﻪ ﻓﻲ اﻟﻤﺘﺤﻮل sوﻫﻜﺬا ﺣﺘﻰ اﻟﺤﺮف اﻷﺧﻴﺮ
ﻓﺘﺼﺒﺢ ﻗﻴﻤﺔ اﻟﻤﺘﺤﻮل sﺗﺴﺎوي ﻗﻴﻢ اﻷﺳﻜﻲ ﻟﻜﻞ اﻷﺣﺮف ...ﺛﻢ ﻓﻲ ﻧﻬﺎﻳﺔ اﻟﺒﺮﻧﺎﻣﺞ ﻃﺒﻌﻨﺎ
ﻗﻴﻤﺔ اﻟﻤﺘﺤﻮل s
concat
ﻣﻊ أﻧﻨﺎ ﻧﺴﺘﻄﻴﻊ ﺟﻤﻊ اﻟﺴﻼﺳﻞ ﻋﻦ ﻃﺮﺑﻖ +وﻟﻜﻦ ﻫﺬه اﻟﻄﺮﻳﻘﺔ ﻣﻮﺟﻮدة وﺑﺼﺮاﺣﺔ ﻟﻢ أﺟﺪ
ﻣﺒﺮرا ﻟﻮﺿﻌﻬﺎ ﺑﺪﻻً ﻋﻦ +وﻟﻜﻦ ﻫﺬا ﻣﺜﺎل وﻇﻴﻔﺔ ﻋﻨﻬﺎ :
)(function concatDemo
{
"var str1 = "ABCDEFGHIJKLM
;"var str2 = "NOPQRSTUVWXYZ
;)var s = str1.concat(str2
// Return concatenated string.
;)return(s
}
www.Arab-Team.com
fontsize Method
: ﻣﺜﺎل
fromCharCode
: ﻣﺜﺎل
:indexOf
ﻣﺜﺎل
أﻣﺎ إذا ﻛﺘﺒﺖ ﻟﻪstr1 ﺿﻤﻦ اﻟﺴﻠﺴﺔ اﻟﻜﺒﻴﺮةBABEB ﻷﻧﻪ وﺟﺪ اﻟﺴﻠﺴﺔ٠ ﻻﺣﻆ أﻧﻪ ﺳﻴﻄﺒﻊ
١- ﻏﻴﺮ ذﻟﻚ ﻓﺴﻴﻄﺒﻊ
str1 إذا وﺟﺪ اﻟﺴﻠﺴﻠﺔ ﺿﻤﻦ اﻟﺴﻠﺴﺔ٠ ﻳﻌﻨﻲ
str1 إذا ﻟﻢ ﻳﺠﺪ اﻟﺴﻠﺴﻠﺔ ﺿﻤﻦ اﻟﺴﻠﺴﻠﺔ١- و
www.Arab-Team.com
italics Method
وﻫﺬا اﻟﻤﻨﻬﺞ ) اﻟﻄﺮﻳﻘﺔ( ﻫﻮ ﻻزم أﺷﺮﺣﻪ ﻣﻊ اﻟﻄﺮق اﻟﺘﻲ ﺗﺤﻮل اﻟﺴﻼﺳﻞ ﻓﻲ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ
html ..إﻟﻰ ﺳﻤﺎت
: ﻣﺜﺎل
link
وﻟﻜﻦ ﺑﻜﻞ ﺳﻬﻮﻟﺔ ﻳﺠﻮل اﻟﻨﺺ إﻟﻰ راﺑﻂ ﺗﺸﻌﺒﻲ... وﻫﻮ أﻳﻀﺎ ﻳﺠﺐ ﻛﻨﺖ أﺷﺮﺣﻪ ﻓﻴﻤﺎ ﻣﻀﻰ
:ﻣﺜﺎل
replace
: ﻣﺜﺎل
function ReplaceDemo()
{
;var r, re;
;var s = "The quick brown fox jumped over the lazy yellow
dog.";
re = /fox/;
;r = s.replace(re, "pig");
;document.write (r);
}
www.Arab-Team.com
اﻟﺪرس اﻟﺮاﺑﻊ واﻟﻌﺸﺮون
درﺳﻨﺎ ﺑﺈذن اﷲ ﺗﻌﺎﻟﻰ اﻵن ﻋﻦ اﻟﻤﺼﻔﻮﻓﺎت وﻫﻮ ﻏﺮض ﻫﺎم ﻓﻲ ﻛﻞ ﻟﻐـﺎت اﻟﺒﺮﻣﺠـﺔ ....وﻻﻳﻜـﺎد
ﻣﺸﺮوع أو ﺳﻜﺮﺑﺖ ﻳﺨﻠﻮا ﻣﻦ اﻟﻤﺼﻔﻮﻓﺎت ..
وﻫﺬا ﻣﺜﺎل ﻳﺒﻴﻦ ﻛﻴﻒ ﺗﻌﺮﻳﻒ ﻣﺼﻔﻮﻓﺔ وﺗﺨﺰﻳﻦ ﻗﻴﻢ ﻗﻴﻢ ﺑﺪاﺧﻠﻬﺎ وﻗﺮاءة أﺣﺪ اﻟﺒﻨﻮد.....
ﻫﺬا اﻟﻤﺜﺎل ﻳﻌـﺮف اﻟﻤﺼـﻔﻮﻓﺔ ﻓـﻲ اﻟﺴـﻄﺮ اﻷول ﻣـﻦ اﻟﺴـﻜﺮﺑﺖ ...ﺛـﻢ ﺑﻌـﺪ ذﻟـﻚ ﺑـﺪأت ﺑﺤﺸـﻮ
اﻟﻤﺼﻔﻮﻓﺔ ﺑﺎﻷﺳﻤﺎء وأول ﻋﻨﺼﺮ ﻓﻲ اﻟﻤﺼﻔﻮﻓﺔ ﻫﻮ ... ٠اﻟﺦ
أﻣﺎ اﻵن ﻓﺴﺄﻗﻮم ﺑﻨﻔﺲ اﻟﺨﻄﻮات وﻟﻜﻦ ﺳﺄﻗﻮم ﺑﻄﺒﺎﻋﺔ ﻛﻞ ﻋﻨﺎﺻﺮ اﻟﻤﺼﻔﻮﻓﺔ ﻋﻦ ﻃﺮﻳﻖ ﺣﻠﻘـﺔ
for ...
واﻵن ﺳﺄﺣﺸﻮ ﻋﻨﺎﺻﺮ اﻟﻤﺼﻔﻮﻓﺔ ﻋﻦ ﻃﺮﻳﻖ ﺣﻠﻘﺔ وأﻗﻮم ﺑﻘﺮاءة ﻋﻨﺼﺮ ﻣﺎ ﻣﻦ ﻫﺬه اﻟﻤﺼﻔﻮﻓﺔ
واﻵن ﺳـﻮف أﻗـﻮم ﺑﻜﺘﺎﺑـﺔ ﺳـﻜﺮﺑﺖ ﻳﻄﻠـﺐ ﻣـﻦ اﻟﻤﺴـﺘﺨﺪم أن ﻳـﺪﺧﻞ ﻟـﻪ أرﺑﻌـﺔ أرﻗـﺎم وﻳﻌﻄﻴـﻪ
اﻟﻤﺘﻮﺳﻂ اﻟﺤﺴﺎﺑﻲ ﻟﻬﻢ....
ﻻﺣﻆ ﻓﻲ أول ﺣﻠﻘﺔ ﻛﺎﻧﺖ ﻣﺮﺣﻠﺔ اﻹدﺧﺎل واﻟﺤﻠﻘـﺔ اﻟﺜﺎﻧﻴـﺔ ﻟﻤﺮﺣﻠـﺔ ﻣﺠﻤـﻮع ﻋﻨﺎﺻـﺮ اﻟﻤﺼـﻔﻮﻓﺔ
رﻗﻤﻴﺎً .....وآﺧﺮ ﻣﺮﺣﻠﺔ ﻫﻲ ﻃﺒﺎﻋﺔ اﻟﻤﺠﻤﻮع وﻟﻜﻦ ﻣﻘﺴﻢ ﻋﻠﻰ ﻋﺪد ﻋﻨﺎﺻﺮ اﻟﻤﺼﻔﻮﻓﺔ.....
ﻣﻼﺣﻈﺔ:
اﻵن أدﺧﻞ أرﺑﻌﺔ أﻋﺪاد ﻓﻘﻂ .....ﻣﺎذا ﻟﻮ أدﺧﻠﺖ ١٠أﻋﺪاد ؟ ﺗﻘﻮل ﻟـﻲ أﻏﻴـﺮ رﻗـﻢ ٤ﻓـﻲ ﻣﺮﺣﻠـﺔ
اﻟﻄﺒﺎﻋﺔ إﻟﻰ ١٠وأﻏﻴﺮ اﻟﺤﻠﻘﺔ اﻷوﻟﻰ إﻟﻰ ﻋﺸﺮ دورات...
ﺻﺤﻴﺢ ﻳﻤﻜﻦ ﻫﺬا وﻟﻜﻦ أﻧﺖ ﺗﺠﺒﺮ اﻟﻤﺴﺘﺨﺪم ﻋﻠﻰ ﻋﺪد ﻣﻌﻴﻦ.....
ﻣﺎاﻟﺤﻞ ؟
اﻟﺤﻞ ﻫﻮ أن ﺗﻌﻤﻞ ﺣﻠﻘﺔ whileﻓﻲ اﻟﺒﺪاﻳﺔ وﺷﺮﻃﻬﺎ ﻃﺎﻟﻤﺎ prmptﻏﻴـﺮ ﻓـﺎﺋﻲ ﻳﻈـﻞ ﻳـﺪﺧﻞ ﻗـﻴﻢ
ﻓﻲ ﻋﻨﺎﺻﺮ اﻟﻤﺼﻔﻮﻓﺔ ..وﻛﻞ دورة ﻟﻞ whileﻳﺠـﺐ أن ﻳـﺰداد ﻣﺘﺤـﻮل ﻣـﺎ وﻟـﻴﻜﻦ numﻣـﺮة واﺣـﺪ
ﻟﻜــﻲ ﻧﻘﺴــﻢ ﻋﻠﻴــﻪ ﻓــﻲ اﻟﻨﻬﺎﻳــﺔ ﻟﻨﻌــﺮف ﻋــﺪد اﻷرﻗــﺎم اﻟﺘــﻲ أدﺧﻠﻬــﺎ اﻟﻤﺴــﺘﺨﺪم............
واﻟﺴﻼم ﻋﻠﻴﻜﻢ
www.Arab-Team.com
ﻧﺴﻴﺖ أن أﻗﻮل ﻛﻢ ﺻﺒﻐﻮ ﻣﻦ ﺻﻴﻎ اﻹدﺧﺎل اﻟﺴﺮﻳﻊ ﻟﻠﻤﺼﻔﻮﻓﺔ وﻫﻲ أﺛﻨﺎء اﻟﺘﻌﺮﻳﻒ:
;a[0]=0
;a[1]=1
;a[2]=2
;a[3]=3
;a[4]=4
www.Arab-Team.com
اﻟﺪرس اﻟﺨﺎﻣﺲ واﻟﻌﺸﺮون
Array
ﻣﺜﺎل :
ﻻﺣﻆ أﻧﻪ ﺳﻴﺘﻢ ﻃﺒﺎﻋﺔ اﻟﺮﻗﻢ ٥وذﻟﻚ ﻋﻠﻰ ﻋﺪد ﻋﻨﺎﺻﺮ اﻟﻤﺼﻔﻮﻓﺔ
وأﻧﺎ أﻋﻄﻴﺘﻜﻢ وﻇﻴﻔﺔ ﻓﻲ اﻟﺪرس اﻟﻤﺎﺿﻲ ،ﻓﺒﻬﺬه اﻟﺨﺎﺻﻴﺔ ﻳﺴﻬﻞ ﺣﻞ اﻟﺘﻤﺮﻳﻦ
ﺑﺈن ﻧﻘﻮم ﺑﺘﻘﺴﻢ ﻣﺠﻤﻮع ﻋﻨﺎﺻﺮ اﻟﻤﺼﻔﻮﻓﺔ ﻋﻠﻰ ﻋﺪدﻫﻢ
ﺛﺎﻧﻴﺎً :
prototype Propertyﻟﻴﻀﻢ ﻣﺮﺟﻊ أو ﻳﻀﻴﻒ ﻣﻨﻬﺞ ﻟﻠﻐﺮض اﻟﺬي ﻫﻮ ﻣﺼﻔﻮﻓﺘﻨﺎ :
) (function array_max
{
;]var i, max = this[0
)for (i = 1; i < this.length; i++
{
)]if (max < this[i
;]max = this[i
}
ﺑﺮﺟﻊ اﻟﻔﺎﻧﻜﺸﻦ أﻛﱪ ﻋﻨﺼﺮ ﰲ اﳌﺼﻔﻮﻓﺔreturn max; //
}
ﻟﻘﺪ ﻋﺮﻓﻨﺎ أن اﳌﻨﻬﺞ ﻣﺎﻛﺲ Array.prototype.max = array_max; ;//
ﻫﻮ ﻧﻔﺴﻪ اﻟﻔﺎﻧﻜﺸﻦ أري ﻣﺎﻛﺲ
xﻫﻨﺎ أﻧﺸﺄﻧﺎ ﻣﺼﻔﻮﻓﺔvar x = new Array(1, 2, 3, 4, 5, 6); //
ﻣﺘﺤﻮل ﻳﺴﻨﺪ إﻟﻴﻪ أﻛﱪ ﻋﻨﺼﺮ ﻣﻦ ﻫﻨﺎ ﻧﻨﺸﺊvar y = x.max( ); //
إﻛﺲ اﳌﺼﻔﻮﻓﺔ
ﺑﺲ أﻧﺎ آﺳﻒ إن ﻛﻨﺖ ﻛﺘﺒﺖ ﺑﺎﻟﻌﺮﺑﻲ ﺑﻌﺾ اﻟﻤﺼﻄﻠﺤﺎت اﻷﺟﻨﺒﻴﺔ وﻟﻜﻦ ﻟﻜﻲ ﺗﻘﺮأ ﻣﻌﻜﻢ ﻓﻠﻮ أﻧﻲ
وﺿﻌﺘﻬﺎ ﺑﺎﻟﻠﻐﺔ اﻻﺟﻨﺒﻴﺔ ﻟﻤﺎ ﻇﻬﺮت ﺑﻬﺬ اﻟﺘﺮﺗﻴﺐ.....
www.Arab-Team.com
أراﻳﺘﻢ ﻗﻮة إﺳﺘﺨﺪام ﻫﺬه اﻟﺨﺎﺻﻴﺔ ،وﺗﺴﺘﻄﻴﻊ أن ﺗﻀﻴﻒ أﻛﺜﺮ ﻣﻦ ﺧﺎﺻﻴﺔ ﺑﻨﻔﺲ ﻫﺬه اﻟﻄﺮﻳﻘﺔ
ﻋﻠﻰ ﻓﻜﺮة أرﻳﺪﻛﻢ أن ﺗﻌﺸﻘﻮا thisﻷﻧﻪ ﻳﻘﻮي ﺑﺮاﻣﺠﻜﻢ ﺑﺸﻜﻞ ﻓﻈﻴﻊ ...وﻣﺎ ﺑﺲ ﻓﻲ ﻟﻐﺔ
اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻻ ﺑﻞ ﺑﻠﻜﻞ اﻟﻠﻐﺎت ( Action script - php -java - c ) .....وﻛﻞ ﻟﻐﺎت اﻟﺒﺮﻣﺠﺔ
اﻟﻐﺮﺿﻴﺔ ...
www.Arab-Team.com
اﻟﺪرس اﻟﺴﺎدس واﻟﻌﺸﺮون
ﻣﺜﺎل :
)(function ConcatArrayDemo
{
;var a, b, c
;)a = new Array(0,1,2,3,4
;)b = new Array(5,6,7,8,9
;)c = a.concat(b
;)return(c
}
ﺛﺎﻧﻴﺎً:
ﺗﺤﻮل ﻋﻨﺎﺻﺮ اﻟﻤﺼﻔﻮﻓﺔ إﻟﻰ ﺳﻠﺴﻠﺔ ﻧﺼﻴﺔ واﺣﺪة ةﺗﻔﺼﻞ ﺑﻴﻨﻬﻤﺎ ﺑﺈﺣﺮف أو ﻛﻠﻤﺔ ﻧﺤﻦ ﻧﺤﺪدﻫﺎ
ﻣﺜﺎل :
www.Arab-Team.com
ﺛﺎﻟﺜﺎً reverseوﻫﺬا اﻟﻤﻨﻬﺞ ﻫﺎم ﺟﺪاً وﻳﺴﺘﺨﺪم ﻟﻘﻠﺐ ﺗﺮﺗﻴﺐ ﻋﻨﺎﺻﺮ اﻟﻤﺼﻔﻮﻓﺔ .
ﻣﺜﺎل :
ﻟﻈﻠﺖ اﻟﻤﺼﻔﻮﻓﺔ ﻋﻠﻰ ﺣﺎﻟﻬﺎ ﻷﻧﻚ ﺑﺪأت ﻣﻦ اﻟﺼﻔﺮ وأﻧﻬﻴﺖ ١-ﻳﻌﻨﻲ آﺧﺮ ﻋﻨﺎﺻﺮ اﻟﻤﺼﻔﻮﻓﺔ...
ﻣﺜﺎل :
ﻻﺣﻆ ﻫﺬا اﻟﺴﻜﺮﺑﺖ ﻳﻘﺘﻄﻊ أول ﻋﻨﺼﺮﻳﻦ ﻣﻦ اﻟﻤﺼﻔﻮﻓﺔ ﻣﺒﺎﺷﺮة ،وﻫﺬا ﻳﻬﻮن ﻋﻠﻴﻚ ﻛﺘﺎﺑﺔ
اﻟﺤﻠﻘﺎت وﺗﻮﻗﻴﻌﻚ ﻓﻲ ﻣﺸﺎﻛﻞ أﻧﺖ ﻓﻲ ﻏﻨﻰ ﻋﻨﻬﺎ ..
ﻣﺜﺎل :
www.Arab-Team.com
;)document.write (l
></SCRIPT
ﻻﺣﻆ أﻧﻪ ﺗﻢ اﻟﻔﺮز ﻋﻠﻰ أﺳﺎس ﻋﻨﺎﺻﺮ اﻷﺳﻜﻲ ﻓﺄﺻﻔﺮ ﻋﻨﺼﺮ أﺳﻜﻲ ﻓﻲ اﻟﻤﺼﻔﻮﻓﺔ ﻫﻮ اﻟﺤﺮف
١ﺛﻢX
وﻫﺬا رﺗﺐ ﻋﻨﺎﺻﺮ اﻟﻤﺼﻔﻮﻓﺔ ﻣﻦ اﻟﺼﻐﻴﺮ إﻟﻰ اﻟﻜﺒﻴﺮ ﻃﻴﺐ ﻣﺎذا أدرﻧﺎ ﻣﻦ اﻟﻜﺒﻴﺮ إﻟﻰ اﻟﺼﻐﻴﺮ ﻣﺎذا
ﻧﻔﻌﻞ ......ﺑﺴﻴﻄﺔ راﺟﻊ اﻟﻤﻨﻬﺞ رﻗﻢ ٣وﻫﻮ reverse
ﻫﺬه ﻛﻞ ﻣﻨﺎﻫﺞ اﻟﻐﺮض Arrayإﻧﻪ ﻣﻦ أﻫﻢ أﻏﺮاض اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ أﺗﻤﻨﻰ ﻟﻮ ﺗﺘﻘﻨﻮه ﺑﺸﻜﻞ ﺟﻴﺪ
ﻷﻧﻪ ﻳﻔﻴﺪﻛﻢ ﻓﻲ ﻛﺜﻴﺮ ﻣﻦ اﻟﺘﻤﺎرﻳﻦ ..
www.Arab-Team.com
اﻟﺪرس اﻟﺴﺎﺑﻊ واﻟﻌﺸﺮون
Date
getDate Method
getDay Method
getFullYear Method
getHours Method
getMilliseconds Method
getMinutes Method
getMonth Method
getSeconds Method
getTime Method
getTimezoneOffset Method
getUTCDate Method
getUTCDay Method
getUTCFullYear Method
getUTCHours Method
getUTCMilliSeconds Method
getUTCMinutes Method
getUTCMonth Method
getUTCSeconds Method
getVarDate Method
getYear Method
setDate Method
setFullYear Method
setHours Method
setMilliSeconds Method
setMinutes Method
setMonth Method
setSeconds Method
setTime Method
setUTCDate Method
setUTCFullYear Method
setUTCHours Method
setUTCMilliseconds Method
setUTCMinutes Method
setUTCMonth Method
setUTCSeconds Method
setYear Method
toGMTString Method
toLocaleString Method
toUTCString Method
www.Arab-Team.com
.. UTC ﺑﻮﺟﺪ ﺑﻌﺾ اﻟﻤﻨﺎﻫﺞ ﺑﺪاﺧﻠﻪ.. ﻛﻞ ﻫﺬه اﻟﻤﻨﺎﻫﺞ ﻣﻌﺮوف ﻣﻦ ﺧﻼل إﺳﻤﻪ
GMT وﻫﺬا ﻳﻌﻨﻲ ﻋﻠﻰ ﺗﻮﻗﻴﺖ ﻏﺮﻳﻨﻴﺘﺶgetUTCMonth Method ﻣﺜﻞ
وﻟﻘﺪ ﺗﻜﻠﻤﻨﺎ ﻋﻦ ﺑﻌﺾ اﻷﻣﺜﻠﺔ ﻓﻲ اﻟﺪرس اﻟﺜﺎﻧﻲ... وﻛﻞ اﻟﻤﻨﺎﻫﺞ ﻳﺘﻢ ﻣﻌﺎﻣﻠﺘﻬﺎ ﻧﻔﺲ اﻟﻤﻌﺎﻣﻠﺔ
..........أو اﻟﺜﺎﻟﺚ ﻟﻢ أﻋﺪ أذﻛﺮ
Math
abs Method
acos Method
asin Method
atan Method
atan2 Method
ceil Method
cos Method
exp Method
floor Method
log Method
max Method
min Method
pow Method
random Method
round Method
sin Method
sqrt Method
tan Method
ﻣﺜﺎل :
ﻻﺣﻆ اﻟﻤﺜﺎل اﻟﺘﺎﻟﻲ ﻳﻄﺒﻊ ﻛﻞ ﻣﺮة رﻗﻢ ﻋﺸﻮاﺋﻲ ﻣﻦ ﺑﻴﻦ اﻟﺼﻔﺮ و ١٠٠أﻳﺐ ﻗﺴﻴﻤﺔ dوﻟﻜﻦ ﻣﺎذا
ﻟﻮ أردت أن ﻳﻌﻄﻴﻨﻲ ﻗﻴﻤﺔ ﺻﺤﻴﺤﺔ ،وﻳﻠﺰﻣﻨﻲ ﻟﺒﻨﺎءﻣﺆﺛﺮات ﻟﺼﻔﺤﺘﻲ أن أﺣﺼﻞ ﻋﻠﻰ رﻗﻢ ﺻﺤﻴﺢ
ﻛﻞ ﻣﺮة ﻷﺳﺘﻔﻴﺪ ﻣﻨﻪ ،ﺑﻜﻞ ﺑﺴﺎﻃﺔ أﻗﻮل ﻟﻚ إﺳﺘﺨﺪام ﻣﻨﻬﺞ اﻟﺘﺪوﻳﺮ ..اﻟﺬي ﻳﻠﻐﻲ اﻟﻔﺎﺻﻠﺔ
اﻟﻌﺎﺋﻤﺔ اﻟﺬي ﻫﻮfloor
وﻫﻜﺬا ﻓﺈﻧﻚ أول ﻣﺎﺗﻌﻤﻞ اﻟﺼﻔﺤﺔ ﻳﻌﻄﻴﻚ ﻛﻞ ﻣﺮة رﻗﻢ ﺷﻜﻞ ..
وﻫﻨﺎ ﻳﺄﺗﻲ ﺧﻴﺎﻟﻚ ﻣﻦ اﻹﺳﺘﻔﺎدة ﻣﻦ ﻫﺬه اﻟﺮﻗﻢ ..
وﺳﺄﻋﺮض ﻟﻚ ﻓﻜﺮﺗﻴﻦ وأﻧﺖ ﻋﻠﻴﻚ اﻟﺒﺎﻗﻲ:
:
www.Arab-Team.com
my_array[9]=";"اﻟﻠﻬﻢ ﺻﻠﻲ ﻋﻠﻰ ﺳﻴﺪﻧﺎ ﳏﻤﺪ
var i=Math.random()*9;
i=Math.floor(i);
document.write (my_array[i]);
</SCRIPT>
وﻋﺪد اﻟﻤﺼﻔﻮﻓﺔ٠ ﻳﺨﺘﺎر رﻗﻢ ﻣﺎﺑﻴﻦrandom أرأﻳﺖ ﻫﺬا اﻟﻤﺜﺎل ﻳﺤﺘﺎج ﻟﻤﺼﻔﻮﻓﺎت و اﻟﻤﻨﻬﺞ
........... وﻳﻄﺒﻌﻪ٩ اﻟﺬي ﻫﻮ
.. ﺟﺎﻧﺐ اﻟﺼﻔﺤﺔ٩ ﻣﺮﻗﻤﺔ ﻣﻦ اﻟﺼﻔﺮ ﺣﺘﻰjpg ﻣﻊ وﺿﻊ ﺗﺴﻊ ﺻﻮرة ﻣﻦ ﻻﺣﻈﺔ
:
وﻫﺬا ﻧﻜﻮن ﻗﺪ أﻧﻬﻴﻨﺎ درﺳﻨﺎ اﻟﻴﻮم وإﻟﻰ اﻟﺘﻄﺒﻴﻘﺎت اﻟﻌﻤﻠﻴﺔ ﺑﺈذن اﷲ
www.Arab-Team.com
اﻟﺪرس اﻟﺜﺎﻣﻦ واﻟﻌﺸﺮون
إﺧﻮﺗﻲ ﻟﻘﺪ ﺣﺎن اﻵن ﻟﺘﻮزﻳﻊ اﻟﻜﻮد إﻟﻰ ﻋﺪة ﺻﻔﺤﺎت ،
أﻟﻢ ﺗﻮزﻋﺔ اﻟﻜﻮد ﻓﻲ اﻟﻠﻐﺎت اﻟﺜﺎﻧﺒﺔ ﻣﺜﻞ phpأو cوﻛﻨﺘﻢ ﺗﻀﻤﻨﻮﻫﺎ include
إﻧﻬﺎ ﻧﻔﺲ اﻟﻤﺒﺪأ ...وإذا ﻛﻨﺖ ﻻﺗﻌﺮف ﻫﺬه اﻟﻠﻐﺎت ﻻﻋﻠﻴﻚ .
اﻟﺨﻄﻮات :
{ )(function hello
;)'alert('Hello World
}
{ )(function mofak
;)'ﻋﻠﻴﻜﻢ أﻟﻴﺴﺖ ﻓﻜﺮة راﺋﻌﺔ اﻟﺴﻼم'(alert
}
-٢اﻟﺨﻄﻮة اﻟﺜﺎﻧﻴﺔ :ﻫﻲ اﻹﺳﺘﻔﺎدة ﻣﻦ ﻫﺬه اﻟﻮﻇﺎﺋﻒ ﻓﻲ ﺻﻔﺤﺔ اﻹﻧﺘﺮﻧﺖ ﻋﻨﺪﻧﺎ ..
><html
><head
><script src="library.js"></script
></head
>")(<body onLoad="hello
>")(<input type="button" name="b1" Onclick="mofak
></body
></html
><script src="library.js"></script
www.Arab-Team.com
ﺛﻢ ﻣﻦ ﺑﻌﺪﻫﺎ ﻧﺴﺘﺪﻋﻲ اﻟﻮﻇﺎﺋﻒ ﺑﺸﻜﻞ ﻃﺒﻴﻌﻲ ..
ﻻﺣﻆ أﻧﻪ ﻋﻦ ﺗﺤﻤﻴﻞ اﻟﺼﻔﺤﺔ ﻳﺘﻢ ﺗﺸﻐﻴﻞ اﻟﻮﻇﻴﻔﺔhello
وﻋﻨﺪ اﻟﻨﻘﺮ ﻋﻠﻰ اﻟﺰر ﻳﺘﻢ ﺗﺸﻐﻴﻞ اﻟﻮﻇﻴﻔﺔmofak
ﻣﻼﺣﻈﺔ :إﺧﻮﺗﻲ ﻫﺬه اﻟﻄﺮﻳﻘﺔ ﺣﻠﻮة ﻛﺜﻴﺮ وﺳﻬﻠﺔ وﺗﺴﻬﻞ ﻋﻠﻴﻨﺎ ﺗﻨﻈﻴﻢ اﻟﺒﺮﻧﺎﻣﺞ وﺗﺴﻬﻞ ﻣﺠﺎل
اﻟﺘﻄﻮﻳﺮ وإﻋﺎدة اﻹﺳﺘﺨﺪام ..
ﻳﻌﻨﻲ إﻧﺘﻲ ﺑﺘﺼﻤﻢ اﻟﻤﻠﻔﺎت اﻟﺨﺎرﺟﻴﺔ اﻟﺘﻲ ﻫﻲ اﻟﻤﻜﺎﺗﺐ أو اﻟﻮﻇﺎﺋﻒ اﻟﺘﻲ ﺗﺴﺘﺨﺪﻣﻬﺎ
ﺑﺈﺳﺘﻤﺮار ﺛﻢ ﺗﺴﺘﺪﻋﻴﻬﺎ ﻣﻦ ﺟﻤﻴﻊ ﻣﻮاﻗﻊ اﻟﻮﻳﺐ اﻟﺘﻲ ﺗﺼﻤﻤﻬﺎ ..
www.Arab-Team.com
اﻟﺪرس اﻟﺘﺎﺳﻊ واﻟﻌﺸﺮون
ﻟﻘﺪ ﺗﻌﻠﻤﻨﺎ ﻛﻴﻒ ﻛﺘﺎﺑﺔ ﻛﻮد javascriptﻣﻦ ﺧﻼل اﻟﺜﻼﺛﻴﻦ درس اﻟﺬﻳﻦ ﻣﻀﻮا ..وﻟﻜﻨﻨﺎ ﻣﻊ وﺻﻮﻟﻨﺎ
إﻟﻰ آﺧﺮ اﻵﺧﺮ ﻟﺪروس اﻷﺳﺎﺳﻴﺎت ﻻﺑﺪ أن ﻧﻜﺘﺐ اﻟﻜﻮد ﺑﻄﺮﻳﻘﺔ إﺣﺘﺮاﻓﻴﻪ ..
<script language="JavaScript"><!--
;)"document.write("Hello world
>//--></script
ﻻﺣﻆ أﻧﻪ ﺑﻌﺪ اﻟﻤﻌﺮف > <scriptوﺿﻌﺖ ﻛﻮد اﻟﺘﻌﻠﻴﻖ <!--اﻟﺘﺎﺑﻊ ﻟﻜﻮد html
وﻗﺒﻞ إﻏﻼق اﻟﻤﻌﺮف > <scriptوﺿﻌﺖ ﻧﻬﺎﻳﺔ اﻟﺘﻌﻠﻴﻖ>//--
ﻟﻤﺎذا ؟؟؟؟
ﻟﻨﻔﺮض أن اﻟﻤﺘﺼﻔﺤﺔ ﻟﺴﺒﺐ ﻣﻦ اﻷﺳﺒﺎب ﻻﻳﻘﺒﻞ ﺟﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻟﻌﺪة أﺳﺒﺎب ﻣﻨﻬﺎ:
-١اﻟﻤﺘﺼﻔﺢ ﻗﺪﻳﻢ.
-٢ﺗﻌﻄﻴﻞ اﻟﻤﺴﺘﺨﺪم ﻟﺒﺮاﻣﺞ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ.
-٣ﻋﻄﻞ ﻣﻦ ﻋﻨﺪ اﻟﻤﺘﺴﺘﺨﺪم.
-٤ﻏﻴﺮ ذﻟﻚ....
ﻋﻨﺪﻫﺎ ﻣﺎذا ﻳﺤﺼﻞ ﺳﻴﻌﺮض ﻛﻮد javascripﻛﻨﺺ htmlﻋﺎدي إذا ﺑﺪﻻ ﻣﻦ ﺗﻨﻔﻴﺬ اﻟﻜﻮد ﻳﻈﻬﺮ
ﻛﻨﺺ وﻫﺬا ﻣﻤﺎ ﻳﻌﻴﺐ ﻣﻮﻗﻌﻨﺎ ،ﻓﻠﺬﻟﻚ وﺿﻌﺖ رﻣﻮز اﻟﺘﻌﻠﻴﻘﺎت..
وأﻛﻮدﻧﺎ ﻳﺠﺐ ﻛﻠﻬﺎ أن ﺗﺤﻮي ﻋﻠﻰ ﻫﺬه اﻟﺘﻌﻠﻴﻘﺎت ..
ﻳﻮﺟﺪ اﻟﻴﻮم أﻛﺜﺮ ﻣﻦ ﻋﺸﺮة إﺻﺪارات ﻟﻠﺠﺎﻓﺎ وﺳﺄﻋﺮض أﻛﺜﺮﻫﺎ إﺳﺘﺨﺪاﻣﺎ ﻓﻲ اﻟﻤﺘﺼﻔﺤﺎت اﻵن:
وﻟﻜﻦ ﻋﻠﻰ ﻓﻜﺮة أود أن أﻟﻔﺖ إﻧﺘﺒﺎﻫﻜﻢ إﻟﻰ أﻧﻪ ﻳﻮﺟﺪ ﻧﻮﻋﻴﻦ ﻣﻦ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ
javascript -١ﻟﺸﺮﻛﺔ netscape
jscript -٢ﺷﺮﻛﺔ microsoft
آﺧﺮ إﺻﺪار ﻟﻠﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻫﻮ ١٫٥ودﻋﻮم ﻣﻦ ﻗﺒﻞ netscape
أﻣﺎ ﻣﺎﻳﺮوﺳﻮﻓﺖ ﻓﻬﻲ jsscript 5.5وﻣﺪﻋﻮﻣﺔ ﻣﻊ اﻟﻤﺘﺼﻔﺤﺔ ٥٫٥ﻃﺒﻌﺎ ﻟﻴﺲ اﻟﻔﺮق اﻟﺬي
ﺗﺘﺨﻴﻠﻮه ﺑﻴﻦ اﻟﻠﻐﺔ واﻷﺧﺮى ..
www.Arab-Team.com
أﺧﻲ اﻟﻜﺮﻳﻢ ﻣﻮﻓﻖ ﻟﻘﺪ أﺿﻌﺘﻨﺎ ﺑﺈﺳﺘﻌﺮاﺿﻚ ﻷﻧﻮاع اﻟﺠﺎﻓﺎ وإﺻﺪاراﺗﻬﺎ ﻓﺒﺄي إﺻﺪار ﻧﻜﺘﺐ وﻛﻴﻒ
ﻧﻌﺮف أي إﺻﺪار وﻣﺘﺼﻔﺤﻨﺎ ﻣﺎذا ﻳﺪﻋﻢ ....اﻟﺦ
-١ﻟﻤﻌﺮﻓﺔ ﻣﺎذا ﻳﺪﻋﻢ ﻣﺘﺼﺤﻔﺤﻚ ﻣﻦ إﺻﺪار اﻟﺠﺎﻓﺎ ﻓﻴﺠﺐ ﻋﻠﻴﻚ إﺳﺘﺨﺪام اﻟﺤﻴﻠﺔ اﻟﺘﺎﻟﻴﺔ:
<html><head><title>JavaScript
Version</title></head><body><script language="JavaScript"><!-
-// JavaScript 1.0 and abovedocument.write('<p>Supports
JavaScript</p>');//--></script><script
language="JavaScript1.1"><!--// JavaScript 1.1 and
abovedocument.write('<p>Supports JavaScript 1.1</p>');//--
></script><script language="JavaScript1.2"><!--// JavaScript
1.2 and abovedocument.write('<p>Supports JavaScript
1.2</p>');//--></script><script language="JavaScript1.3"><!--
// JavaScript 1.3 and abovedocument.write('<p>Supports
JavaScript 1.3</p>');//--></script><script
language="JavaScript1.4"><!--// JavaScript 1.4 and
abovedocument.write('<p>Supports JavaScript 1.4</p>');//--
></script><script language="JavaScript1.5"><!--// JavaScript
1.5 and abovedocument.write('<p>Supports JavaScript
>1.5</p>');//--></script></body></html
أﻛﺘﺐ اﻟﻜﻮد اﻟﺘﺎﻟﻲ وﻻﺣﻆ أﻧﻨﻲ وﺿﻌﺖ أﻛﻮاد اﻟﺘﻌﻠﻖ أي إذا اﻟﻤﺘﺼﻔﺢ ﻟﻢ ﻳﻔﻬﻢ إﺻﺪار اﻟﻠﻐﺔ
ﻻﻳﻨﻔﺬ اﻟﺘﻌﻠﻴﻤﺎت وﻻﻳﻄﺒﻌﻬﺎ ﻛﻨﺺ ﻋﺎدي ..ﺷﻮ رأﻳﻚ ...
2-وﻋﻠﻰ ﻛﻞ ﺣﺎل ﻳﻮﺟﺪ ﻣﺮﺟﻊ ﻟﻠﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ إﺳﻤﻪ microsoft jscript referenceإذا دﺧﻠﺖ
إﻟﻰ ﻣﻮﻗﻊ ﻣﺎﻳﻜﺮوﺳﻮﻓﺖ ﻓﻴﻪ ﻣﻜﺘﻮب رﻗﻢ اﻹﺻﺪار ﺣﺎول أن ﺗﻨﺰﻟﻪ إﻟﻰ ﺣﺎﺳﺒﻚ وﻳﻜﻮن ﻣﺮﺟﻊ إﻟﻴﻚ
وﺣﺎول داﺋﻤﺎً أن ﻻﺗﻜﺘﺐ ﺑﺂﺧﺮ إﺻﺪار ﻟﻬﺎ ﻓﺮﺑﻤﺎ اﻟﻤﺘﺼﻔﺤﺎت اﻟﻌﺪاﻳﺔ اﻟﻤﻮﺟﻮد ﻻﺗﻘﺒﻠﻬﺎ وﻻﺗﺤﺘﺎج
اﺗﺤﺪﻳﺚ ..
وﻛﻤﺎ ﻳﻘﻮل اﻟﻤﺜﻞ ﻻﺗﻨﺎم ﺑﻴﻦ اﻟﻘﺒﻮر وﺗﺸﻮف ﻣﻨﺎﻣﺎت وﺣﺸﺔ ..
ﻓﻼﺗﺨﻠﻲ اﻟﻨﺎس ﺗﻨﻔﺮ ﻣﻦ ﻣﻮﻗﻌﻚ ..
وﺑﺎﻟﻨﺴﺒﺔ ﻟﺸﺮﻛﺔ ﻣﺎﻳﻜﺮوﺳﻮﻓﺖ وﻧﻴﺘﺴﻜﻴﺐ ﻓﻘﺪ ﺟﻌﻼ ﻓﻲ ﻟﻐﺘﻬﻤﺎ ﺗﻮاﻓﻴﻘﺔ ﻣﻮﻃﺒﻴﻌﺔ ﻣﻦ أﺳﻤﺎء
اﻟﺪوال وﻏﻴﺮﻫﺎ ﻣﻊ أﻧﻬﻤﺎ ﻓﺮ ﺣﺮب ﺿﺪ ﺑﻌﻀﻬﻤﺎ وﻟﻜﻦ ﻫﺬا ﻣﻦ ﻧﺎﺣﻴﺔ ﺗﺠﺎرﻳﺔ ﺑﺤﺘﺔ ..
www.Arab-Team.com
NOSCRIPT
ﻣﺎذا ﻳﻔﻌﻞ وﻣﺎذا ﻳﻌﺮضjavacript ﻳﻮﺿﻊ إذا ﻛﺎن اﻟﻤﺘﺼﻔﺤﺔ ﻻﻳﺪﻋﻢhtml ﻳﻮﺟﺪ ﻣﻌﺮف
.. ﻟﻠﻤﺴﺘﺨﺪم
<html>
<head>
<title>noscript</title>
</head>
<body>
<script language="JavaScript"><!--
document.write('Last modified: ');
document.write(document.lastModified);
//--></script>
<noscript>
Last modified: sep ;2002
</noscript>
</body>
</html>
< ﻻﺣﻆ أﻧﻪ ﻳﻨﻔﺬ اﻟﺘﻌﻠﻴﻤﺔ وﻟﻠﻔﺎﺋﺪة ﻫﺬه اﻟﺘﻌﻠﻴﻤﺔscript> ﻻﺣﻆ ﻓﻲ ﺣﺎل ﻣﻌﺮﻓﺔ اﻟﻤﺘﺼﻔﺢ ﻟﻠﺘﺎغ
document.write(document.lastModified);
<noscript>
Last modified: sep ;2002
</noscript>
<ﻣﺎﻧﺸﺎء ﺑﺄن ﻧﻌﺮض ﻟﻪ ﻧﺺ أﻧﻪ ﻳﻠﺰﻣﻚ ﺗﻄﻮر ﻣﺘﺼﻔﺤﻚnoscript> وﻻﺣﻆ أﻧﻨﺎ ﻧﻀﻊ ﻣﺎﺑﻴﻦ اﻟﻮﺳﻢ
www.Arab-Team.com
اﻟﺪرس اﻟﺜﻼﺛﻮن
ﻫﻞ ﺳﺒﻖ ﻟﻚ وأﻧﻚ رأﻳﺖ ﺻﻮرة ﻓﻲ ﻣﻮﻗﻊ إﻧﺘﺮﻧﺖ ﺗﺘﺤﺮك ﻳﻤﻴﻨﺎ وﻳﺴﺎراً وﻏﻴﺮ ذﻟﻚ ﻣﻦ اﻟﻤﺆﺛﺮات
اﻟﻤﺘﺤﺮﻛﺔ ،ﻫﻞ ﻃﺮﺣﺖ ﻋﻠﻰ ﻧﻔﺴﻚ ﺳﺆال ﻛﻴﻒ ﺻﻨﻌﺖ ﻫﺬه ؟
ﻋﻠﻰ ﻛﻞ ﺣﺎل أﻃﺮﺣﺖ أم ﻟﻢ ﺗﻄﺮح إﻟﻴﻚ اﻟﺤﺎل.
ﺗﻌﺮﻳﻒ اﻟﺘﺎﻳﻤﺮ :ﻳﻨﻔﺬ وﻇﻴﻔﺔ ﻣﺎ ﺑﻌﺪ ﻣﺪة ﻧﺤﻦ ﻧﺤﺪدﻫﺎ ﻟﻪ ﺑﺎﻟﻤﻴﻠﻲ ﺛﺎﻧﻴﺔ ..
ﻳﻌﻨﻲ ﻛﻞ = ١٠٠٠ﺛﺎﻧﻴﺔ ..
اﻟﻜﻮد :
>)(<body onload=mofak
>"<script LANGUAGE="JavaScript
;var i=0
)(function hello
{
;)"alert("welcome in my site
}
)(function mofak
{
;)setTimeout('hello()',3000
}
></SCRIPT
ﻻﺣﻆ أﻧﻪ أول ﻣﺎﺣﻤﻠﺖ اﻟﺼﻔﺤﺔ ﺗﺴﺘﺪﻋﻲ اﻟﻮﻇﻴﻔﺔ mofakواﻟﺘﻲ ﺑﺪاﺧﻼ إﺳﺘﺨﺪﻣﺖ أﻣﺮ اﻟﺘﺎﻳﻤﺮ
اﻟﺬي ﺷﻐﻞ ﻟﻲ اﻟﻮﻇﻴﻔﺔ hello
إذا اﻟﺘﺎﻳﻤﺮ ﻳﻨﻔﺬ ﻣﺮة واﺣﺪة إﻻ إذا أﻋﺪت ﺗﻜﺮار إﺳﺘﺨﺪاﻣﻪ
>)(<body onload=mofak
><form name=f1
><input type=text name=t1
></form
>"<script LANGUAGE="JavaScript
;var i=0
)(function mofak
www.Arab-Team.com
{
i++;
f1.t1.value=i;
setTimeout('mofak()',100);
}
</SCRIPT>
، وﻓﻲ داﺧﻠﺔ ﻳﺴﺘﺪﻋﻲ اﻟﺘﺎﻳﻤﺮ ﻧﻔﺲ اﻹﺟﺮاءmofak ﻻﺣﻆ أول ﻣﺎﺗﻌﻤﻞ اﻟﺼﻔﺤﺔ ﺗﻨﻔﺬ اﻹﺟﺮاء
واﻟﺬي ﺑﺪاﺧﻠﻪ إﺳﺘﺪﻋﺎء ﻧﻔﺴﻪ ﻣﺮة أﺧﺮىmofak ﻧﻔﺬ اﻟﺘﺎﻳﻤﺮ اﻹﺟﺮاء: ﻻﺣﻆ ﻫﻨﺎ ﺗﻜﻤﻦ اﻟﺨﺪﻋﺔ
وﻳﻈﻬﺮ رﺳﺎﻟﺔ ﺑﻌﺪﻫﺎ ﺣﻴﻦ إﻧﺘﻬﺎء اﻟﻌﺪ١٠٠ واﻵن ﺳﻮف أﻃﻮر اﻟﺘﻤﺮﻳﻦ ﺑﺤﻴﺚ ﻳﻌﺪ ﻓﻘﻂ إﻟﻰ اﻟﺮﻗﻢ
<body onload=mofak()>
<form name=f1>
<input type=text name=t1>
</form>
<script LANGUAGE="JavaScript">
var i=0;
function mofak()
{
i++;
f1.t1.value=i;
if(i<100)
setTimeout('mofak()',100);
else
alert("OOOOOOO Stop!!!!!!");
}
</SCRIPT>
وﺳﺄرﻳﻚ ﺗﻤﺎرﻳﻦ أﻫﻢ ﺑﻜﺜﻴﺮ ﺑﻌﺪ ﺷﻮي ﺑﺈذن اﷲ، ﻫﻞ ﻻﺣﻈﺖ ﻣﺪى ﻗﻮة اﻟﺘﺎﻳﻤﺮ
<body onload=mofak()>
<div id="ja" > </div>
<script LANGUAGE="JavaScript">
var i=0;
function mofak()
{
i++;
document.all["ja"].innerHTML = i;
if(i<100)
setTimeout('mofak()',100);
else
alert("OOOOOOO Stop!!!!!!");
}
</SCRIPT>
all وﺑﻜﻦ ﻫﻨﺎ ﻓﻲ اﻟﻤﺘﺼﻔﺢ إﺳﻤﻬﺎlayer ﻻﺣﻆ ﻫﺬا اﻟﻤﺜﺎل ﻳﻜﺘﺐ ﻋﻠﻰ ﻃﺒﻘﺔ
www.Arab-Team.com
اﻟﺦ..... ﻳﻌﻄﻴﻨﺎ ﺗﺄﺛﻴﺮات أﺟﻤﻞ ﻷﻧﺎ ﻧﺘﺤﻤﻚ ﺑﺎﻟﻮن اﻟﺨﻂ وﺣﺠﻤﺔdiv وdiv ﻳﻌﻨﻲ اﻟﻜﺘﺎﺑﺔ ﺿﻤﻦ اﻟـــ
ﻷن اﻹﺳﻢ ﻳﻬﻢ ﻋﻨﺪ ﻛﺘﺎﺑﺔ اﻟﺴﻄﺮja أﻧﺎ ﺳﻤﺘﻬﺎdiv ﻃﺒﻌﺎً ﻻﺗﻨﺴﻰ أن ﺗﻌﻄﻲ إﺳﻢ ﻟﻞ
document.all["ja"].innerHTML = i;
<script LANGUAGE="JavaScript">
function blinkit(){
intrvl=0;
for(nTimes=0;nTimes<10;nTimes++){
intrvl = intrvl+400;
setTimeout("document.bgColor='#0000FF';",intrvl);
intrvl =intrvl+ 400;
setTimeout("document.bgColor='#FFFFFF';",intrvl);
}
}
</SCRIPT>
<BODY>
<CENTER>
<FORM>
<INPUT TYPE="BUTTON" VALUE="Blink" onClick="blinkit()">
</FORM>
<BODY onLoad="start()">
<script LANGUAGE="JavaScript">
var pos = 10;
function initArray() {
this.length = initArray.arguments.length;
for (var i = 0; i < this.length; i++) {
this[i] = initArray.arguments[i];
}
}
var col=new initArray();
function start() {
col[1]="red"
col[2]="yellowgreen"
col[3]="yellow"
www.Arab-Team.com
"col[4]="whitesmoke
"col[5]="white
"col[6]="wheat
"col[7]="violet
"col[8]="turquoise
"col[9]="tomato
"col[10]="thistle
;pos++
{ )if (pos>=10
;pos = 0
}
;]document.bgColor = col[pos
;)loopID = setTimeout("start()",1000
}
></SCRIPT
;this.length = initArray.arguments.length
ﻣﻼﺣﻈﺔ :
إﻟﻰ اﻹﺧﻮة اﻟﻤﺒﺘﺪﺋﻴﻦ ﻓﻲ اﻟﺒﺮﻣﺠﺔ اﻟﺬﻳﻦ ﻳﻀﺎﻳﻘﻬﻢ اﻟﻌﻨﺼﺮ thisﻳﻤﻜﻨﻬﻢ اﻹﺳﺘﻐﻨﺎء ﻋﻨﻪ ﺑﺘﻤﺮﻳﺮ
وﺳﻴﻄﺎت أو ﺑﺎﻹﺳﺘﻐﻨﺎء ﻋﻦ اﻟﻜﺜﻴﺮ ﻣﻦ اﻟﻮﻇﺎﺋﻒ ..
وﻟﻜﻦ ﺳﻴﻜﻮن اﻟﻌﻤﻞ أﻃﻮل وﻏﻴﺮ ﻗﺎﺑﻞ ﻟﻠﺘﻄﻮر ..
وﻟﻜﻦ ﻣﺒﺪﺋﻴﺎً رﻳﺜﻤﺎ ﻳﺘﻜﻤﻦ ﻣﻦ أﺳﺎﺳﻴﺎت اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ ..
www.Arab-Team.com
اﻟﺪرس اﻟﻮاﺣﺪ واﻟﺜﻼﺛﻮن
ﻟﻘﺪ ﺗﻜﻠﻤﻨﺎ ﻓﻔﻲ اﻟﺪروس اﻟﻤﺎﺿﻴﺔ ﻋﻦ اﻷﻏﺮض واﻷﺣﺪاث واﻟﺨﺼﺎﺋﺺ واﻟﻤﻨﺎﻫﺞ واﻟﻤﺘﻐﻴﺮات
اﻟﻤﺼﻔﻮﻓﺎت واﻟﻮﻇﺎﺋﻒ وﺑﻌﺾ ﻣﻦ أﻏﺮاض اﻟﻤﺘﺼﻔﺢ explorerوﻣﻨﺎﻫﺠﻬﺎ ....واﻟﻴﻮم ﺳﻨﻜﺘﻜﻢ ﻋﻦ
اﻟﻤﻌﺎﻣﻼت Operators
+اﻟﺠﻤﻊ
-اﻟﻄﺮح
/اﻟﻘﺴﻤﺔ
*اﻟﻀﺮب
وﻻأﺣﺪ ﻣﻨﺎ ﻻﻳﻌﺮف إﺳﺘﺨﺪام ﻫﺬه اﻟﻌﻤﻴﺎت
www.Arab-Team.com
ﻣﺜﻞ:
var a=4*5
أو
var a
var b
var c=a/b
=
b=5
a=b
ﻻﺣﻆ ﻓﻲ اﻟﺴﻄﺮ اﻷول ﺗﻢ إﺳﻨﺎد اﻟﻄﺮف اﻷﻳﻤﻦ إﻟﻰ اﻟﻄﺮف اﻷﺑﺴﺮ أي ﺗﻢ إﺳﻨﺎد اﻟﺮﻗﻢ ٥إﻟﻰ
اﻟﻤﺘﺤﻮلb
وﻓﻲ اﻟﺴﻄﺮ اﻟﺜﺎﻧﻲ ﺛﻢ إﺳﻨﺎد اﻟﻤﺘﺤﻮل اﻷﻳﻤﻦ bإﻟﻰ اﻟﻤﺘﺤﻮل اﻷﻳﺴﺮa
وﻳﻤﻜﻨﻚ إﺳﺘﺪام ﺻﻴﻐﺔ ﻣﺘﻘﺪﻣﺔ ﻟﻬﺬه اﻟﻠﻌﻼﻣﺔ ﺑﺄن ﺗﻘﻮم ﺑﻌﻤﻠﺘﻴﻦ ﻣﻌﺎً
-١إﺳﻨﺎد
-٢ﻣﺴﺎواة
ﻣﺜﻞ
;j = k = l = 0
ﻻﺣﻆ أﻧﻪ ﺑﻬﺬه اﻟﻌﻤﻠﻴﺔ ﺗﻢ إﺳﻨﺎد اﻟﻘﻴﻤﺔ ٠إﻟﻰ ﺟﻤﻴﻊ اﻟﻤﺘﺤﻮﻻت اﻟﺘﻲ ﻋﻠﻰ ﻳﺴﺎرﻫﺎ
,
>"<script LANGUAGE="JavaScript
)for (i = 0 ,j=10; i <= 10; i++, j++
{
;) document.write(i+" "+j
;)">document.write("<br
}
></SCRIPT
www.Arab-Team.com
ﻻﺣﻆ أﻧﻪ ﺗﻢ وﺿﻊ ﺗﻌﺒﻴﺮﻳﻦ ﺿﻤﻦ ﺣﻠﻘﺔ اﻟﻔﻮر اﻟﻮاﺣﺪة وذﻟﻚ ﻳﻮﻓﺮ ﻋﻠﻴﻚ إﻧﺸﺎء ﺣﻠﻘﺔ ﺛﺎﻧﻴﺔ وﺛﺎﻟﺜﺔ
ﻻﺣﻆ ﻫﺬا اﻟﻤﺜﺎل ﺳﺘﺨﺪم ﺗﻌﺒﻴﺮ اﻟﻔﺎﺻﺔ ﻣﺮﺗﻴﻦ ﻟﺘﻌﺮﻳﻒ ﺛﻼث ﺗﻌﺎﺑﻴﺮ ﺿﻤﻦ اﻟﺤﻠﻘﺔ:
ﻻﺣﻆ ﻗﻴﻤﺔ iﺗﺰداد واﺣﺪ واﺣﺪ وﻗﻴﻤﺔ jﻫﻲ ﻗﻴﻤﺔ iﻣﻀﺮوﺑﺔ ب ٢وﻗﻴﻤﺔ xﻫﻲ ﻗﻴﻤﺔ jﻣﻀﺮوﺑﺔ
ب.. ٢
وﻫﺬه ﻫﻲ اﻟﻌﻼﻣﺎت:
<أﻛﺒﺮ
>أﺻﻐﺮ
=<أﻛﺒﺮ أو ﺗﺴﺎوي
=>أﺻﻔﺮ أوﺗﺴﺎوي
><BODY
><form name=f1
><input type=text name=text_input
<input type=button value=click_here name=b1
>")(onclick="check
></form
>"<script LANGUAGE="JavaScript
)(function check
{
;))(document.write(compare
}
)(function compare
{
)if (f1.text_input.value==10
;"ﳑﺘﺎز" return
www.Arab-Team.com
if (f1.text_input.value>=7)
return ";"ﺟﻴﺪ
if (f1.text_input.value>=5)
return ";"وﺳﻂ
if (f1.text_input.value<=4)
return ;";"ﺿﻌﻴﻒ
}
</SCRIPT>z
<BODY>
<form name=f1>
<b>please enter password : </b>
<input type=text name=text_input>
<input type=button value=click_here name=b1
onclick="check()">
</form>
<script LANGUAGE="JavaScript">
function check()
{
var value=f1.text_input.value;
if (value==123)
alert("Yes Good !!!! This is password ");
else
alert("NO NO !!!!!! invalid Password");
}
</SCRIPT> <BODY>
<form name=f1>
<b>please enter password : </b>
<input type=text name=text_input>
<input type=button value=click_here name=b1
onclick="check()">
</form>
<script LANGUAGE="JavaScript">
function check()
{
var value=f1.text_input.value;
if (value==123)
alert("Yes Good !!!! This is password ");
else
alert("NO NO !!!!!! invalid Password");
}
</SCRIPT>
www.Arab-Team.com
ﻣﻘﺎرﻧﺔ ﻧﻮع اﻟﻤﺘﺤﻮلIdentity -٣
<BODY>
<form name=f1>
<input type=button value=click_here name=b1
onclick="check()">
</form>
<script LANGUAGE="JavaScript">
function check()
{
var a=6;
var b=6;
if(a===b)
alert(";)"ﻣﺘﺸﺎﲠﲔ ﻧﻮع اﳌﺘﺤﻮﻟﲔ
if(a!==b)
alert(" اﻏﲑ ﻣﺘﺸﺎﲠﲔ ﰲ اﻟﻨﻮع#################")
}
</SCRIPT>
<BODY>
<form name=f1>
<input type=button value=click_here name=b1
onclick="check()">
</form>
<script LANGUAGE="JavaScript">
function check()
{
var a="6";
var b=6;
if(a===b)
alert(";)"ﻣﺘﺸﺎﲠﲔ ﻧﻮع اﳌﺘﺤﻮﻟﲔ
if(a!==b)
alert(" اﻏﲑ ﻣﺘﺸﺎﲠﲔ ﰲ اﻟﻨﻮع#################")
}
</SCRIPT>
www.Arab-Team.com
: ﻏﻴﺮ اﻟﻘﻴﻤﺔ وﻏﻴﺮ اﻟﻨﻮع: ٣ ﻣﺜﺎل
<BODY>
<form name=f1>
<input type=button value=click_here name=b1
onclick="check()">
</form>
<script LANGUAGE="JavaScript">
function check()
{
var a="1234"
var b=6;
if(a===b)
alert(";)"ﻣﺘﺸﺎﲠﲔ ﻧﻮع اﳌﺘﺤﻮﻟﲔ
if(a!==b)
alert(" اﻏﲑ ﻣﺘﺸﺎﲠﲔ ﰲ اﻟﻨﻮع#################")
}
</SCRIPT>
أرﺟﻮا أن ﺗﻜﻮﻧﻮا ﻗﺪ اﺳﺘﻔﺪﺗﻢ ﻣﻦ ﻫﺬا اﻟﺪرس وﺳﻨﻜﻤﻞ اﻟﻌﻮاﻣﻞ ﻓﻲ اﻟﺪرس اﻟﻘﺎدم ﺑﺈذن اﷲ
.. ﺗﻌﺎﻟﻰ
www.Arab-Team.com
اﻟﺪرس اﻟﺜﺎﻧﻲ واﻟﺜﻼﺛﻮن
new
: أﻣﺜﻠﺔ
.. ًﻟﻘﺪ أﺧﺬﻧﺎ ﻧﺤﻦ اﻟﻌﺒﺎرات اﻟﺸﺮﻃﻴﺔ وﻟﻜﻦ ﻫﺬه اﻟﻌﺒﺎرة ﻣﺨﺘﺼﺮة ﺟﺪا
.. وﺳﺄﻃﺮح ﻟﻜﻢ ﻣﺜﻼ ﻟﻔﻬﻢ ﻫﺬا اﻟﻤﻌﺎﻣﻞ
<BODY>
<form name=f1>
<input type=text1 name=n1>
<input type=button value=click_here name=b1
onclick="mofak()">
</form>
<script LANGUAGE="JavaScript">
function mofak()
{
var v=f1.n1.value;
if(v>10)
document.write("Good!!!!!!!!!!!!!!")
else
document.write("Bad ????????????????");
}
</SCRIPT>
ﻫﺬا اﻟﻤﺜﺎل اﻟﺴﺎﺑﻖ ﻳﻘﺎرن اﻟﻘﻴﻢ اﻟﻤﺪﺧﻠﺔ وﻳﻘﻮم ﺑﻄﺒﻊ ﻋﺒﺎرة ﻋﻨﺪ إدﺧﺎل ﻓﻴﻤﺔ ﺗﺤﺖ اﻟﻌﺸﺮة
.. وﻳﻄﺒﻊ ﻗﻴﻤﺔ أﺧﺮى ﻋﻨﺪﻣﺎ ﻧﺪﺧﻞ أﻛﺜﺮ ﻣﻦ ﻋﺸﺮة
www.Arab-Team.com
واﻵن ﺳﻮف أﻃﻮر اﻟﻤﺜﺎل ﺑﺸﻜﻞ اﻟﻤﻌﺎﻣﻞ اﻟﺠﺪﻳﺪ
><BODY
><form name=f1
><input type=text1 name=n1
<input type=button value=click_here name=b1
>")(onclick="mofak
></form
>"<script LANGUAGE="JavaScript
)(function mofak
{
;var v=f1.n1.value
;)"??? v>10 ? document.write("Good!!") : document.write("Bad
}
></SCRIPT
ﻧﻀﻊ اﻟﺸﺮط ﻓﻲ اﻟﺒﺪاﻳﺔ ﺛﻢ ؟ ﺛﻢ ﻧﻀﻊ ﺟﻮاب اﻟﺸﺮط ﺛﻢ :ﺑﺪﻻ ﻣﻦ ELSEوﻣﻦ ﺛﻢ ﻧﻀﻊ اﻟﻜﻮد
اﻟﺬي ﻳﻨﻔﺬ ﻓﻲ ﺣﺎل ﻋﺪم ﺗﺤﻘﻖ اﻟﺸﺮط ..
ﺑﻜﻞ إﺧﺘﺼﺎر
a=a+1
ﻣﺜﻞ ﻛﺄﻧﻨﺎ ﻧﻘﻮل
a++
ﻣﻊ أن اﻟﺼﻴﻐﺔ اﻟﺜﺎﻧﻴﺔ أﺳﺮع
وﻧﻘﻮل
a--
أﻛﻨﻨﺎ ﻧﻘﻮل
a=a-1
إذا ﻫﺬﻳﻦ اﻟﻤﻌﺎﻣﻠﻴﻦ ﻟﻺﺧﺘﺼﺎر وﻻﺣﻆ أﻧﻨﻲ أﺳﺘﺨﺪم ﻫﺬﻳﻦ اﻟﻤﻌﺎﻣﻠﻴﻦ ﻓﻲ اﻟﺤﻠﻘﺎت
)for(i=0 ;i<=10;i++
وﻟﻜﻦ أﺣﺐ أن أﻧﻮه ﻫﻨﺎ إﻟﻰ ﻓﺮق ﺑﺴﻴﻂ وﻟﻤﻜﻨﻪ ﻣﻬﻢ ﻫﻨﺎ
ﻳﻮﺟﺪ أرﺑﻊ أﻧﻮاع ﻟﻠﻤﻌﺎﻣﻞ --أو++
www.Arab-Team.com
a++ /١
++a /٢
--a /٣
a-- /٤
;var j, k
;k = 2
;j = ++k
ﻻﺣﻆ أﻧﺎ ﻗﻴﻤﺔ jاﻵن ﻫﻲ ٣وذﻟﻚ ﻷﻧﻪ ﻧﻔﺬ اﻹﺿﺎﻓﺔ ﻗﺒﻞ اﻹﺳﻨﺎد
;var j, k
;k = 2
;j = k++
a=a+5
ﻣﺜﻞ
a+=5
a=a*4
ﻣﺜﻞ
a*=5
وﻫﻜﺬا ﻣﻊ ﺑﺎﻗﻲ اﻟﻌﻮاﻣﻞ ..
أﻧﺼﺤﻚ ﺑﺘﻌﻠﻢ ﻫﺬه اﻟﻌﻮاﻣﻞ واﻟﺘﻌﻮد ﻋﻠﻴﻬﺎ ﻷﻧﻬﺎ ﻣﺸﺘﺮﻛﺔ ﻓﻲ اﻟﺘﻌﻤﻞ ﻣﻊ ال javaوال phpوﻫﻢ
ﻟﻐﺎت ﺗﻬﻤﻚ ﻛﻤﺒﺮﻣﺞ وﻳﺐ ..
www.Arab-Team.com
اﻟﺪرس اﻟﺜﺎﻟﺚ واﻟﺜﻼﺛﻮن
ﻫﻢ ﻣﺠﻤﻮﻋﺔ ﻣﻦ اﻟﻌﻮاﻣﻞ وﺗﻐﻄﻴﺔ اﻟﻔﻮاﺋﺪ ﻟﻬﺬه اﻟﻌﻮاﻣﻞ ﻫﻲ ﺧﺎرج ﻧﻄﺎق اﻟﺪورة
وﻟﻜﻦ ﺳﻨﺸﺮح وﻇﻴﻔﺔ ﻛﻞ ﻋﺎﻣﻞ ﺑﺈﺧﺘﺼﺎر
-١اﻟﻌﺎﻣﻞ & وﻫﻮ ﻣﺜﻞ اﻟﻌﺎﻣﻞ && وﻟﻜﻦ ﻋﻠﻰ ﻣﺴﺘﻮى اﻟﺒﺖ
ﻫﻜﺬا: result = expression1 & expression2
ﻳﻌﻨﻲ :
إذا ﻛﺎن expression1و expression2ﻣﺘﺴﺎوﻳﺎن ﻳﻌﻄﻲ ١وإذا ﻛﺎﻧﻮا ﻣﺨﺘﻠﻔﻴﻦ ﻳﻌﻄﻲ ﺻﻔﺮ
ﻣﺜﺎل : ١
ﻻﺣﻆ أﻧﻪ ﺳﻴﻄﺒﻊ واﺣﺪ
)(function mofak
{
;"var a="1" & "1
;)document.write(a
}
></SCRIPT
ﻣﺜﺎل : ٢
)(function mofak
{
;"var a="0" & "1
;)document.write(a
}
></SCRIPT
www.Arab-Team.com
أي ﻫﻜﺬا:
0101 )(expression1
1100 )(expression2
----
0100 )(result
-٢اﻟﻌﺎﻣﻞ <<
ﻋﺎﻣﻞ اﻹزاﺣﺔ اﻟﻴﻤﻴﻨﻲ :
ﺑﻜﻞ إﺧﺘﺼﺎر ﻫﻮ ﻳﺰﺣﻞ اﻟﺒﺘﺎت إﻟﻰ اﻟﻴﻤﻴﻦ ﺑﻤﻘﺪار ﻧﺤﻦ ﻧﺤﺪده ﻟﻪ :
ﻣﺜﺎل :
>"<script LANGUAGE="JavaScript
)(function mofak
{
var temp
temp = 14 >> 2
;)document.write(temp
}
></SCRIPT
>"<script LANGUAGE="JavaScript
)(function mofak
{
var temp
;temp = 200 >> 3
;)document.write(temp
}
></SCRIPT
www.Arab-Team.com
-٣ﻣﻌﺎﻣﻞ اﻹزاﺣﺔ اﻷﻳﺴﺮ >>
ﻧﻔﺲ اﻟﻤﻌﺎﻣﻞ اﻟﺴﺎﺑﻖ وﻟﻜﻦ اﻹزاﺣﺔ ﻟﻸﻳﺴﺮ
ﻣﺜﺎل :
>"<script LANGUAGE="JavaScript
)(function mofak
{
var temp
;temp = 14 << 2
;)document.write(temp
}
></SCRIPT
-٤اﻟﻤﻌﺎﻣﻞ اﻷﺧﻴﺮ واﻟﺬي ﻫﻮ ^ وﻫﻮ اﻟﻤﻌﺎﻣﻞ اﻟﻤﻌﺮوف ﺑـــ Xorﻓﻲ ﻟﻐﺎت اﻟﺒﺮﻣﺠﺔ واﻟﻤﻨﻄﻖ
وﻫﺬا اﻟﻤﻌﺎﻣﻞ اﻟﺨﻄﻴﺮ ﻳﻘﻮم ﺑﺎﻟﺘﺎﻟﻲ:
0101 )(expression1
1100 )(expression2
----
1001 )(result
1+1 = 0
0+0=0
1+0=1
0+1=1
ﻳﻌﻨﻲ إذا ﺗﻢ اﻟﻤﻄﺎﺑﻘﺔ ﺑﺮﺟﻊ ﺻﻔﺮ وإذا ﻟﻢ ﻳﺘﻢ اﻟﻤﻄﺎﺑﻘﺔ ﺑﺮﺟﻊ ١
ﻣﻼﺣﻈﺔ ﻫﺎﻣﺔ :إﺧﻮﺗﻲ ﻛﻞ اﻟﻤﻌﺎﻣﻼت اﻟﺴﺎﺑﻘﺔ ﻳﺘﻢ إﺳﺘﺨﺪﻣﻬﺎ ﻓﻲ اﻟﺴﻜﺮﺑﺘﺎت اﻟﺘﻲ ﺗﺘﻌﻤﻞ
ﻣﻊ اﻟﺒﺘﺎت ﻣﺜﻞ
-١ﺑﺮاﻣﺞ اﻟﺘﺸﻔﻴﺮ
-٢وﺗﺸﻔﻴﺮ اﻟﺒﻴﺎﻧﺎت ﻻﻟﺘﺠﺎرة اﻷﻟﻜﺘﺮوﻧﻴﺔ
وﻣﺎﺷﺎﺑﻪ ذﻟﻚ
واﻵن ﺳﻮف أﻃﺮح ﻣﺜﺎل ﻟﺘﺸﻔﻴﺮ ﻧﺺ
><BODY
><form name=f1
><input type=text1 name=n1
<input type=button value=click_here name=b1
>")(onclick="mofak
></form
www.Arab-Team.com
>"<script LANGUAGE="JavaScript
)(function mofak
{
"(pass=promptﻣﻦ ﻓﻀﻠﻚ أدﺧﻞ ﻛﻠﻤﺔ اﻟﺴﺮ;)"
;''=var encrypt
;''=var a
{)for(i=0;i<=f1.n1.value.length;i++
;)a=f1.n1.value.substr(i,1
;)encrypt+=pass ^ a.charCodeAt(i-1
}
;)document.write(encrypt
}
></SCRIPT
ﻻﺣﻆ أﻧﻨﺎ ﻧﺪﺧﻞ ﻧﺤﻦ ﻣﻔﺘﺎح ﻟﻜﻲ ﻧﺸﻔﺮر ﻓﻴﻪ وﻫﻮ passﻳﻌﻨﻲ ﻫﺬا اﻟﺮﻗﻢ أو اﻛﻠﻤﺔ ﺳﻮف ﻧﻌﻤﻞ
ﻣﻌﻬﺎ xorﻋﻠﻰ أﺣﺮف اﻟﻨﺺ اﻟﺬي ﻧﺮﻳﺪ ﺗﺸﻔﻴﺮه
وﻻﺣﻆ أﻧﻪ ﻳﺘﻢ ﺗﺨﺰﻳﻦ اﻟﻨﺺ اﻟﺬي ﻧﺮﻳﺪ ﺗﺸﻔﻴﺮه ﻓﻲ اﻟﻤﺘﺤﻮل encrypt
واﺳﺘﺨﺪﻣﻨﺎ اﻟﻤﻌﺎﻣﻞ =+ﺑﺪﻻ ﻣﻦencrypt=encrypt+ value
وﺑﻬﺬا إﺧﻮﺗﻲ ﻧﻜﻮن ﻗﺪ أﻧﻬﻴﻨﺎ أﻫﻢ وﻣﻌﻈﻢ اﻟﻤﻌﺎﻣﻼت اﻟﻤﻮﺟﻮدة ﻓﻲ اﻟﺠﺎﻓﺎ ﺳﻜﺮﺑﺖ
www.Arab-Team.com
اﻟﺪرس اﻟﺮاﺑﻊ واﻟﺜﻼﺛﻮن
ﺑﻬﺬا اﻟﻘﺪر اﻟﺬي أﺧﺬﻧﺎه ﻧﻜﻮن ﻗﺪ أﻧﻬﻴﻨﺎ اﻟﻤﻬﺎرات اﻷﺳﺎﺳﻴﺔ ﻹﻧﺠﺎز ﺳﻜﺮﺑﺘﺎت ﻗﻮﻳﺔ وﺟﻤﻴﻠﺔ
وﻣﻔﻴﺪة
وﻟﻜﻦ ﻳﻨﻘﺼﻨﺎ إﻟﻰ اﻵن اﻟﺘﻤﺎرﻳﻴﻦ اﻟﻌﻤﻠﻴﺔ اﻟﺘﻲ ﺗﺠﻌﻠﻨﺎ أﻛﺜﺮ ﻣﻠﻜﺔ ﻋﻠﻰ إﻧﺠﺎز اﻟﺴﻜﺮﺑﺘﺎت اﻟﻜﺒﻴﺮة
واﻟﻘﻮﻳﺔ ......وﺑﺈذن اﷲ ﺗﻌﺎﻟﻰ ﻓﻲ اﻟﺪروس اﻟﻘﺎدﻣﺔ ﺳﻨﻨﺠﺰ اﻟﻌﺪﻳﺪ ﻣﻦ اﻟﺴﻜﺮﺗﺎت اﻟﻤﻔﻴﺪة واﻟﺘﻲ
ﺗﻌﻄﻲ ﻟﺼﻔﺤﺔ اﻹﻧﺘﺮﻧﺖ ﺗﺄﺛﻴﺮاً ﺟﺬاﺑﺎً
اﻟﺘﻤﺮﻳﻦ اﻷول:
ﻋﺮض اﻟﻜﺘﺎﺑﺔ ﺑﺘﺄﺛﻴﺮ ﺟﻤﻴﻞ
;"var mofak="welcome
;))alert(mofak.substring(1
اﻟﻜﻮد:
><html
><head
>"<script language="JavaScript
;"var mofak="welcome
{ )(function scrollText
;document.scrolling.textbox.value = mofak
mofak = mofak.substring(1) +
;)mofak.substring(0,1
;)setTimeout('scrollText()',2000
}
></script
></head
>")(<body onLoad="scrollText
>"<form name="scrolling
www.Arab-Team.com
>""=<input name="textbox" type="text" size="40" value
></form
></body
></html
ﻛﻞ ﺛﺎﻧﻴﺘﻴﻦ ﻳﺤﺬف أول ﺣﺮف ﻛﻤﺎﺗﻌﻠﻤﻨﺎ ﻗﺒﻞ ﺷﻮي وﻳﻀﺎف أﻟﻴﺔ آﺧﺮ ﺣﺮف ﻳﻌﻨﻲ ﺑﺈﺧﺘﺼﺎر ﺣﺬف
اﻟﺤﺮف اﻷول وﻇﻬﺮ ﻓﻲ آﺧﺮ اﻟﻜﻠﻤﺔ ..
واﻵن ﺳﻮف أﻃﻮل اﻟﻨﺺ ﻗﻠﻴﻼ وﻳﺄﺳﺄﻗﺼﺮ اﻟﻮﻗﺖ ﻟﻠﺘﺎﻳﻤﺮ ﺣﺘﻰ ﻳﺼﺒﺢ اﻟﺘﻤﺮﻳﻦ أﻛﺜﺮ ﺟﻤﺎﻻً ،وﻳﺼﺒﺢ
اﻟﻜﻮد ﻛﺎﻟﺘﺎﻟﻲ :
><html
><head
>"<script language="JavaScript
=var mofak
" +اﻟﺴﻼم ﻋﻠﻴﻜﻢ ورﲪﺔ اﷲ وﺑﺮﻛﺎﺗﻪ"
, " +أﻫﻼ وﺳﻬﻼ ﺑﻜﻢ ﰲ ﻣﻨﺘﺪﻳﺎت اﻟﻔﺮﻳﻖ اﻟﻌﺮﺑﻲ ﻟﺘﻘﻨﻴﺎت اﻟﻮﻳﺐ"
;" ,ﻣﻨﻬﺎج دورة اﳉﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻛﻴﻒ وﺟﺪﰎ"
{ )(function scrollText
;document.scrolling.textbox.value = mofak
mofak = mofak.substring(1) +
;)mofak.substring(0,1
;)setTimeout('scrollText()',200
}
></script
></head
>")(<body onLoad="scrollText
>"<form name="scrolling
>""=<input name="textbox" type="text" size="40" value
></form
></body
></html
اﻟﻜﻮد:
><html> <head
>"<script language="JavaScript
= var mofak
" +اﻟﺴﻼم ﻋﻠﻴﻜﻢ ورﲪﺔ اﷲ وﺑﺮﻛﺎﺗﻪ"
, " +أﻫﻼ وﺳﻬﻼ ﺑﻜﻢ ﰲ ﻣﻨﺘﺪﻳﺎت اﻟﻔﺮﻳﻖ اﻟﻌﺮﺑﻲ ﻟﺘﻘﻨﻴﺎت اﻟﻮﻳﺐ"
;" ,ﻣﻨﻬﺎج دورة اﳉﺎﻓﺎ ﺳﻜﺮﺑﺖ ﻛﻴﻒ وﺟﺪﰎ"
www.Arab-Team.com
var scrolling = false;
var timer;
function scrollText() {
document.scrolling.textbox.value = mofak;
mofak = mofak.substring(1) +
mofak.substring(0,1);
timer=setTimeout('scrollText()',100);
}
function startScroll() {
if (!scrolling) {
scrolling = true;
scrollText();
}
}
function stopScroll() {
if (scrolling)
clearTimeout(timer);
scrolling = false;
}
</script>
</head>
<body onLoad="startScroll()">
<form name="scrolling" >
<input name="textbox" type="text" size="40" value="">
<input type="button" value=" # " onClick="stopScroll()">
<input type="button" value=" > " onClick="startScroll()">
</form>
</body>
</html>
<body onLoad="startScroll()">
function startScroll() {
if (!scrolling) {
scrolling = true;
scrollText();
}
www.Arab-Team.com
وﻓﻲ اﻟﺪاﻟﺔ scrollTextﻗﺪ ﺷﺮﺣﻨﺎﻫﺎ ﻓﻲ ﻣﺎ ﺷﺒﻖ وﻟﻜﻦ ﻫﻞ ﻻﺣﻈﺖ أن اﻟﺘﺎﻳﻤﺮ ﻗﺪ أﺳﻨﺪت ﻟﻪ
اﻟﻤﺘﺤﻮل timerﻧﻌﻢ ﻷﻧﻨﻲ أرﻳﺪ أن أﺟﻌﻞ اﻟﻤﺘﺤﻮل tinerﻣﺮﺟﻊ ﻟﻠﺘﺎﻳﻤﺮ إذا أردت إﻳﻘﺎﻓﻪ وﻫﺬا
ﻣﺎﻋﻤﻠﺖ ﻋﻦ ﻃﺮﻳﻖ اﻟﻜﻮد :
{ )(function stopScroll
)if (scrolling
;)clearTimeout(timer
;scrolling = false
}
وﻳﺘﻢ إﺳﺘﺪﻋﺎء اﻟﺘﻮاﺑﻊ ) اﻟﻮﻇﺎﺋﻒ ( ﻣﻦ ﻗﺒﻞ أزار htmlﻋﻦ ﻃﺮﻳﻖ اﻟﻜﻮد اﻟﺘﺎﻟﻲ :
أرﺟﻮا أن أﻛﻮن ﻗﺪ وﻓﻘﺖ ﻓﻲ ﻃﺮﺣﻲ اﻟﻤﺜﺎل وﻟﻜﻢ ﻣﻨﻲ اﻟﺘﺤﻴﺔ واﻟﺴﻼم ..
أرﺟﻮا ﻣﻨﻚ أﺧﻲ ،أﺧﺘﻲ :إﻋﺎدة اﻟﻜﻮد ﻣﺮة وإﻧﺜﺘﺎن وﺛﻼﺛﺔ ﺣﺘﻰ ﺗﻔﻬﻤﻪ % ....١٠٠
وﺣﺎول ﻓﻲ ﺗﻄﻮﻳﺮه ..
وﻳﻤﻜﻨﻚ ﺗﻄﻮﻳﺮ اﻟﻤﺜﺎل ﻋﻦ ﻃﺮﻳﻖ ﻋﺮﺿﻪ ﻋﻠﻰ divﻳﻌﻨﻲ ﺟﺰء ﻣﻦ ﺻﻔﺤﺔ ال html
><html> <head
>"<script language="JavaScript
= var mofak
" +وﺑﺮﻛﺎﺗﻪ اﻟﺴﻼم ﻋﻠﻴﻜﻢ ورﲪﺔ اﷲ"
, " +أﻫﻼ وﺳﻬﻼ ﺑﻜﻢ ﰲ ﻣﻨﺘﺪﻳﺎت اﻟﻔﺮﻳﻖ اﻟﻌﺮﺑﻲ ﻟﺘﻘﻨﻴﺎت اﻟﻮﻳﺐ"
; " ,ﻛﻴﻒ وﺟﺪﰎ ﻣﻨﻬﺎج دورة اﳉﺎﻓﺎ ﺳﻜﺮﺑﺖ"
;var scrolling = false
;var timer
{ )(function scrollText
;textbox.innerHTML = mofak
mofak = mofak.substring(1) +
;)mofak.substring(0,1
;)timer=setTimeout('scrollText()',100
}
{ )(function startScroll
{ )if (!scrolling
;scrolling = true
;)(scrollText
}
}
{ )(function stopScroll
www.Arab-Team.com
if (scrolling)
clearTimeout(timer);
scrolling = false;
}
</script>
</head>
<body onLoad="startScroll()">
<div id=textbox> </div>
<form name="scrolling" >
<input type="button" value=" # " onClick="stopScroll()">
<input type="button" value=" > " onClick="startScroll()">
</form>
</body>
</html>
أي ﻣﺮﺑﻊ اﻟﻨﺺ ﻋﻦ ﻃﺮﻳﻖ اﻟﺨﺎﺻﻴﺔtext وﻣﻦ ﺛﻢ ﻗﻤﺖ ﺑﺎﻟﻜﺘﺎﺑﺔ ﻋﻠﻴﻬﺎ ﺑﺪﻻً ﻣﻦ ﻣﻦ اﻟﻜﺘﺎﺑﺔ ﻋﻠﻰ
innerHTML اﻟﺘﻲ ﻫﻲdiv اﻟﺨﺎﺻﺔ ﺑﺎﻟﻜﺘﺎﺑﺔ ﻋﻠﻰ
وذﻟﻚ ﻋﻦ ﻃﺮﻳﻖ اﻟﻜﻮد اﻟﺘﺎﻟﻲ
textbox.innerHTML = mofak;
www.Arab-Team.com