1. التعريف
الخاصية: خاصية ، يتم تمثيل جميع عناصر HTML بنوع htmlelement. يرث نوع htmlelement مباشرة من العنصر ويضيف بعض السمات. تتوافق السمات المضافة مع كل عنصر HTML مع الخصائص القياسية الخمسة التالية: المعرف ، العنوان ، Lang ، DIR ، ClassName. عقدة DOM هي كائن ، بحيث يمكنها إضافة خصائص وطرق مخصصة مثل كائنات JavaScript الأخرى. يمكن أن تكون قيمة الخاصية أي نوع بيانات ، وهو حساس للحالة ، ولن تظهر الخاصية المخصصة في رمز HTML ، ولكن موجود فقط في JS.
السمة: الميزة ، مختلفة عن الخاصية ، يمكن أن تكون السمة مجرد سلسلة ، غير حساسة للحالة ، تظهر في InnerHTML ، ويمكن إدراج جميع السمات من خلال سمات صفيف الفئة.
2. أوجه التشابه
تتم مزامنة خصائص DOM القياسية مع السمات. تتم إضافة سمة معترف بها (غير مواطنة) إلى كائن DOM كخاصية. على سبيل المثال ، المعرف ، المحاذاة ، النمط ، وما إلى ذلك ، في هذا الوقت ، يمكن تشغيل الخصائص عن طريق تشغيل خاصية أو أساليب DOM مثل getAttribute () التي تستخدم خصائص التشغيل. ومع ذلك ، فإن اسم السمة الذي تم تمريره إلى getAttribute () هو نفس اسم السمة الفعلي. لذلك ، عند الحصول على القيمة المميزة للفئة ، يجب أن تمر في "الفصل".
3. الاختلافات
1). بالنسبة لبعض الخصائص القياسية ، هناك اختلاف في القيم التي تم الحصول عليها بواسطة GetAttribute و Point (.). مثل HREF و SRC والقيمة والأناقة و Onclick وغيرها من معالجات الأحداث.
2) .href: يحصل getAttribute على القيمة الفعلية لـ HREF ، بينما تحصل النقاط على عنوان URL الكامل ، الذي له فرق المتصفح.
نسخة الكود كما يلي:
<script>
var a = document.body.children [0]
a.href = '/'
تنبيه ('السمة:' + A.GetAttribute ('href')) // '/'
تنبيه ('خاصية:' + a.href) // ie: '/' ، others: url full url
</script>
تشبه قيمة SRC HREF ، ولكن IE ستعيد أيضًا عنوان URL الكامل ؛
تحتوي قيمة القيمة أيضًا على بعض الخصائص المدمجة لمزامنة "اتجاه واحد" (اتجاه واحد).
على سبيل المثال ، تتم مزامنة الإدخال. القيمة من السمة (أي أن الخاصية تحصل على المزامنة من السمة)
نسخة الكود كما يلي:
<type type = "text" value = "markup">
<script>
var input = document.body.children [0] ؛
input.setAttribute ('value' ، 'new') ؛
تنبيه (input.value) ؛ // "جديد" ، تم تغيير القيمة
التنبيه (input.getatrriobute (القيمة)) ؛ // 'جديد'
</script>
لكن السمة لا يمكن الحصول على التزامن من الخاصية:
نسخة الكود كما يلي:
<type type = "text" value = "markup">
<script>
var input = document.body.children [0] ؛
input.value = 'new' ؛
التنبيه (input.getAttribute ('value')) ؛ // "الترميز" ، لم يتغير!
</script>
يحصل getAttribute على القيمة الأولية ، بينما تحصل النقاط على القيمة الأولية أو القيمة المعدلة .value. على سبيل المثال ، عندما يدخل الزائر أحرفًا معينة ، تحافظ سمة "القيمة" على القيمة الأصلية بعد تحديث الخاصية. يمكن استخدام القيمة الأصلية للتحقق مما إذا كان الإدخال يتغير ، أو لإعادة تعيينها.
بالنسبة إلى معالجات الأحداث مثل Style و OnClick ، تقوم طريقة getAttribute بإرجاع سلسلة عند الوصول إليها ، بينما تقوم DOT بإرجاع الكائن المقابل ودالة معالج الأحداث.
لممتلكات فحص في الإدخال
نسخة الكود كما يلي:
<script>
var input = document.body.children [0]
تنبيه (إدخال. فحص) // صحيح
التنبيه (input.getAttribute ('check')) // سلسلة فارغة
</script>
GetAttribute يحصل على القيمة التي تقوم بها بالفعل. النقطة تُرجع قيمة منطقية.
الاختلافات في توافق المتصفح
1. في IE <9 متصفحات ، يمكنك استخدام أرقام DOT و getAttribute للوصول إلى خصائص مخصصة بين بعضها البعض.
2. أي <8 (بما في ذلك وضع توافق IE8 IE7) ، والخاصية والسمة هي نفسها. نظرًا لأن السمة ليست حساسة للحالة ، في هذه الحالة ، عند استخدام GetAttribute للوصول إلى الميزة ، سيقوم المتصفح بتحديد القيمة التي تظهر لأول مرة.
نسخة الكود كما يلي:
document.body.abba = 1 // تعيين خاصية (يمكن الآن قراءتها عن طريق getAttribute)
document.body.abba = 5 // تعيين خاصية بحالة أخرى
// يجب الحصول على خاصية تسمى "ABBA" بطريقة غير حساسة للحالة.
ALERT (document.body.getAttribute ('ABBA')) // 1
خاصية الأولوية
في التطبيقات الفعلية ، تستخدم 98 ٪ من عمليات DOM خصائص.
لا يوجد سوى حالتان تتطلب استخدام السمات
1. تخصيص سمات HTML لأنه لا يتم مزامنتها مع خاصية DOM.
2. الوصول إلى سمات HTML المدمجة ، والتي لا يمكن مزامنتها من الخاصية. على سبيل المثال ، قيمة قيمة علامة الإدخال.