Before injecting any elements to our HTML DOM we should run HTML validation on our page. Valid HTML is crucial to having consistent, cross-browser results.
There is a great, artistic beauty to a syntax so simple as the constructor for the Element class. The first, mandatory parameter is the tag name. In this example we pass div
in order to create a DIV tag in memory, not on the page...yet. The second parameter to the constructor is an object of properties to assign to the in-memory element.
<form action="javascript:" method="get"> <span id="my_error"></span> <input id="submit" type="button" value="Submit Form"/> </form> <script type="text/javascript"> $('submit').addEvent('click', function() { // the element constructor has a simple syntax my_error = new Element('div', { 'id': 'my_error', 'text': 'Error!', 'style': 'border: 1px solid #F00; width:200px;' }); // use element.replaces() to switch the span...