أحدث البرامج التعليمية وتطوير الشبكة
×

JS البرنامج التعليمي

JS الصفحة الرئيسية JS المقدمة JS ألى أين JS الناتج JS بناء الجملة JS البيانات JS تعليقات JS المتغيرات JS مشغلي JS علم الحساب JS مهمة JS أنواع البيانات JS وظائف JS الأجسام JS نطاق JS أحداث JS سلاسل JS طرق سلسلة JS أرقام JS طرق عدد JS الرياضيات JS التمور JS تاريخ تنسيقات JS تاريخ طرق JS المصفوفات JS طرق مجموعة JS القيم المنطقية JS مقارنات JS الظروف JS تحول JS حلقة غيرمنتهية For JS حلقة بينما JS استراحة JS نوع التحويل JS التعبير العادي JS أخطاء JS التصحيح JS الرفع JS الوضع الصارم JS دليل الاناقة JS أفضل الممارسات JS الأخطاء JS أداء JS الكلمات المحجوزة JS JSON

JS أشكال

أشكال التحقق من صحة API أشكال

JS موضوع

تعريفات الكائن خصائص الكائن طرق كائن نماذج الكائن

JS وظائف

تعاريف وظيفة وظيفة المعلمات وظيفة الاحتجاج الإغلاق وظيفة

JS HTML DOM

DOM مقدمة DOM أساليب DOM وثيقة DOM عناصر DOM HTML DOM CSS DOM الرسوم المتحركة DOM أحداث DOM EventListener DOM ملاحة DOM العقد DOM Nodelist

JS المتصفح BOM

JS Window JS Screen JS Location JS History JS Navigator JS Popup Alert JS Timing JS Cookies

JS أمثلة

JS أمثلة JS HTML DOM JS HTML إدخال JS HTML الأجسام JS HTML أحداث JS المتصفح JS اختبار قصير JS ملخص

JS المراجع

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


 

JavaScript HTML DOM عناصر

❮ السابق التالي الفصل ❯

هذه الصفحة يعلمك كيفية العثور على وعناصر الوصول HTML في صفحة HTML.

اكتشاف عناصر HTML

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

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

  • العثور على عناصر HTML من قبل id
  • العثور على عناصر HTML بالاسم العلامة
  • العثور على عناصر HTML من قبل class اسم
  • العثور على عناصر HTML من محددات CSS
  • العثور على عناصر HTML من قبل مجموعات كائن HTML

العثور على عنصر HTML عن طريق Id

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

ويجد هذا المثال عنصر مع id="intro" :

مثال

var myElement = document.getElementById("intro");
انها محاولة لنفسك »

إذا تم العثور على العنصر، فإن طريقة إرجاع العنصر ككائن (في myElement ).

إذا لم يتم العثور على العنصر، myElement سوف تحتوي على باطل.

العثور على عناصر HTML التي كتبها اسم العلامة

ويجد هذا المثال فقط <p> عناصر هي:

مثال

var x = document.getElementsByTagName("p");
انها محاولة لنفسك »

ويجد هذا المثال عنصر مع id="main" ، ومن ثم يجد كل <p> عناصر داخل "main" :

مثال

var x = document.getElementById("main");
var y = x.getElementsByTagName("p");
انها محاولة لنفسك »

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

إذا كنت تريد أن تجد جميع عناصر HTML بنفس class اسم، استخدام getElementsByClassName() .

هذا المثال بإرجاع قائمة بجميع العناصر مع class="intro" .

مثال

var x = document.getElementsByClassName("intro");
انها محاولة لنفسك »

عناصر العثور بالاسم الفئة لا يعمل في Internet Explorer 8 والإصدارات السابقة.

العثور على عناصر HTML التي كتبها المختارون CSS

إذا كنت تريد أن تجد جميع عناصر HTML الذي يطابق محدد CSS محدد ( id ، أسماء فئة، وأنواع، والصفات والقيم من سمات، الخ)، واستخدام querySelectorAll() الأسلوب.

هذا المثال بإرجاع قائمة بجميع <p> العناصر مع class="intro" .

مثال

var x = document.querySelectorAll("p.intro");
انها محاولة لنفسك »

و querySelectorAll() لا تعمل طريقة في Internet Explorer 8 والإصدارات السابقة.

العثور على عناصر HTML من قبل مجموعات كائن HTML

ويجد هذا المثال عنصر النموذج مع id="frm1" ، في جمع النماذج ويعرض كل القيم العنصر:

مثال

var x = document.forms["frm1"];
var text = "";
var i;
for (i = 0; i < x.length; i++) {
    text += x.elements[i].value + "<br>";
}
document.getElementById("demo").innerHTML = text;
انها محاولة لنفسك »

الكائنات HTML التالية (ومجموعات الكائن) يمكن الوصول إليها أيضا:

اختبر نفسك مع تمارين!

التمرين 1 » التمرين 2» التمرين 3 » التمرين 4» التمرين 5 »


❮ السابق التالي الفصل ❯