JavaScript Examples Bible - UserWorks Technologies

Chapter 5 ✦ Body Text Objects (Chapter 19)
Lorem ipsum dolor sit, consectetaur adipisicing
elit,
sed do eiusmod tempor incididunt ut labore et dolore aliqua. Ut enim adminim
veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat.
createContextualFragment(“text”)
NN2 NN3 NN4 NN6 IE3/J1 IE3/J2 IE4 IE5 IE5.5
Compatibility ✓
Example
Use The Evaluator (Chapter 13 in the JavaScript Bible) to create a document fragment
and replace an existing document tree node with the fragment. Begin by creating
the range and fragment:
a = document.createRange()
a.selectNode(document.body)
b = a.createContextualFragment(“a bunch of
”)
This fragment consists of a SPAN element node with a text node nested inside. At
this point, you can inspect the properties of the document fragment by entering b
into the bottom text box.
To replace the myEM element on the page with this new fragment, use the
replaceChild() method on the enclosing myP element:
document.getElementById(“myP”).replaceChild(b, document.getElementById(“myEM”))
The fragment now becomes a legitimate child node of the myP element and can be
referenced like any node in the document tree. For example, if you enter the following
statement into the top text box of The Evaluator, you can retrieve a copy of the
text node inside the new SPAN element:
document.getElementById(“myP”).childNodes[1].firstChild.nodeValue
283
Range.createContextualFragment()