Using Prototype’s Element.insert
June 1st, 2009
Strangely, Prototype’s documentation for Element.insert does not have any examples, so I cooked something up quick:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Template</title> <script type="text/javascript" src="prototype.js"></script> <script type="text/javascript"> Event.observe(window, 'load', function() { // Using Element.insert to insert after, before, top, or bottom Element.insert($('para1'), { before: "<p>This is paragraph zero.</p>" }); Element.insert($('para1'), { after: "<p>This is paragraph two.</p>" }); // notice we have to insert using the content container Element.insert($('content'), { top: "<p>This is the first paragraph.</p>" }); Element.insert($('content'), { bottom: "<p>This is the last paragraph</p>" }); }); </script> </head> <body> <div id="content"> <p id="para1">This is paragraph one.</p> <p id="para3">This is paragraph three.</p> </div> </body> </html>
Leave a Reply