Reference Guide

facebook FBML Reference Guide Page 155 of 159

Tips

Don't create JavaScript which depends on a sensitive DOM structure. Code like

this.getElementByTagName('div')[1].getFirstChild().getLastChild().setStyle('color', 'white') is very

fragile and may randomly break if we change the way certain elements are rendered.

Most FBJS DOM methods are chainable. For instance, instead of:

var obj = document.createElement('div');

obj.addEventListener('click', click);

obj.addEventListener('mousemove', mousemove);

obj.setStyle('color', 'black');

You can do:

document.createElement('div').addEventListener('click', on_click).addEventListener('mousemove',

mousemove).setStyle('color', 'black');

You aren't allowed to extend base objects like Function or Array, however we do provide a typical

"bind" implementation on the Function prototype.

FBJS objects don't contain handles to any of their actual DOM objects, however if you use Firebug, the

console can show you exactly to what an object is referring. Try console.dir on an FBJS DOM object. In

your console you'll see a PRIV_obj attribute which is the actual DOM node represented by your FBJS

DOM handle. This can help you figure out what FBJS is doing behind the curtains. This trick also works

with all other FBJS objects such as AJAX and FBML blocks.

If you want to use timed fading/unfading of elements, creating 'panes' with drop-shadows or generic

dragging, check out the small FBJS effects library Backface, at

http://supercodex.com/backface/backface.zip, with a demo at http://apps.facebook.com/backface.

Use Firebug to troubleshoot and diagnose anything that isn't working with your FBJS.

Consider using the Include files support to save processing/load times and bandwidth