10.18 Document Fragments
Example 1. Inserting Multiple Elements. Without using DocumentFragment
Example 2. Inserting Multiple Elements. Using DocumentFragment
Example 3. Cloning and Modifying Complex Structures. Without using DocumentFragment
Example 4. Cloning and Modifying Complex Structures. Using DocumentFragment
Example 5. Updating Dynamic Components Without using DocumentFragment
Example 6. Updating Dynamic Components Using DocumentFragment
10.19 Node Cloning.
10.19.1 cloneNode()
Example 1. Clone a paragraph with all its children and add a copy to the document body.
I am the original paragraph..
I am the first paragraph
I am the second paragraph
Example 2. Clone a Form
Cloned Form
10.19.2 NodeList vs. HTMLCollection: Navigating the DOM
Element |p| class="item_192 – NodeList
10.19.2.2 Creating an HTMLCollection*
Example 1. Creating an HTMLCollection
10.20 Performance and Optimization
10.20.1 Reflow and Repaint
Example 1. Change the Color of Many Elements. First, an inefficient code
Example 2. Change the Color of Many Elements. Optimized code
10.20.2 – 10.20.3 These practical exercises are not performed online. See the Book
10.20.4 Minimize DOM Access
Example 1. Save references
Example 2. Perform block changes
Example 3. Example with jQuery
10.20.5 Use requestAnimationFrame
Example 1. Animate an element that moves from left to right when the page reloads.
Animating id="213" class=p_207
10.20.6 Batching updates.