java_script الدرس 13

java_script الدرس 13


النتائج 1 إلى 2 من 2

الموضوع: java_script الدرس 13

العرض المتطور

المشاركة السابقة المشاركة السابقة   المشاركة التالية المشاركة التالية
  1. #1

    new java_script الدرس 13



    بسم الله الرحمن الرحيم
    *******
    "اللهم علمنا ما ينفعنا وانفعنا بما علمتنا انك انت العليم الحكيم "

    --------------------------------------------------------------------------

    تكلمنا فيما سبق عن ال element وال node وال sibling وقولنا كلها تشير الى شئ
    واحد الا وهو ال tag وتكلمنا ايضا عن ال object وقولنا انه النسخة من الشئ مع امكانية
    التعديل على هذه النسخة وذكرنا ايضا ان عند تعريف متغير من النوع object بذلك قد
    مكون عرفنا ان هذا المتغير حصل على كل خصائص properties ال object الذى عرفناه منه
    لاحظ
    كود HTML:
    <!DOCTYPE HTML>
    <html>
    <head>
    	<title>Return about DOM</title>
    </head>
    
    <body>
    
    <b id="bold" style="color: darkblue;" >
    بسم الله الرحمن الرحيم 
    </b>
    **********
    var x= document.getElementById("bold");
    x.style.color="#ff0000";
    </script>
    </body>
    </html>
    دعنا نفصل شوية فى الكود السابق !!
    فى الكود السابق ادرجنا Tag وهو ال b وكتبنا بداخله
    ثم عرفنا متعير x وعرفنا انه object م ال b اذن انت الان عرفت ان
    ال x قد حصل على كل خصائص attribute ال b هنا بدليل اذا قمت بتعطيل
    السكربت بوضعه بين <!-- --> ستجد ان الخط بالون الازرق
    الغامق وبتفعيل الكود بحذف العلامتين السابقتين قبل وبعد السكربت سيتغير اللون الى
    االلون الاحمر اذن انت قد فهمت ان ال x قد حصل على نسخة من ال b وتم التعديل عليها

    ملحوظة:
    ذكرنا كلمتى ( تعطيل وتفعيل ) ماذا نعنى بذلك ؟!!!
    فى ال javaScript ما يسمى بال comment او التعليقات ما هى التعليقات ؟
    هى الاشياء التى لا يتم تنفيذها بداخل الكود اى يتم تجاهلها كليا حتى وان كانت الالف الاسطر
    ودى هتفيدنا بايه ؟!! تفيدنا التعليقات فى شرح الكود وذالك اذا كان الكود طويل ولاسيما اذا
    كان معقد ويحتوى على اسطر برمجية كثيرة ودوال وشروط....الخ
    كيف اكتب ال comment ؟ لكتابة التعليقات
    طريقتين 1 - فى سطر واحد 2- فى اكثر من سطر
    1 - لكتابة التعليق فى سطر واحد لابد عليك كتابة //
    2 - ~~~~~~~~~~~~~~~~~~~~~~~~~~~ /* هنا يكتب التعليق */

    كود HTML:
    <!DOCTYPE HTML>
    <html>
    <head>
    	<title>Return about DOM</title>
    </head>
    
    <body>
    
    <b id="bold" style="color: darkblue;" >
    بسم الله الرحمن الرحيم 
    </b>
    **********
    //var x= document.getElementById("bold");
    /*x.style.color="#ff0000";*/
    </script>
    </body>
    </html>
    لاحظ انه لن يتم عمل السكربت وذلك لاننا قمنا بكتابته كتعليق
    كود HTML:
    <html>
    <head>
    	<title>Return about DOM</title>
    </head>
    
    <body>
    <b id="bold" style="color: darkblue;" >
    بسم الله الرحمن الرحيم 
    </b>
    **********
    function changeContent(){
    var x= document.getElementById("bold");
    x.innerHTML="<h2>welcom zaizo max</h2>"
    }
    </script>
    <br />
    <button onclick="changeContent();"></button>
    </body>
    </html>
    لاحظ فى الكود السابق انه لا يوجد شى جديد عرفنا function وبداخلها متغير من النوع
    object يحتوى على كل ما بداخل ال tag b لا شئ جديد لكن هناك شئ مثير جدا هل لاحظته ؟!!!!
    الا وهو تغيير كل محتوى ال b خذا هذا الكود سيتم التوضيح عليه اكثر
    كود HTML:
    <!DOCTYPE HTML>
    <html>
    <head>
    	<title>Return about DOM</title>
    </head>
    
    <body id="bold">
    <b  style="color: darkblue;" >
    بسم الله الرحمن الرحيم 
    </b>
    <p>
    لا الله الا الله محمد رسول الله 
    </p>
    **********
    function changeContent(){
    var x= document.getElementById("bold");
    x.innerHTML="<h1>الله اكبر </h1>";
    }
    </script>
    <br />
    <button onclick="changeContent();"></button>
    </body>
    </html>
    جربت الكود ؟!! ماذا وجدت ؟!! ظهور عبارة " الله اكبر " لوحدها بالصفحة ماذا حدث؟!!
    على الرغم من وجود 2 tags فى الصفحة b & p الا انهم اختفوا لماذا ؟!! احنا قولنا انه
    يتم التعديل على ال element ككل ويقوم باستبدال كل محتوياته طيب اذا كانت الصفحة عندى
    مليئة بالاكواد وعرفت متغير كالسابق على ال body هل اضيع جميع ما بالصفحة ؟ بالتاكيد لا
    طيب ما العمل ؟ للخروج من المشكلة قم بتعرف tag جديد فى الصفحة ولا تضمنه محتويات
    وضع ما بالسكربت فى هذا ال tag اذا كنت تريد تضمين شئ جديد للصفحة وتريد ان تظل كل شى كما هو
    لاحظ
    كود HTML:
    <!DOCTYPE HTML>
    <html>
    <head>
    	<title>Return about DOM</title>
    </head>
    <body >
    <b id="bold" >
    بسم الله الرحمن الرحيم 
    </b>
    <p>
    لا الله الا الله محمد رسول الله 
    </p>
    <span id="span">
    
    </span>
    **********
    function changeContent(){
    var x= document.getElementById("bold");
    var xx= document.getElementById("span");
    xx.innerHTML=x.innerHTML;
    
    }
    </script>
    <br />
    <button onclick="changeContent();"></button>
    </body>
    </html>
    لاحظ هنا قمنا بجلب محتويات ال tag b ووضعناه فى span دون ان نغير
    محتويات الصفحة
    ==================================
    اللهم لك الحمد اشهد ان لا اله الا الله
    واشهد ان محمدا رسول الله

    أنا لا أصدق احدا حتى اتأكد مما يقول
    ليس لضعف ثقــــــــة فيـــــــــــــــه
    ولكن هذا ما علمنى إياه ربى
    _____________________zAiZo_MaX________________

  2. #2

    افتراضي رد: java_script الدرس 13

    شرح واضح

    لاهنت

    واااصل

    ودي واحترامي
    إبـــــ/ /ــــن غــــزة


    سـندب الرعب في قلـــوب الصهاااايـــنـة


    ليس العار في أن نسقط ولكن العار ألا نستطيع النهوض


    طعنة العدو تدمي الجسد..وطعنة الصديق تدمي القلب


    ..........

    ما تحسر أهل الجنة على شئ..كما تحسروا على ساعة لم يذكر فيها إسم الله


    ............

    الحياة مليئة بالحجارة فلا تتعثر بها بل اجمعها وابن بها سلما تصعد بها نحو النجاح

المواضيع المتشابهه

  1. java_script الدرس 11
    بواسطة zaizo max في المنتدى لغات برمجة المواقع
    مشاركات: 4
    آخر مشاركة: 01-21-2016, 12:08 PM
  2. java_script الدرس 12
    بواسطة zaizo max في المنتدى لغات برمجة المواقع
    مشاركات: 2
    آخر مشاركة: 04-13-2013, 12:13 PM
  3. java_script الدرس التاسع
    بواسطة zaizo max في المنتدى لغات برمجة المواقع
    مشاركات: 3
    آخر مشاركة: 04-09-2013, 06:24 PM
  4. java_script الدرس السابع
    بواسطة zaizo max في المنتدى لغات برمجة المواقع
    مشاركات: 4
    آخر مشاركة: 04-09-2013, 03:16 AM
  5. java_script الدرس الثالث
    بواسطة zaizo max في المنتدى لغات برمجة المواقع
    مشاركات: 0
    آخر مشاركة: 04-03-2013, 03:52 AM

المفضلات

أذونات المشاركة

  • لا تستطيع إضافة مواضيع جديدة
  • لا تستطيع الرد على المواضيع
  • لا تستطيع إرفاق ملفات
  • لا تستطيع تعديل مشاركاتك
  •