مستند HTML DOM createDocumentFragment ()
أمثلة
إضافة عناصر إلى قائمة فارغة:
const fruits = ["Banana", "Orange", "Mango"];
// Create a document fragment:
const fragment = document.createDocumentFragment();
// Add li elements to the fragment:
for (let x in fruits) {
const li = document.createElement('li');
li.textContent = fruits[x];
dFrag.appendChild(li);
}
// Add fragment to a list:
document.getElementById('myList').appendChild(fragment);
إضافة عناصر إلى قائمة موجودة:
const fruits = ["Banana", "Orange", "Mango"];
// Create a document fragment:
const fragment = document.createDocumentFragment();
// Add li elements to the fragment:
for (let x in fruits) {
const li = document.createElement('li');
li.textContent = fruits[x];
dFrag.appendChild(li);
}
// Add fragment to a list:
document.getElementById('myList').appendChild(fragment);
التعريف والاستخدام
الطريقة createDocumentFragment()تنشئ عقدة خارج الشاشة.
يمكن استخدام العقدة خارج الشاشة لبناء جزء مستند جديد يمكن إدراجه في أي مستند.
يمكن createDocumentFragment()أيضًا استخدام الطريقة لاستخراج أجزاء من المستند ، أو تغيير ، أو إضافة ، أو حذف بعض المحتوى ، وإدراجه مرة أخرى في المستند.
ملحوظة
يمكنك دائمًا تعديل عناصر HTML مباشرة. لكن الطريقة الأفضل هي إنشاء جزء من مستند (خارج الشاشة) ، وإرفاق هذا الجزء بـ DOM الحقيقي (المباشر) عندما يكون جاهزًا. نظرًا لإدخال الجزء عندما يكون جاهزًا ، سيكون هناك إعادة تدفق واحد وتصيير واحد.
إذا كنت تريد إلحاق عناصر عناصر HTML في حلقات ، فإن استخدام أجزاء من المستند يؤدي أيضًا إلى تحسين الأداء.
تحذير!
تتم إزالة عقد المستند الملحقة بجزء المستند من المستند الأصلي.
بناء الجملة
document.createDocumentFragment()
المعلمات
| لا أحد |
قيمة الإرجاع
| نوع | وصف |
| العقدة | عقدة DocumentFragment التي تم إنشاؤها. |
دعم المتصفح
document.createComment() هي ميزة DOM المستوى 1 (1998).
إنه مدعوم بالكامل في جميع المتصفحات:
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | 9-11 | Yes | Yes | Yes | Yes |