More Related Content Similar to Computer 2nd-preparatory-second-term- (10)
Similar to Computer 2nd-preparatory-second-term- (10) (20) Computer 2nd-preparatory-second-term- (10)1. ::6;7966010alysun1973@yahoo.com
1
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
يمذيخ
درسنا..... والتفاعلٌة الثابنة الصفحات بٌن الفرق سبك فٌماباستخدام الثابتة الصفحات من مجموعة بتصمٌم لمنا
لغةHtml)ًمدرست مولع (صفحاتفم لإلطالع كانت المعروضة المعلومات أن والحظناـدون ـطأي إجراء إمكانٌة
ع معالجة... للصفحة كمصمم ًاٌشخص أنت خاللن من أو الزائرٌن لبل من لٌها
ولكنلمدُعٌَالـــWebممتًاصرعلىٌتمدمالمعلومةبشكلً ِّصنبسٌط,حٌثعلى نفسه التطور فرضمحتوٌات
ًاإلعالم الشكل إلى ماتكون ألرب وأصبحت الوٌب صفحاتٌناح ومن ) ًمرئ ، (مسموعأخرى ةالـــــ طور فمد
Webبالــــــ ٌعرف لما نفسهWeb2.0جدٌدة برمجٌة ولغات أدوات ظهور إلى بدوره أدى وهذاللمبرمجٌن تتٌح
موالعهم صفحات وإنتاج الوٌب عالم ًف جدٌدة آفاق والمطورٌنإدخ المستخدم ٌستطٌع ًتفاعل ًإعالم بشكلـــــــال
بٌاناتطرٌك عنإضافةأزرارونماذجتأخذبٌاناتمنالمستخدموتحولهاإلىنماذجأخرىأوترســـــــــــلهابالبرٌد
ًاإللكترونأوتجريعلٌهاحسابٌة عملٌاتلٌستدائم أو مؤلت بشكل تخزنها أو بسٌطةصحتها من تتحمك أو...
المحت وتغٌٌرــــــــــــوىا... أوامره على ًءوبنا لرغبته ًاوفم لمعروضإنهباختصارتحوٌلالصفحةإلىماٌسمى
بصفحات. التفاعلٌة الوٌب
انًُبرطForms
تستخدمالنماذجFormsًفلغةHTMLإلستمبالالمدخالتInputsمنالمستخدمبغرضعرضهاأوتخزٌنهاأو
المٌامبعملٌاتمعالجةمعٌنةعلٌهاو ،ٌتمإنشاءالنماذجباستخدامٌالوسمن<form>و</form>فمنخاللالنموذج
اضافة ٌمكننمجموعةعناصراإلدخال<input>لصفحةالوٌبمنهاأزرارbuttonsأوحمولتمومباستخدامها
إلدخالبٌاناتنبغرضلمولع إرسالهاالوٌبلٌتمتمربعات مثل خزٌنهاالنصوصtext boxesوعناصراإلختٌار
check boxesوالفردي اإلختٌار زرRadioوغٌرها .....
االسم حقل إضافة:
( نص صندوق بإضافة ذلن وٌتمTextالمفاتٌح لوحة خالل من نصٌة بٌانات إدخال للزائر ٌتٌح والذي )
Keyboard..... هو ذلن عن المسئول والكود< input type="text" >
إضافةحقل: المرور كلمة
بإضافة ذلن وٌتمالمرور كلمة حمل(password)الرمز ٌظهر والذيإلخفاء المرور كلمة كتابة عند
الحمٌمٌة الكلمة.... هو ذلن عن المسئول والكود.< input type="password" >
إضافةالمرور كلمة تأكيد:. السابمة الطرٌمة بنفس
إضافة: واحد بديل إختيار زر
بإضافة ذلن وٌتمفمط واحد بدٌل إختٌار زر(radio)
هو ذلن عن المسئول والكود....< input type="radio" >
إضاف معلومات: ية
النموذجFormخاصٌتٌن لهAttributes:
األولىaction:ًالتتحدداسمالملفًالبرمجالذيسٌمومبمعالجةالبٌاناتالمدخلةًفالنموذجوٌكومكتوب الملف هذا ن
مثل برمجة بلغةphpأوAsp.netالسٌرفر على. (Server)
والثانٌةmethod:والًتتحددطرٌمةإرسالالبٌاناتإلىالملفًالبرمج: الطرٌمتٌن بإحدى المذكور
-Getحيثيتمإرسالالبياناتفييطرشاوالعننفيالمستعرضبعداسمالممفالبرمجي.
-Postحيثيتمإرسالالبياناتبشكلغيرظاىرفييطرشاوالعنن)فيالحقيقةيتمإرساليامعترويسة
طمبHTTP)
األول الفصل
Html Language
Form – Some Tools Of Form
وىلألا الوحدة
انًُـــــــٕرط
ّأدٔار ٔثعط
2. ::6;7966010alysun1973@yahoo.com
2
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
مثالتوضيحي(1):
هو ذلن عن المسئول والكود......
: هامة مالحظةاألداة ًف واحد بدٌل إختٌار لضمانRadioالـــ أدوات جمٌع ًف مشترن اسم وضع من البدRadio
الــ خاصٌة ًف النموذج على الموجودةNameالمثا ًف ترى كما. السابك ل
3. ::6;7966010alysun1973@yahoo.com
3
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
االٔل نهفصم ٔانزذسٚجبد األسئهخ
: اٜرٛخ انعجبساد ٗعه انذال ًٗانعه انًصطهح أكزت
1-الوٌب مولع على تخزن لكى وارسالها بٌانات ادخال بغرض الوٌب لصفحة المضافة والحمول األزرار مع ٌستخدم
2-بدائل عدة من فمط واحد بدٌل باختٌار لن ٌسمح
3-إلدخا الوٌب لصفحة ٌضافداخله الكتابة طرٌك عن نصٌة بٌانات ل
: االرٛخ انعجبساد أكًم
1-طالب بٌانات تسجٌل صفحة لتصمٌمو ................ منها عناصر مجموعة به نموذج إلضافة نحتاج
.............. البٌانات إلدخال باستخدامها تموم .
2-................... اضافة ٌتم الطالب اسم الدخال حمل إلضافةالوٌب لصفحة ..
3-الرمز ٌظهرالحمٌمة .................... مكونات ألخفاء وذلن الكتابة عند
4-.............................. الوٌب لصفحة نضٌف ) أنثى / ذكر ( النوع إلدخال
إخزشييب ة انعًٕد ٍٚ: أ انعًٕد ٍي ُّبسج
) أ () ب (
<input type="password">صندوق إلضافةالوٌب لصفحة نص
< input type ="radio">الوٌب لصفحة المرور كلمة حمل إلضافة
<input type ="text">الوٌب لصفحة واحد بدٌل اختٌار زر إلضافة
: الخطأ العبارة خطأأمام وعالمة الصحٌحة العبارة أمام صح عالمة ضع
1-الب ارسال ٌتم لكى نموذج وجود ٌشترط ال الوٌب صفحة فىتخزٌنها لٌتم الوٌب مولع الى المدخلة ٌانات
2-الخاصٌة نستخدم الولت نفس فى واحد بدٌل اختٌار زر اختٌار امكانٌة إللغاءnameللزرٌن االسم نفس إلعطاء
3-النص صندوق اضافة ٌتم الطالب اسم إلدخال حمل إلضافةRadio
4. ::6;7966010alysun1973@yahoo.com
4
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
إضافةإختيار صندوقCheckbox:
المتاحة البدائل من بدٌل أي إختٌار عدم أو أكثر أو واحد بدٌل بإختٌار األداة تلن لن تسمح حٌث
عن المسئول والكودهو األداة تلن إدراج....< input type="checkbox" >
<p/< األعُجٛخ انهغبد >p>
English
<input type="checkbox" name="Ali" value="English">
French
<input type="checkbox" name="Ali" value="French">
Germany
<input type="checkbox" name="Ali" value="Germany">
إضافةأمر زرButton:
بٌانات مسح ، بٌانات وتسجٌل إضافة مثل المبرمج لبل من محددة )بمهمة(وظٌفة بالمٌام األداة تلن لن تسمح حٌث
،) ًاالحم شرحه سٌتم ( دالة إستدعاء
هو األداة تلن إدراج عن المسئول والكود....< input type="button" >
<input type=" button " name="Ali" value="ok">
<input type=" button " name="Ali" value="cancel">
<input type=" button " name="Ali" value="save">
: هامة مالحظة
من أنواع ثالثة إذن هنانًٌل كما تفصٌلها األزرار:
-Buttonاألكواد طرٌك عن بتخصٌصها نموم محددة مهمة تنفٌذ ًف وٌستخدم.
-Submitإرسال ًف وٌستخدمعلى مخزنة بٌانات لاعدة (إلى .البٌاناتServer. ) ًالمث ما
-Resetٌوالـــ على من البٌانات )(تنظٌف حذف أو لمسح ستخدمForm.
إضافةزرإرسالSubmit:
بإرسال ٌمومبٌاناتنًالتلمتبإدخالهاعنطرٌكالنموذج عناصرلصفحةأخرى)وذلنبإضافةالخاصٌةaction
بالــــ والخاصةForm. )
: هو المسئول والكود
"<form method="get" action="file.php>
"<"رسغٛم=input type="submit" name="okButton" id="okButton" value>
أنه الحظ:نهصفحخ اإلَزمبل ٚزى رسغٛم صس ٗعه انعغػ عُذFile.phpخالل ٍي إدخبنٓب رى ٙانز انجٛبَبد اسزمجبل ٚزى حٛش
انـــ ٗعه انًخزهفخ انزحكى أدٔادFormثهغخ ٔانًكزٕثخ انصفحخ ِْز ثأكٕاد يعبنغزٓب صى ٍٔيphp.
إضافةحذف زرReset:
ٌمومسبك ًالت البٌانات بحذفإدخالها. لألدوات اإلفتراضٌة للمٌم والعودة
المسئول والكودالوٌب بصفحة إدراجه عن: هو
"<"جدٌد=input type="reset" name="resBtn" id="resBtn" value>
الثاني الفصل
انُٕذد أدٔاث بعض تابع
Follow – Some Tools Of Form
5. ::6;7966010alysun1973@yahoo.com
5
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
َٗانضب نهفصم ٔانزذسٚجبد األسئهخ
: انخطأ انعجبسح أيبو خطأ ٔعاليخ انصحٛحخ انعجبسح ايبو صح عاليخ ظع
1-الوٌب لصفحة االختٌار صنادٌك اضافة ٌتم لغة من أكثر أو تجٌدها التى اللغة الختٌار
2-تستالخاصٌة خدمnameالزر على ٌظهر الذى النص لتحدٌد
3-زرsubmitاالدخال حمول داخل المكتوبة البٌانات لحذف ٌستخدم
: انزبنٛخ انعجبساد أكًم
1-كود كتابة خالل من بتوصٌفها تموم التى المهام أحد لتنفٌذ ٌستخدم .............. زر
2-البٌان الرسال ٌستخدم ..................... زرات
3-البٌانات لحذف ٌستخدم .............................. زر
: أ انعًٕد ٍي ّسُبسج يب ة انعًٕد ٌ إخزش
) أ () ب (
<input type="submit">الوٌب لصفحة االختٌار صندوق إلضافة
< input type ="reset">الوٌب لصفحة الى األمر زر إلضافة
<input type ="checkbox">إلضالوٌب لصفحة الى اإلرسال زر افة
<input type="button">الوٌب صفحة الى الحذف ر إلضافة
6. ::6;7966010alysun1973@yahoo.com
6
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
بياناتك لتسجيل ويب صفحة تصميم
. التقلق ًاجد بسيط إنه ؟؟؟ السابق الشكل في مارأيك
ْٕ ْٔزا: رنك رُفٛز ٍع انًسئٕل انكٕد
االثالث لفصل
انًشسٔع
Project
8. ::6;7966010alysun1973@yahoo.com
8
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
يمذيخ
إنالجافا ومنها النصوص لغات من العدٌدسكرٌبتتحولمولعالوٌبإلىٌتفاعل مولعمعالمستخدم
منخاللإضافةأزرارونماذجتأخذبٌاناتمنوتحولها المستخدمإلىنماذجأخرىأوترسلهابالبرٌد
ًاإللكترونأوتجريعلٌهاحسابٌة عملٌاتلٌستبسٌطةإنهاباختصارتحولالصفحةإلىماٌسمى
بصفحاتالدٌنامٌكٌة الوٌبأوصفحاتالوٌبالتفاعلٌةهوماالتمدمهلغةHTML.
انمٕاعاأل ذسبسٛخنغخ نـــJava Script:
1–نغت ٔتعهًٍاث أٔايسJava Scriptجًم تسًىStatements.
6–جًم تكتبJava Scriptاأليس داخم< script >ٔ</ script >.
7–ٔانتعهًٍاث األٔايس تكتبكٕد داخمHtmlكًاكٕد كتابت ًٌٍكJava Scriptٍي أكخس ًف
:ًٌه كًا يٕضع
-ٍي ٍمك داخمHead TagٔBody Tag.
-كٕد إدزاد ًٌٍك كًاJava Scriptبايتداد ًخازج يهف ٍي.JSٌدزدبداٌت ًفScript Tag
8–( جًهت كم إَٓاء ٌجبStatements)(يُقٕطت بفاصهت)semicolons(;).
9–ٌٕضعًفاالعتبازحانتاألحسفصغٍسةSmallأوكبٍسةCapitalعُدكتابتانجًم
(Statements)أَٓا حٍجcase sensitive languageاألحرف لحالة حساسة إنها أي.
أيبككٕد كزبثخ ٍJava Scriptأكٕاد داخمHTML:
1-جملةalert
عًهخ رسزخذوalertعشضسسبنخداخمصُذٔقيًبٚغزةِاالَزجبنمشاءرٓب.ٔإلظٓبسصُذٔقانشسبنخَسزخذواأليش
ٙانزبن:
Alert (“message “ ) ;
األول الفصل
Java Script Language
Fundamental Principles
ال الوحدةثانية
Java Script
9. ::6;7966010alysun1973@yahoo.com
9
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
2-جملةdocument.write
عًهخ رسزخذوdocument.writeإلظٓبسسسبنخيكزٕثخٗعهصفحخانٕٚتَفسٓب.
معلومةإضافية
ٕٚعذ كًبٖأخش سسبئم عًميضمpromptٔconfirm
االٔل نهفصم ٔانزذسٚجبد األسئهخ
انعجبس ٗعه انذال ًٗانعه انًصطهح أكزت: اٜرٛخ اد
1-تفاعلٌة صفحة بٌاناتن تسجٌل صفحة لجعل تستخدم لغة
2-لمراءتها االنتباه ٌجذب مما صندوق داخل رسالة لعرض تستخدم
3-نفسها الوٌب صفحة على مكتوبة رسالة الظهار تستخدم
: االرٛخ انعجبساد ايبو خطب ٔا صح عاليخ ظع
1-لغة استخدام ٌكفى الHTMLالبٌانات صحٌة من لتتحمكالوٌب صفحة الى المدخلة
2-جمل كتابة من البدscriptتعلٌمات ملف عن منفصل ملف فىHTML
3-جملة كل انهاء ٌجبStatement) : ( منموطة بفاصلة
4-لغة فىJave Scriptالجمل كتابة عند كبٌرة أم صغٌرة األحرف حالة بٌن فارق ٌوجد الStatements
10. ::6;7966010alysun1973@yahoo.com
10
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
مقدمة
لعلكجمل أن الحظتjava scriptوالمكتوبة سبمت ًالتاأليس داخم< script >ٔ</ script >
انُقس يخم ؟ ؟ يا بحدث ّٔزبط انتشغٍم إزجاء أزدَا ٕن ياذا ، انصفحت تشغٍم بًجسد ًةيباشس تُفٍرْا ٌتى
انصز عهىButton…..الدوال عن الحدٌث من البد ًاإذFunctions.. بنا هٌا فــ ...
(األكواد من مجموعة ًه–أوامر–ٌدل اسم تأخذ أن وٌجب االستدعاء عند تنفٌذها ٌتم ًوالت ) تعلٌمات
. وظٌفتها على
دالة إنشاءFunctionجمل على تحتويJava Script
1-األيس أكتبFunctionحىاكتباسىيُاسبنهدانت)ٌفضمٌأٌدلعهىٔظٍفتٓا(.
6-اكتبانكٕدانريسٍتىِتُفٍرياٍٍبٍٍانقٕس{ }،حٍجٌتىِتُفٍرعُداستدعاءاندانت.
Hi
انصفحخ ٔثبنطجعانذانخ إسزذعبء ٚزى نى َّأل فبسغخ
إستدعاءالدالةFunction:
1-ٚزىإظبفخصسأيشButton.
2-انخبصٛخ إظبفخonclickاأليش نضسButton.
3-انخبصٛخ نمًٛخ انذانخ اسى إسُبدonclick.
ان عُذ َّأ الحعانضس ٗعه عغػwawانحذس ٔلعonclickانذانخ اسزذعبء فزىhiعجبسح ٔظٓشدwelcome to Alex
الثاني الفصل
كود إستدعاء
Java Script
11. ::6;7966010alysun1973@yahoo.com
11
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
Textbox
األيش صس ٗعه انعغػ صى انُص يشثع داخم َص ٘أ إدخبل عُذ : ْٙ ثجسبغخ انًضبل فكشحwawسسبنخ رظٓش
. انُص يشثع ٙف ّإدخبن رى ٘انز َّفس ْٕ يحزٕاْب
9
-نهًُٕصط اسى إعطبء رىFormانخبصٛخ غشٚك ٍعnameْٕٔAli
-انُص نًشثع اسى إعطبء رىtextboxْٕٔtito
-ٕانٕص رى: ٙانزبن انكٕد غشٚك ٍع انُص يشثع ٙف انًذخم نهُص ل
Ali.tito.valueانخبصٛخ غشٚك ٍع ٘أvalueٍنهكبئtito. انًُٕرط ٗعه انًٕعٕد
َٗانضب نهفصم ٔانزذسٚجبد األسئهخ
: انزبنٛخ انعجبساد أكًم
1-الـ جمل تنفذ ان أردت إذاJave scriptزر على النمر مثل حدث ولوع عندأمرButtonالى نحتاج سوف
.......................... استخدام
2-ٌدل مناسب اسم اعطائها وٌجب استدعائها عند تنفذ التى اآلوامر من مجموعة هى ..............................
وظٌفتها على
: االرٛخ انعجبساد أيبو خطب ٔأ صح عاليخ ظع
1-الخاصٌة اضافة ٌتمValueاألمر لزرButtonكود تنفٌذ أو دالة إلستدعاءjave script
2-الخاصٌة تستخدمOnclickالزر على ٌظهر نص لكتابة
3-النص لصندوق واسم للنموذج اسم اعطاء من البد النص صندوق محتوى الى للوصول
4-لغة جمل كتابة ٌتمJave scriptاالمر داخل<script>
12. ::6;7966010alysun1973@yahoo.com
12
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
مقدمة
لعلكاألمثلة ًف أنه الحظتنحتاج لد األحٌان بعض ًف ولكن .... متتابع بشكل األوامر تنفٌذ تم السابمة
ترتٌبها عن النظر بغض أخرى مجموعة تنفٌذ عدم أو األكواد من مجموعة تنفٌذ أولوٌة ًف التحكم ًإل
. معٌن لشرط ًاوفم
توضيحي مثال6
If (condition(
{
Code ) رحمك حبل ٙف رُفٛزْب انًشاد األٔايشانششغ )
}
1.لًٛخ كبَذ إراٙانششغ انزعجٛش(conditional Expression)Trueيغًٕعخ ثزُفٛز انجشَبيظ سٛمٕو
األٔايشٙانزٍٛانمٕس ٍٛث{ }
2.لًٛخ كبَذ إراٙانششغ انزعجٛش(conditional Expression)Falseانجشَبيظ سٛمٕوثعذورُفٛز
ٔثب ٍٛانمٕس ٍٛث األٔايشسُٛفز ٙنزبناألٔاي يغًٕعخشٙره ٙانزعًهخIf.
If ( X >= 50 ) Yes
{
alert (" ")
No}
الثالث الفصل
)الشروط(التفرع
Branching
َبعح
Alert (" ")
x>=50
End
َبعح
13. ::6;7966010alysun1973@yahoo.com
13
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
الشيق الكود هذا وإليك
نهفصم ٔانزذسٚجبد األسئهخانضبنش
: اٜرٛخ انعجبساد ٗعه انذال ًٗانعه انًصطهح أكزت
1-معٌن شرطى تعبٌر اختبار لنتٌجة ًاتبع جمل أو أوامر تنفٌذ عدم أو تنفٌذ
2-ال استخدامها ٌتم جملةالشرطى التعبٌر ختبار
: انخطأ انعجبسح أيبو خطأ ٔعاليخ انصحٛحخ انعجبس ايبو صح عاليخ ظع
1-الموسٌن بٌن ما الكود ٌنفذ الشرطى التعبٌر تحمك عدم حالة فى
2-حالة فىx=100الشرط ٌتحمكX>=20نعم الشرط جواب وٌكون
14. ::6;7966010alysun1973@yahoo.com
14
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
مقدمة
إن(تفا دٌنامٌكٌة مظاهر أحدأوجه عدة من المدخلة البٌانات صحة من التحمك هو الوٌب صفحة )علٌة
: منها
-ترنحمولفارغة.
-كتابةعددغٌرمحددمنالحروفواألرلامًفالحمل.
-عدممطابمةكلمةالمرور.
-ادخالاىنوعمنالبٌاناتًفالحمل.
( فارغ حمل ترن عدم : ًالأوRequired Field)
-عندالضغطعلىزر"Send"بدونادخالاسمالطالب.
-ٌظهرصندوقالنصبهرسالةتحذٌرٌة"غٌرمسموحبترنحملاإلسمفارغ"
مالحظاتعلىالكود:
-إلنشاءنموذجعلىصفحةالوٌباستخدمناالكودًالتال:
<form method="get" action="file.php" name="Ali">
-الخاصٌةNameًتعطهذهالخاصٌةاسم" هو هنا (واالسم للنموذجAliمعه التعامل ًف ٌستخدم وسوف "
. الكود داخل
-الخاصٌةactionتحددالعملٌةًالتسٌتمتنفٌذهاعندضغطزرsubmitوعادةتكونعملٌةارسال
للبٌاناتًالتأدخلهاالمستخدمعنطرٌكأدواتالتحكمالىصفحةوٌبأخرى)وتسهنا مىfile.php)
وتكونمخزنةعلىجهاز. الخادم
.
االرابع لفصل
البيانات صحة من التحقق
Data Validation
15. ::6;7966010alysun1973@yahoo.com
15
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
-إلظهارصندوقالنصtextbox: ًالتال الكود استخدمنا
<input type="text" name="tito">
-إلظهارزرsubmit: ًالتال الكود استخدمنا
<input type="submit" value="Send" onclick="return f1();”>
-الخاصٌةvalueإلكلمة ظهارSend. الزر على
-الخاصٌةOnclickتمثلحدثٌجعلالزرٌستجٌبللنمربالماوسوٌمومبتنفٌذكودمعٌنأواستدعاءدالة
ًه هنا والدالة ( لتنفٌذهاF1–وأمرReturnإلستمبالالمٌمةالراجعةمن) الدالة تنفٌذ.
-الدالة إلنشاءF1()على بالضغط تنفٌذها ٌتم ًوالتزرSubmit: ًالتال الكود استخدمنا
function f1() {
-الختبارمحتوىصندوقالنصTextالموجودداخلالنموذجFormعنطرٌكالخاصٌةvalueحٌث
المٌمة""ًتعنأنصندوقالنصفارغ.
if (Ali.tito.value==””) {
-إلظهارالرسالة"غٌرمسموحبترنحملاإلسمفارغ"نستخدماألمرalert: ًٌل كما
;)"فارغ االسم حمل بترن مسموح ("غٌرalert
-إلرجاعلٌمةالدالةF1بـــFalseًفحالةترنصندوقالنصفارغانستخدمالكودًالتال:
return false;
16. ::6;7966010alysun1973@yahoo.com
16
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
ًاٌثان:التحكمًفطولالبٌانالمدخلبالحمل(Length)
للتحكهيفطولالبياناملدخلباحلكلأومبعنىآخراحتواءاحلكلعلىقينةالتكلعنعددحمددمنالرموز
. ) خاصة عالمات حتى أو أرقاو أو (حروف
توضيحي مثال8:
لمبتصمٌمصفحةوٌببداخلهاForm: على ٌحتوي
-صندوقإدخالكلمةالمرور.
-الزرSubmit(Send)وعندالضغطعلٌهٌظهرصندوقرسالةتحذٌرٌة"طولكلمة
المرورالٌملعن8أحرف"ًفحالةادخالكلمةمرورتملعن8رموز.
الرابع الفصل
البيانات صحة من التحقق تابع
Data Validation
17. ::6;7966010alysun1973@yahoo.com
17
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
مالحظاتعلىالكود:
-إلظهارصندوقالسر كلمةPassword: ًالتال الكود استخدمنا
<input type="password" name="tito">
-إلظهارزرsubmit: ًالتال الكود استخدمنا
<input type="submit" value="Send" onclick="return f1();”>
-الخاصٌةvalueكلمة إلظهارSend. الزر على
-الخاصٌةOnclickتمثلحدثٌجعلالزرٌستجٌبللنمربالماوسوٌمومبتنفٌذكودمعٌنأواستدعاءدالة
ًه هنا والدالة ( لتنفٌذهاF1–وأمرReturnإلستمبالالمٌمةالراجعةمن) الدالة تنفٌذ.
-الدالة إلنشاءF1()زر على بالضغط تنفٌذها ٌتم ًوالتSubmit: ًالتال الكود استخدمنا
function f1() {
-الختبارمحتوىصندوقالسر كلمةPasswordالموجودداخلالنموذجFormعنطرٌكالخاصٌة
valueحٌثبداخله الحرفٌة السلسلة طولlengthعن تمل8رموز.
if (Ali.tito.value.length<8) {
-إلظهارالرسالةعن الٌمل المرور كلمة "طول8"أحرفنستخدماألمرalert: ًٌل كما
;(عن الٌمل المرور كلمة "طول8"أحرف)alert
-إلرجاعلٌمةالدالةF1بـــFalseًفحالةترنصندوقالنصفارغانستخدمالكودًالتال:
return false;
ًاثالث:مطابمةالبٌاناتالمدخلةًفحملٌنMatch:
توضيحي مثال9:
لمبتصمٌمصفحةوٌببداخلهاForm: على ٌحتوي
-صندوقإدخالكلمةالمرور.
-صندوقإلعادةادخالكلمةالمرور“اعدإدخالكلمةالمرور".
-الزرSubmit(Send)وعندالضغطعلٌهٌتمممارنةمحتوى،الصندولٌنًفحالةعدم
تطابكلٌمتٌهماتظهررسالةتحذٌرٌة"الكلمتٌنغٌرمتطابمتٌن".
18. ::6;7966010alysun1973@yahoo.com
18
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
مالحظاتعلىالكود:
-إلظهارصندوقالسر كلمةاألولPassword: ًالتال الكود استخدمنا
<input type="password" name="tito">
-إلظهارصندوقًالسرالثان كلمةPassword: ًالتال الكود استخدمنا
<input type="password" name="Fiky">
-الختبارمحتوىصندوقالسر كلمةاألولtitoالموجودداخلالنموذجFormمحتوى مع ٌتطابك هل
ًالثان السر كلمة صندوقFiky: ًالتال الكود استخدمنا
if (Ali.tito.value. !== Ali.Fiky.value) {
-إلظهارالرسالة"متطابمتان غٌر "الكلمتاننستخدماألمرalert: ًٌل كما
;("متطابمتان غٌر "الكلمتان)alert
ًارابع:منعادخالنوعمنالبٌاناتمخالفلنوعالحمل:
المعاملالوظٌفة
==المٌمة ًف متساوٌان الممارنة ًطرف هل لتعٌٌن
===البٌانات ونوع المٌمة ًف متساوٌان الممارنة ًطرف هل لتعٌٌن
!=المٌمة ًف متساوٌان غٌر الممارنة ًطرف هل لتعٌٌن
!==هل لتعٌٌنالبٌانات ونوع المٌمة ًف غٌرمتساوٌان الممارنة ًطرف
19. ::6;7966010alysun1973@yahoo.com
19
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
توضيحي مثال01:
لمبتصمٌمصفحةوٌببداخلهاForm: على ٌحتوي
-صندوقنصtext.
-الزرSubmit(Send)وعندالضغطعلٌهٌتماختبارالمٌمة،المدخلةًوفحالةادخال
لٌمةعددٌة غٌرتظهررسالةتحذٌرٌة"أدخللٌمةعددٌة".
: هو ذلن عن المسئول والكود
20. ::6;7966010alysun1973@yahoo.com
20
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
مالحظاتعلىالكود:
-إلظهارصندوقالسراألول كلمةPassword: ًالتال الكود استخدمنا
<input type="password" name="tito">
-الختبارمحتوىصندوقالنصtext.... ال أم عددي هو هل
if (isNaN(Ali.tito.value)) {
-إلظهارالرسالة"عددٌة لٌمة أدخل فضلن من"نستخدماألمرalert: ًٌل كما
;("عددٌة لٌمة أدخل فضلن من")alert
انسبثم نهفصٕل ٔانزذسٚجبد االسئهخخ
: االرٛخ انعجبساد أكًم
: إدخبنٓب ٚزى ٗانز انجٛبَبد صحخ ٗف انزحكى حبالد ٍي
فارغة حمول ترن
...................................................
...................................................
...................................................
عاليخ ظع: انخطأ انعجبسح ايبو خطب ٔعاليخ انصحٛحخ انعجبسح ايبو صح
1-الشرط نستخدم المرور كلمة لمطابمةform1.text.value==""
2-الخاصٌة تضافactionلألمر<form>النموذج بٌانات ارسال مع الٌها االنتمال المطلوب الصفحة لتحدٌد
3-الدالة إلنشاءf1()على النمر عند انفٌذها ٌتم التىزرsubmitالكود استخدمناfunction f1 () {
4-الدالة لٌمة إلرجاعf1بـfalseالكود نستخدم ًافارغ النص صندوق ترن حالة فىretirn false :
5-ٌساوى او من ألل النص صندوق فى المدخل البٌان طول8حروفform1.text1.value.length<=8
6-الكود نستخدم فارغ حمل ترن عدم من لتحمكform1.text1.value!==form1.text2.value
7-الشرط نستخدم النص صندوق فى عددٌة بٌانات ادخال لمنعIsNaN ( form1.text1.value)
21. ::6;7966010alysun1973@yahoo.com
21
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
التحققمنحصةالبياانتاملدخةل
يفصفحةتسجيلالبياانت
بعدتعرفنعلىكٌفٌةالتحمكمنصحةالبٌانات،المدخلةاستكملمشروعنالسابك)مولعًمدرست(بإضافة
صفحةلتسجٌلالبٌاناتعلىأنٌتماجراءعملٌةالتحمكمنصحةالبٌاناتالمدخلةوذلنمنحٌث:
-عدوتسكحقماسىانطانبفازغا(Required Field. )
-طٕلكهًتانًسٔزالٌقمٍعحًاٍَتزيٕش.
-يطابقتانبٍاَاثانًدخهتًفًحقهكهًتانًسٔزٔاعادةادخالكهًت. انًسٔز
-انسًاحبإدخالقٍىعددٌتفقظًفحقم. ٍانس
الخامس الفصل
المشروع
Project
22. ::6;7966010alysun1973@yahoo.com
22
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
بعدالنمرعلىزرتسجٌلٌتمالتحمكأوالمنصحةالمدخالتثمحفظهاوالعودةلصفحةالدخولlogin.htm
وذلنإلتمامتسجٌلالدخولللصفحةالرئٌسٌةللمولعباستخداماالسموكلمةالمرورالسابكحفظهما.
25. ::6;7966010alysun1973@yahoo.com
25
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
مقدمة
ًهاصدارجدٌدمنلغةHTMLظهرعام2014وبهالعدٌدمنالتحسٌناتالتىنلمسهاخالل من
استخداممجموعةمناألدواتالجدٌدةًالتتسهلمنفكرةتصمٌمصفحةالوٌب.ومنالممياتز
الجديدةالتيجاءتبمجيءHTML 5ظيوروسومخاصةلعرضالفيديووالصوتووسومخاصة
لكتابةالمقاالتأواألخبارووسومخاصةبالرسمإضافةإلىمجموعةجديدةمنعناصراإلدخال
الخاصةبالنماذج.... ىاوغير
مستعرضاتالوٌبالداعمةلــــHTML 5:
ألنHTML 5ظيرتمنذةرفتةرقصينسبيافإنمعظممستعرضاتالويبالقديمةالتدعميالأل،سف
ولكنالمستعرضاتالجديدةستدعميابأنيا حيث تأكيد كلستكونلغةبناءصفحاتالويبيةرالمعيا
فيالمستقبليبرالقوليذافقدبدأتبعضالمستعرضاتبدعميافعلمثلاإلصداارتةراألخيمن
مستعرضات:Google ChromeوFirefoxوOperaوInternet ExplorerوSafari 6.
ال لألسف المستعرضات ىذه ولكنتدعمبشكلكاملتنفيذامرواألالجديدةالخاصةباإلصدارHTML 5.
ومنامرواألالجديدةالتيسنقومبالتعرفعمييابعضامرواألالتيتتعمقاتوبأدالتحكمفي المستخدمة
اإلدخالومنيااتواألد:
-COLOR
-Date
-Number
-requiredText
صهدوقاللوىCOLOR
ٌتٌحللمستخدماختٌارلونمنخاللصندوق. األلوان
: ًالتال األمر نستخدم الوٌب لصفحة وإلضافته< input type="color">
السادس الفصل
إثرائي
HTML5
26. ::6;7966010alysun1973@yahoo.com
26
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
صهدوقالتاريخDate
ٌتٌحللمستخدمادخالتارٌخمعٌنبواسطةنافذةالتموٌم.
وإلضافت: ًالتال األمر نستخدم الوٌب لصفحة ه<input type="date">
صهدوقالعددnumber
ٌتمانشاءهذهاألداةعلىصفحةالوٌبإلدخاللٌمالبدأنتكونعددٌةوٌمكنتحدٌدمديمعٌنلهذه.المٌم
نست الوٌب لصفحة وإلضافته: ًالتال األمر خدم<input type="submit">
27. ::6;7966010alysun1973@yahoo.com
27
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
استخداماخلاصيةRequired:
ٌتطلبذلنضرورةادخاللٌمةعنطرٌكالمستخدموعدمتركها. فارغة
: مثل األدوات بعض مع تستخدمtext, password, date, number, checkbox, radio,………
: ًالتال األمر نستخدم الوٌب لصفحة وإلضافته
28. ::6;7966010alysun1973@yahoo.com
28
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
انسبدط انفصم ٔرذسٚجبد أسئهخ
: اآلتية العبارات على الدال العلمى المصطلح أكتب
1-لغة من جدٌد اصدارHTMLن التى التحسٌنات من العدٌد بهالجدٌدة األدوات من مجوعة خالل من لمسها
2-بلغة الخاصة الجدٌدة الوامر منHTML5االدخال فى المستخدمة النموذج عناصر باضافة ٌتعلك أمر وهو
3-فارغة تركها وعدم المستخدم طرٌك عن لٌمة ادخال ضرورة ذلن ٌتطلب االدوات بعض مع استخدامها عند خاصٌة
4-إل الوٌب لصفحة اضافته ٌتم حملالمٌم لهذه معٌن مدى تحدٌد وٌمكن فمط عددٌة لٌم دخال
5-: أ العمود من سناسبه ما ب العمود ن إختر
) أ () ب (
<input type="date">األلوان صندوق إلضافةcolor الوٌب صفحة الى
< input type ="number">التارٌخ صندوق إلضافةdate الوٌب لصفحة الى
<input type ="color">العدد صندوق إلضافةnumber الوٌب لصفحة الى
29. ::6;7966010alysun1973@yahoo.com
29
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
مقدمة
تعدالتركيز ةرضرو ىناك جعل بشكل المجاالت مختمف فى االتصال وسائل أىم من نتراالنت شبكة
تنتج قد التى المخاطر عمىاإل ذلك اءرإجبالفيروسات االصابة بين ما المخاطر ىذه عوتتنو ستخدام
الةرمدماإلو الجياز عمى نةزالمخ لمبياناتأو المستخدم بممفات لمعبث اقرختإاأل ستغللينرخبقصد
اإل أو اززاإلبت أو اإلساءةالمخاطر اعوأن من ىاوغير الشخصية البيانات قةرس أو نتحالمن فالكثير
األلي معنى ال تافة تبدو قد التى المعمومات بعض أن نيدركو ال شخاصاالكث تعنىينراخ ألناس ير.
لالنرتنت االمو االستخدام
الهوٌة سرلة : ًالأوidentity:
قةرس أو قتورلس بو تتعمق معمومات اى أو آخر شخص اسم ما شخص استخدام أو انتحالهرغي
الضارة البرامج : ًاٌثانMaware:
مست تسمل التى عجةالمز أو المتطفمة أو العدائية امجرالبمن مشتق اسمياو الكمبيوتر امجرالب ألنظمة ةرت
الكمماتMaliciousو ) خبيث (softwareامجرب استخدام يمكنك امجرالب ىذه ولتفادى ) امجرب (
. جيازك لتأمين الفيروسات مكافحة
: التجسس برامج : ًاثالث
الحصو ندو المستخدمين عن الشخصية المعمومات بتجميع تقوم كمبيوتر امجربولتفادى افقتيموم عمى ل
الممفاتو الدعائية الممفاتو التجسس كممفات الخبيثة الممفات عن الكشف امجرب استخدام يجب امجرالب ىذه
بك الخاص نتراالنت متصفح عمى تسيطر التى
الفٌروس : ًارابعVirus:
امرالبو الكمبيوتر ةزأجي يصيب الذاتى االنتشار عمى ةرقد لو ضار صغير نامجربج
: السرٌة الرموز : ًاخامس
االتصاالتو المعمومات تكنولوجيا وسائل مع يتعامل فرد أى تخص التى الشخصية البيانات كافة بو يقصد
المستخدم اسم مثل أحد ألى عنيا الكشف ينبغى ال التىوUsernameالمرور وكممةpasswordعند
. المحمول نالتميفو أو نتراالنت مع التعامل
األول الفصل
لإلنترنت اآلمن اإلستخدام
30. ::6;7966010alysun1973@yahoo.com
30
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
مواقمعها التعامل وكيفية هامة ف
: االول المولف
بيدف االجتماعى اصلوالت موقع عمى لمصفحة ىالسر قمرالو المستخدم اسم بإدخال التسجيل نيكو أحيانا
الشخصى حسابو قةرلس احيانا المستخدم يتعرض وقد المطموبة معمومات ارسالو التطبيق فى اكراالشت
م كثير فى التطبيقات ىذه ان وخصوصاالياكر بيدف نتكو االحيان ن
:المولف مع التعامل كٌفٌة
ٔخاصة وٍّا السئٗطى اهلدف وعسفة لصعٕبة ًٕالعى ْٔد عمى التطبٗكات ِٓر وجن فى االشرتاك ًعد ٖفطن
السقي تغٗري ضسعة ٖسدى بالفعن حدخ ٔإذا الشدصى لمحطاب الطسى السقي بادخاه التطذٗن ُكا إذا
دخٕه َو حسصا الطسىالشدصٗة الصفحات فى ٔالعبح احدِي.
: الثانى المولف
فى العائمة ادرألف أو ليم شخصية صور االجتماعى اصلوالت اقعوم عمى وخاصة المستخدمين بعض وضع
خاصة أماكنو مناسبات.
بشك معيا التعامل أو التشيير أو اززابت عمميات فى علموقو المستخدم يتعرض قد : تحدث قد التى المشكمةل
وخلفو الفوتوشوب مثل الصور فى متخصصة امجرب يقرط عن آمن غير
: المولف مع التعامل
ضسٖتّا عمى التاكد البد الٍشس ٔعٍد لمعاوة ٌٔشسِا االحٕاه َو حاه بأى خاصة شدصٗة صٕز ٔضع ًعد
فكط املكسبني ألصدقاء اال عمّٗا االطالع ًٔعد.
: الثالث المولف
التميف قامرأ وضعفى التسجيل عند وتفاصيمو العمل انوعن أو السكن انوعن مثل شخصية وبيانات نو
اصلوالت اقعوم عمى شخصى حساب عمل أو المنتديات
: تحدث لد التى المشكلة
السن صغار من المستخدم كان إذا وخاصة الخطف أو ليةزالمن قاترلس احيانا علموقو المستخدم يتعرض قد
لزمن قابةر يوجد الواقعوالم ىذه عمى التسجيل عند كافية ية
: المولف مع التعامل
إٌشاء عٍد األوس لص إذا اخفائّا ٔاألفطن ًاملطتدد ختص ِاوة وعمٕوات ٔأ شدصٗة تفاصٗن ٔضع ًعد
هلي الطىاح ًٔعد املٍصه قبن َو املطتددوني صغاز عمى ٔالسقابة وٍتدٖات ٔأ تٕاصن وٕاقع عمى صفحات
البٗاٌات بتٍأهاملٕثٕقة لمىصادز فكط ٌٔشسِا اهلاوة الشدصٗة.
: الرابع المولف
االجتماعى اصلوالت اقعوم عبر الثقافاتو اءراال وتبادل التعارف بيدف يبةرغ أشخاص مع التحدث
: تحدث لد التى المشكلة
لموق ىذا يؤدى وقد الوىمية الشخصيات أصحاب وخاصة االشخاص بعض من الخداع بعض يحدث قدعو
استغللياو العائمية اررالس بعض عمى البعض اطلعو الموقف ةرلخطو الحياتية لمشكلت من كثير فى
31. ::6;7966010alysun1973@yahoo.com
31
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
: المولف مع التعامل
ٖتي ُا البد َٔلك االفساد بني ٔاالدتىاعٗات السٔابط شٖادة بّدف االدتىاعى التٕاصن وٕاقع أحد ًاضتددا
ِ ٔحتدٖد الشدص بٗاٌات َو التاكد وٍّا مبحاذٖرياشداص ع التعاون ًعد ٔاالفطن الفعمٗة ْٕٖت
وشرتكني اصدقاء ٍِاك ُٕٖك ُا ُاالطىئٍا ٖسٖد َمل ٔكرلك حكٗكٗة ٔلٗطت حسكٗة امساء ُٕٖطتددو
ْوع التعاون قبن الشدص ِٕٖة صحة َو لمتاكد لمطسفني.
: الخامس المولف
في اتراستما استكمال يقرط عن الكترونيا الوظائف بعض فى التسجيلشخصيو وبيانات تفاصيل يا
: تحدث لد التى المشكلة
لمجرد حقيقة غير وظائفف عن االعلن يقرط عن الوىمية الشركات بعض من الخداع بعض يحدث قد
العناصر اختيارو لممستخدمين بيانات قاعدة لعمل اتفوالي قامراو الشخصية بياناتو وكتابة المستخدم دخول
االستف أو الستغلليا ةزالمميمعينة اضرالغ منيا ادة
:المولف مع التعامل
َو التاكد وجن مبحاذٖري َٔلك ٔادتّد لمٕقت ًاتٕفري ًاٗعامل ْٗعم وتعازف اصبح ًٌظا ًاٌٗٔالغمكرت التكدٖي
ٔوعسفة ٔدٕدِا َو الفعمى التحكل طسٖل َع ٔظائف َع املعمٍة َاالواك ٔأ فعال الشسكاات ِٓر ٔدٕد
الفعمى ٔاالتصاه عٍٕاٌّاوع التعاون ٖٔفطن فعمٗة لٕظائف التكدٖي َع اعالٌّي َو ٔالتكد وعّي ٔاملباشس
السمسٗة ٔأ اذتكٕوٗة املؤضطات.
اآل لالستخدام يامة ارشاداتمولإلنرتنت
1
2
3
4
5
6
7
8
9
11
32. ::6;7966010alysun1973@yahoo.com
32
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
المعنىTermالمعنىTerm
االلكترونى التعدىCyber Bullying
الممبول االستخدام
لالنترنت
Acceptable Use
Policy
الحماٌة جدارFirewallالمساعدة طلبAsking for Help
االزدراءContemptعلى مدونةاإلنترنتWeb Blog
الهوٌة سرلةIdentity TheftالبلوتوثBluetooth
محلٌة شبكةLANالدردشة غرفةChat Room
المستخدم اسمUser Nameالكمبٌوتر شبكاتComputer Network
المرور كلمةPasswordواسعة شبكةWAN
خبٌثMaliciousضارة برامجMalware
فٌرسVirus
مح من مدونةالى مول
كمبٌوتر
MoBlog
الوٌب كامٌراWeb Cam
على التعامل آداب
االنترنت
Netiguette
السرٌة الرموزSecret Codesلفاعٌة نافذةPop Menu
الصرف ماكٌنات
االلى
ATMمزعجة رسائلSpam
السعٌد الصفحHappy Slappingاالحتٌالى التصٌدPhishing
التجسس برامجSpyware
التلفاالجتماعى زٌون
التفاعلى
Social interactive
television
33. ::6;7966010alysun1973@yahoo.com
33
انًمذيخ ٙف ًبًدائ أَذ
يلعدمحم
يلع
ٔانزذسٚجبد االسئهخ
: التالٗة العبازات أكىن : االٔه الطؤاه
1
2
3
4
5Web Blog
: عٍد ْتفعم الرى وا : الجاٌى الطؤاه
1
2
: ارتطأ العبازة ًأوا خطأ ٔكمىة الصحٗحة العبازة ًاوا صح كمىة أكتب : الجالح الطؤاه
1
2
3
4