Reference Guide

ManualsBrandsFacebook ManualsSoftwareFacebook 2008 FBML

141

142

143

144

145

146

147

148

149

150

facebook FBML Reference Guide Page 147 of 159

FBJS

Description

FBJS is Facebook's solution for developers who want to use JavaScript in their Facebook applications. We built

FBJS to empower developers with all the functionality they need, and to protect our users' privacy at the same

time.

How It Works

Most providers who allow developers to embed JavaScript within their domain force developers to use iframes

to sandbox their code. Facebook has taken a different approach to this problem. JavaScript that you give us gets

parsed, and any identifiers (function and variable names) get prepended with your application ID. For example,

the following code block:

function foo(bar) {

var obj = {property: bar};

return obj.property;

}

becomes:

function a12345_foo(a12345_bar) {

var a12345_obj = {property: a12345_bar};

return a12345_obj.property;

}

This creates a virtual scope for every application that runs within Facebook. From there we expose certain

functionality through a collection of JavaScript objects that allow you to modify your content on Facebook. Our

objects are made to mimic the functionality of JavaScript as closely as possible, but it may take some getting

used to for people who are already adept with JavaScript.

The Basics

The JavaScript syntax you've come to know and love (or hate) is exactly the same. You can create objects, use

anonymous functions, create timeouts and almost any other thing you can think of. Modifying the DOM tree is

slightly different, however.

Take this example FBML code, for instance:

<a href="#" onclick="hello_world(this); return false;">Hello World!</a>

<!--

function random_int(lo, hi) {

return Math.floor((Math.random() * (hi - lo)) + lo);

}

function hello_world(obj) {

var r = random_int(0, 255), b = random_int(0, 255), g = random_int(0, 255);

var color = r+', '+g+', '+b;

obj.setStyle('color', 'rgb('+color+')');

}