Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>Document Fragments</title> </head> <body> <div id="list"></div> <button id="populate">Populate List</button> <script> document.getElementById('populate').addEventListener('click', (event) => { const fragment = document.createDocumentFragment(); for (let i = 1; i <= 25; i++) { const item = document.createElement('div'); item.textContent = `Item ${i}`; fragment.appendChild(item); } document.getElementById('list').appendChild(fragment); event.target.disabled = true; // Disable the button }); </script> </body> </html>