javascript - w3schools - siblings jquery




لماذا لا تجد jQuery أو طريقة DOM مثل getElementById العنصر؟ (4)

ما الأسباب المحتملة لـ document.getElementById أو $("#id") أو أي طريقة أخرى من طرق DOM / jQuery selector التي لا تعثر على العناصر؟

تتضمن مشكلات المثال ما يلي:

فشل jQuery بصمت في ربط معالج حدث ، وطريقة DOM قياسية تُرجع null تؤدي إلى الخطأ:

غير معروف TypeError: لا يمكن تعيين الخاصية '...' فارغة


إذا كان العنصر الذي تحاول الوصول إليه داخل إطار iframe وتحاول الوصول إليه خارج سياق iframe فسيؤدي ذلك أيضًا إلى فشله.

إذا كنت ترغب في الحصول على عنصر في iframe ، يمكنك معرفة كيف here .


كما أشارFelixKling ، فإن السيناريو الأكثر احتمالًا هو أن العقد التي تبحث عنها غير موجودة (حتى الآن).

ومع ذلك ، يمكن لممارسات التطوير الحديثة أن تقوم بمعالجة عناصر الوثيقة خارج شجرة الوثيقة إما مع DocumentFragments أو ببساطة فصل / إعادة ربط العناصر الحالية مباشرة. يمكن استخدام هذه التقنيات كجزء من تخطيط جافا سكريبت أو لتجنب عمليات إعادة رسم / إعادة تدفق مفرطة بينما يتم تغيير العناصر المعنية بشكل كبير.

وبالمثل ، فإن وظيفة "Shadow DOM" الجديدة التي يتم طرحها عبر المتصفحات الحديثة تسمح للعناصر بأن تكون جزءًا من الوثيقة ، ولكن لا يمكن أن تكون قادرة على الاستعلام من خلال document.getElementById وجميع طرق الأخوة (querySelector ، الخ). يتم ذلك لتغليف الوظيفة وإخفائها بشكل خاص.

مرة أخرى ، على الرغم من ذلك ، فمن الأرجح أن العنصر الذي تبحث عنه ببساطة ليس (حتى الآن) في المستند ، ويجب عليك أن تفعل كما يقترح فيليكس. ومع ذلك ، يجب أن تكون مدركًا أيضًا أن ذلك ليس السبب الوحيد الذي يجعل العنصر غير قابل للإصلاح (سواء بشكل مؤقت أو دائم).


ها نحن ذا. ضع وظيفة واحدة داخل علامة النص البرمجي أو أكثر إذا كان لديك reqiurments محددة. إذا كنت تريد ذلك في جافا سكريبت نقية هنا هو ما يمكننا القيام به. لدينا قائمة بالأحداث التي يتم إطلاقها في السلسلة عند بدء تحميل محتوى html.

window.addEventListener('DOMContentLoaded', function() {
   //order 1
   //do your work 
}, true);

document.addEventListener('DOMContentLoaded', function() {
  //order 2
  //do your work 
}, true);

document.addEventListener('DOMContentLoaded', function() {
 // order 3
 //do your work
});

window.addEventListener('DOMContentLoaded', function() {
  // order 4
  //do your work
});

window.addEventListener('load', function() {
  // order 5
  //do your work
}, true);

window.addEventListener('load', function() {
  // order 6
  //do your work
});

window.onload = function() {
 //order 7
 //do your work
};

هذا هو ترتيب حدث المستند أو عرض النافذة.

لديك خيار واحد آخر من العمل حول هذا كما يمكنك استخدام التأجيل

[تم تأجيل ، سمة منطقية ،] تم تعيينها للإشارة إلى متصفح أن النص المقصود سيتم تنفيذه بعد تحليل المستند.

<script src="jsfile.js" defer> 
</script>

أسباب عدم عمل المحددات المستندة إلى معرّف

  1. العنصر / DOM ذو المعرّف المحدد غير موجود حتى الآن.
  2. العنصر موجود ، لكنه غير مسجل في DOM [في حالة عقد HTML الملحقة ديناميكيًا من استجابات Ajax].
  3. يوجد أكثر من عنصر واحد له نفس المعرف وهو ما يسبب التعارض.

محاليل

  1. حاول الوصول إلى العنصر بعد الإعلان عنه أو بدلاً من ذلك استخدم أشياء مثل $(document).ready();

  2. للعناصر القادمة من إجابات Ajax ، استخدم طريقة .bind() jQuery. الإصدارات القديمة من jQuery قد .live() لنفسه.

  3. استخدم الأدوات [على سبيل المثال ، مكون webdeveloper الإضافي للمتصفحات] للعثور على معرفات مكررة وإزالتها.







dom