slayeroffice - web experiments gone horribly awry

04.27.2004 - Remove Children Favelet

Malx says on the Mouseover DOM Inspector comments:

I am using M-DOM-I to delete all menus, banners, headers from page before printing. Saves lot's of paper ;) But it is not fun to Alt-Tab to M-DOM-I for every block I am deleting :(

He's using Mozilla's built in DOM Inspector to remove unwanted elements, but its a cumbersome process. He asked that element removal be added to the MODI's functionality, but I thought a new favelet would be better suited. Enter the Remove Children favelet.

What this new favelet does is loop over document.getElementsByTagName("*") and hijacks each elements onclick, onmouseover and onmouseout events. It functions in similar fashion to the MODI with respect to background color highlights, but only adds a title attribute to the element noting what the element is and informing you to click on it to remove it from the DOM. It will also set the href of any <a> tags it comes across to "#" to allow them to be clicked on and removed.

Tested and works in MSIE6, MacIE5.2, Mozilla 1.6 and Firefox 0.8. My version of Safari doesn't support the wildcard argument for getElementsByTagName, but hopefully it works in later versions. Opera 7 doesn't seem to understand what this.parentNode.removeChild(this) means, as doing so in 7.2 on XP and 7.5 on Mac causes it to remove the entire node, parent and all. The mouseover stuff does work, however, so XP Opera users could benefit from this as a light weight MODI...provided they don't click on anything.

Once again, the link for the favelet:Remove Children

This had been added to the Favelet Suite as well.

There's a little bug: On, if you click on the link 'Anfahrtsplan' on the left with the favelet enabled, the page opens again in a new window (tested on WinXP, Firebird an IE 6).

& lots of thanks for your work

Posted by Chris on April 28, 2004 @ 8:31 pm

This has been fixed - I neglected to take target attributes into account for A tags. It now sets them to _self.

Thanks Chris!
Posted by Steve on April 28, 2004 @ 8:52 pm

Safari now supports wildcard; <code>getElementsByTagName("*")</code> works.

Live test case ->
Posted by DHTML Kitchen on August 26, 2004 @ 12:48 am

Comments have been closed for this post.