`Document.createDocumentFragment()‎`

The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

يُنشئُ التّابع Document.createDocumentFragment()‎ كائنا فارغًا من النّوع DocumentFragment.

البنية العامة

var fragment = document.createDocumentFragment();

`fragment`

مرجِع يُشير إلى كائن فارغ من النّوع DocumentFragment.

وصف

كائنات DocumentFragment هي عقدُ DOM. ولا تكون أبدًا جزءًا من شجرة DOM الأساسيّة. الغرض منها يكون عادةً إنشاء قطعة مُستندٍ (document fragment) ثمّ إضافة عناصرَ إليها، ثمّ إضافة قطعة المُستند إلى شجرة DOM. وتُبدَلُ قطعة المستند في شجرة DOM بجميع أولادها.

ولأنّ قطعة المُستند تُخزَّن في الذّاكرة ولا تكون جزءًا من شجرة DOM الرّئيسيّة، فإضافة أولاد إليها لا يُسبّب إعادة تدفّقٍ في الصّفحة (reflow، الذي يتعلّق بحساب وهندسة موقع العنصر). وبالتّالي فاستعمال قطع المُستند يسمح بالحصول على أداء أفضل.

مثال

هذا المثال يُنشئ قائمةً بمتصفّحات الويب المعروفة.

في جزء HTML نضع:

<ul id="ul">
</ul>

في جزء JavaScript نضع:

var element  = document.getElementById('ul'); // بافتراض أنّ العنصر موجود
var fragment = document.createDocumentFragment();
var browsers = ['Firefox', 'Chrome', 'Opera', 
    'Safari', 'Internet Explorer'];

browsers.forEach(function(browser) {
    var li = document.createElement('li');
    li.textContent = browser;
    fragment.appendChild(li);
});

element.appendChild(fragment);

دعم المتصفحات

الميزة	Chrome	Internet Explorer	Firefox	Opera	Safari
الدعم الأساسي	نعم	نعم	نعم	نعم	نعم

مصادر ومواصفات

مواصفة DOM