दस्तावेज़ खंड बनाने के लिए HTML DOM createDocumentFragment() विधि का उपयोग किया जाता है। दस्तावेज़ का टुकड़ा DOM संरचना को प्रभावित नहीं करता है क्योंकि यह मेमोरी में रहता है। जब हम दस्तावेज़ के टुकड़े को DOM में जोड़ते हैं, तो इसे मूल रूप से इसके बच्चों द्वारा बदल दिया जाता है यानी दस्तावेज़ में कोई दस्तावेज़ खंड नहीं जोड़ा जाता है, केवल इसके बच्चे संलग्न होते हैं।
सिंटैक्स
createDocumentFragment() विधि के लिए सिंटैक्स निम्नलिखित है -
<पूर्व>दस्तावेज़.createDocumentFragment()यह एक DocumentFragment ऑब्जेक्ट देता है, जो DocumentFragment नोड का प्रतिनिधित्व करता है।
उदाहरण
आइए HTML DOM createDocumentFragment() विधि के लिए एक उदाहरण देखें -
createDocumentFragment() उदाहरण
createDocumentFragment विधि का उपयोग करके सूची आइटम बदलने के लिए नीचे दिए गए बटन पर क्लिक करें।
- आम
- आड़ू
- अमरूद
- स्ट्रॉबेरीपपीता
आउटपुट
यह निम्नलिखित आउटपुट देगा -
चेंज बटन पर क्लिक करने पर -
उपरोक्त उदाहरण में -
हमने पांच सूची मदों के साथ एक अनियंत्रित सूची बनाई है -
- आम
- आड़ू
- अमरूद
- स्ट्रॉबेरी
- पपीता
हमने तब चेंज बटन बनाया है जो उपयोगकर्ता द्वारा क्लिक किए जाने पर चेंजलिस्ट () विधि को निष्पादित करेगा -
चेंजलिस्ट () फ़ंक्शन दस्तावेज़ ऑब्जेक्ट की createDocumentFragment () विधि का उपयोग करके एक दस्तावेज़ खंड बनाता है और इसे चर x को असाइन करता है। AppnedChild () विधि का उपयोग करके हम सूची तत्व को दस्तावेज़ खंड का बच्चा बनाते हैं। हम पहली सूची तत्व मान सेट करते हैं जो दस्तावेज़ के टुकड़े के अंदर "तरबूज" के लिए है। फिर हम दस्तावेज़ के टुकड़े को
. के अंतिम बच्चे के रूप में जोड़ते हैंफ़ंक्शन चेंजलिस्ट() {var x=document.createDocumentFragment(); x.appendChild(document.getElementsByTagName("LI")[0]); x.childNodes[0].childNodes[0].nodeValue ="तरबूज"; document.getElementsByTagName("UL")[0].appendChild(x);}