انتقل إلى محتوى الدرس
ابدأ رحلتك
الدرس 49
دورة جافا سكريبت

التعامل مع خصائص العناصر في صفحة HTML عن طريق الجافا سكريبتJavaScript DOM Attributes

ستتعلم في هذا الدرس قراءة أي قيمة Value لأي خاصية Atrribute داخل أي عنصر في صفحة HTML عن طريق الشجرة DOM Tree ويمكنك ايضاً اضافة خصائص جديدة كما يمكنك تعديل أي خاصية موجودة مسبقاً لأي قيمة اخري.

ابدأ التعلّم استكشف الأمثلة
أقسام الدرس
2
الأمثلة
5
اللغة
العربية
تاريخ النشر
غير محدد
المشاهدات
4,886
محتوى الدرس
في هذا الدرس 2تصفّح المواضيع

getAttribute() DOM Method in JavaScript دالة ()getAttribute في الشجرة DOM في لغة جافا سكريبت

تستخدم دالة ()getAttribute في لغة جافا سكريبت لتقوم بقراءة قيمة Value أي خاصية Attribute لأي عنصر في صفحة HTML عن طريق جافا سكريبت.

getAttribute() method Syntax

كيف تكتب دالة [ getAttribute ] getAttribute() method Syntax؟

HTML 
Element.getAttribute('attributeName');

getAttribute Parameters معطيات أو عوامل دالة ()getAttribute في لغة جافا سكريبت:

نقوم بتمرير الي دالة ()getAttribute عامل واحد وهو :

  •  Attribute Name  أسم الخاصية التي تريد أن تقرأ قيمتها من أي عنصر في صفحة HTML عن طريق DOM في جافا سكريبت.

getAttribute

قراءة قيمة خاصية لعنصر وقمنا بطباعتها داخل الصفحة.

HTML 
let apple = document.getElementById('apple');
apple.getAttribute('class')
document.write("Element class value : " + apple.getAttribute('class'));
document.write("<br>");
document.write("Element id value : " + apple.getAttribute('id'));
جرّب بنفسك

setAttribute() DOM Method in JavaScript دالة ()setAttribute في الشجرة DOM في لغة جافا سكريبت

تستخدم دالة ()setAttribute في لغة جافا سكريبت لأضافة خصائص Attributes جديدة أو التعديل علي الخصائص Attributes الحالية لأي عنصر في صفحة HTML بلغة جافا سكريبت.

setAttribute() method Syntax

كيف تكتب دالة [ setAttribute ] setAttribute() method Syntax؟

HTML 
Element.setAttribute('attributeName','newValue');

setAttribute Parameters معطيات أو عوامل دالة ()setAttribute في لغة جافا سكريبت:

نقوم بتمرير الي دالة ()setAttribute عاملين هم:

  •  Attribute Name  أسم الخاصية التي تريد أن تضيفها جديدة أو اسم الخاصية Attribute التي تريد التعديل عليها لأي عنصر في صفحة HTML عن طريق DOM في جافا سكريبت.
  •  Value  القيمة الجديدة التي تريد أن تستبدلها بالقيمة Value القديمة أو ستكون القيمة لأي خاصية جديدة Attribute .

Add Attribute

يمكنك اضافة خاصية Attribute جديدة لأي عنصر عن طريق دالة ()setAttribute.

HTML 
let apple = document.getElementById('apple');
document.write("get class value before add : " + apple.getAttribute('class'));
document.write("<br>");
apple.setAttribute('class','memory');
document.write("New class value : " + apple.getAttribute('class'));
جرّب بنفسك

Update Attribute

يمكنك تعديل قيمة Value خاصية Attribute ,وأستبدالها بقيمة جديدة لأي عنصر عن طريق دالة ()setAttribute.

HTML 
let apple = document.getElementById('apple');
document.write("get class value before update : " + apple.getAttribute('class'));
document.write("<br>");
apple.setAttribute('class','volvo');
document.write("New class value : " + apple.getAttribute('class'));
جرّب بنفسك

مشاركة

هل كان هذا الدرس مفيدًا؟

جارٍ تحميل الآراء…