إن المقتطف من دليل JavaScript الموثوق (الطريقة النهائية لـ JQuery للعثور على عناصر بناءً على محدد النمط هي استخدام GetElementsByTagname (*) أولاً للحصول على جميع عناصر DOM ، ثم تصفية جميع عناصر DOM وفقًا لمحدد النمط)
اليوم جربت سرعة طرق اختيار العناصر المختلفة. الطريقة الأصلية هي أسرع حوالي 8 مرات من jQuery. IE8 هو أبطأ ، IE9 أسرع حوالي 3 مرات من IE8 ، يؤدي Chrome الأفضل ، يليه Firefox)
طرق لتحديد عناصر المستندات:
1. حدد عنصرًا حسب المعرف (getElementById)
1) طريقة الاستخدام: document.getElementByid ("Domid")
عندما يكون DOMID قيمة سمة المعرف للعنصر المراد تحديده
2) التوافق: لا تميز المتصفحات IE مع إصدارات IE8 عن حالة رقم معرف العنصر وستعود عناصر مطابقة سمة الاسم.
2. حدد العناصر حسب الاسم (getElementsByName)
1) طريقة الاستخدام: document.getElementsByName ("DomName")
حيث يكون DomName هو قيمة سمة الاسم للعنصر المراد تحديده
2) الوصف: أ. قيمة الإرجاع عبارة عن مجموعة عقيدة (تختلف عن الصفيف)
ب. على عكس سمة المعرف ، تكون سمة الاسم صالحة فقط في عدد قليل من عناصر DOM (نموذج النموذج ، عنصر النموذج ، iframe ، IMG). هذا لأنه يتم إنشاء سمة الاسم لتسهيل تقديم بيانات النموذج.
ج. عند تعيين سمات الاسم للنموذج ، سيتم إنشاء IMG ، iframe ، applet ، embed ، عناصر الكائن ، السمات المسمى بعد قيمة سمة الاسم تلقائيًا في كائن المستند. لذلك ، يمكن الرجوع إلى كائن DOM المقابل من خلال document.domname
3) التوافق: العناصر التي تتطابق مع قيم سمة معرف في IE ستعود أيضًا معًا
3. حدد العناصر حسب اسم العلامة (GetElementsByTagname)
1) طريقة الاستخدام: element.getElementsbyTagname ("tagname")
حيث ، العنصر هو عنصر DOM صالح (بما في ذلك المستند)
TagName هو اسم علامة عنصر DOM
2) الوصف: أ. قيمة الإرجاع عبارة عن مجموعة عقيدة (تختلف عن الصفيف)
ب. يمكن لهذه الطريقة فقط تحديد عناصر نسل العنصر الذي يدعو الطريقة.
ج. TagName غير حساس للحالة
د. عندما يكون TagName *، فهذا يعني أنه يتم اختيار جميع العناصر (مسؤولة عن القاعدة)
ه. يحدد HTMLDOCUMENT بعض خصائص الاختصار للوصول إلى عقدة العلامات. على سبيل المثال: تشير صور الصور والنماذج والروابط الخاصة بالوثيقة إلى مجموعة عناصر العلامات <img> و <form> و <a> ، بينما يقوم المستند.
4. حدد العناصر من خلال فئة CSS (GetElementsByClassName)
1) طريقة الاستخدام: element.getElementsByClassName ("ClassNames")
حيث ، العنصر هو عنصر DOM صالح (بما في ذلك المستند)
أسماء ClassNames هي مزيج من أسماء فئة CSS (يتم فصل أسماء فصول متعددة عن طريق المسافات ، والتي يمكن فصلها بمساحات متعددة).
على سبيل المثال ، سيختار element.getElementsByClassName ("class2 class1") عناصر في عناصر سليل العناصر التي تم تطبيق كل من أنماط class1 و class2 (لا تميز أسماء الأنماط بين الترتيب)
2) الوصف: أ. قيمة الإرجاع عبارة عن مجموعة عقيدة (تختلف عن الصفيف)
ب. يمكن لهذه الطريقة فقط تحديد عناصر نسل العنصر الذي يدعو الطريقة.
3) التوافق: IE8 وتحت المتصفحات لا تنفذ طريقة getElementsByClassName
5. حدد العناصر من خلال محدد CSS
1) طريقة الاستخدام: document.queryselectarall ("محدد")
حيث ، المحدد هو محدد CSS قانوني
2) الوصف: أ. قيمة الإرجاع عبارة عن مجموعة عقيدة (تختلف عن الصفيف)
3) التوافق: IE8 وتحت المتصفحات يدعمان فقط بناء جملة المحدد القياسي CSS2
الطريقة البسيطة لاختيار عناصر DOM في JS هي كل المحتوى الذي أشاركه معك. آمل أن تتمكن من إعطائك مرجعًا وآمل أن تتمكن من دعم wulin.com أكثر.