Latest web development tutorials
×

JavaScript مسار

JavaScript مسار JavaScript مقدمة موجزة JavaScript استعمال JavaScript تصدير JavaScript قواعد JavaScript البيانات JavaScript مذكرة JavaScript متغير JavaScript أنواع البيانات JavaScript الأجسام JavaScript وظيفة JavaScript مجال JavaScript حدث JavaScript سلسلة JavaScript مشغلي JavaScript مقارنة JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript نوع التحويل JavaScript التعبير العادية JavaScript خطأ JavaScript التصحيح JavaScript رفع متغير JavaScript الوضع الصارم JavaScript استخدام غير لائق JavaScript مصادقة النماذج JavaScript كلمات محفوظة JavaScript JSON JavaScript void JavaScript كود المواصفات

JS وظيفة

JavaScript تعريف وظيفة JavaScript وسائط الدالة JavaScript استدعاء دالة JavaScript الإغلاق

JS HTML DOM

DOM مقدمة موجزة DOM HTML DOM CSS DOM حدث DOM EventListener DOM العنصر

JS دروس متقدمة

JavaScript الأجسام JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp الأجسام

JS المتصفح BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript فرقعة JavaScript حدث موقوتة JavaScript Cookies

JS مخزن

JavaScript مخزن JavaScript اختبار jQuery JavaScript اختبار Prototype

JS أمثلة

JavaScript أمثلة JavaScript مثيل كائن JavaScript مثيل كائن المستعرض JavaScript HTML DOM أمثلة JavaScript ملخص

JS الدليل المرجعي

JavaScript الأجسام HTML DOM الأجسام

جافا سكريبت HTML DOM

من خلال DOM HTML، والوصول إلى جميع العناصر وثيقة جافا سكريبت HTML.

HTML DOM (طراز كائن المستند)

عندما يتم تحميل الصفحة، فإن متصفح خلق نموذج كائن مستند الصفحة (طراز كائن المستند).

ويتمحور نموذج HTML DOM مثل شجرة من الأشياء:

شجرة HTML DOM

شجرة DOM HTML

طراز كائن برمجة، اكتسبت جافا سكريبت قدرة كافية لإنشاء HTML الديناميكية.

  • جافا سكريبت يمكن تغيير الصفحة لجميع عناصر HTML
  • جافا سكريبت يمكن تغيير صفحة HTML جميع العقارات
  • جافا سكريبت يمكن تغيير الصفحة جميع أنماط CSS
  • جافا سكريبت قادرة على الرد على كل صفحة الأحداث

العثور على عناصر HTML

عادة، وجافا سكريبت، تحتاج إلى التعامل مع عناصر HTML.

من أجل القيام بذلك الشيء، يجب عليك أولا العثور على العنصر. هناك ثلاث طرق للقيام بذلك:

  • البحث عن عناصر HTML من قبل معرف
  • البحث عن عناصر HTML بالاسم العلامة
  • البحث عن عناصر HTML بالاسم الطبقة

العثور على عناصر HTML من قبل معرف

العثور على عناصر HTML DOM في أسهل طريقة هي باستخدام معرف للعنصر.

ويجد هذا المثال معرف = "مقدمة" العنصر:

أمثلة

فار س = document.getElementById ( "مقدمة")؛

محاولة »

إذا وجد عنصر، ستكون طريقة شكل كائن (x في) يعود هذا العنصر.

إذا لم يتم العثور على العنصر، ثم العاشر سيتضمن فارغة.

العثور على عناصر HTML بالاسم العلامة

ويجد هذا المثال معرف = عناصر "الرئيسية"، وبعد ذلك ننظر للحصول على معرف = عنصر "الرئيسي" في كل <ص> عناصر هي:

أمثلة

فار س = document.getElementById ( "الرئيسي")؛
فار ذ = x.getElementsByTagName ( "ع")؛

محاولة »

البحث عن عناصر HTML بالاسم الطبقة

في هذه الحالةgetElementsByClassName وظيفة للعثور على الطبقة = "مقدمة" العنصر:

أمثلة

فار س = document.getElementsByClassName ( "مقدمة")؛

محاولة »

HTML DOM تعليمي

في هذا البرنامج التعليمي في الصفحات التالية، وسوف تتعلم:

  • كيفية تغيير محتوى عنصر HTML (HTML داخلي)
  • كيفية تغيير نمط عناصر HTML (CSS)
  • كيف حدث HTML DOM من رد فعل
  • كيف يمكنني إضافة أو إزالة عناصر HTML