Documentation for a historical release of Infusion: 1.3
Please view the Infusion Documentation site for the latest documentation.
If you're looking for Fluid Project coordination, design, communication, etc, try the Fluid Project Wiki.

Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 4 Next »

This information is in draft form. Some parts are incomplete, or only present in point form. If you have comments or suggestions for improving this documentation, please contact


The Fluid framework's DOM Binder makes it easy for users to change the look of a component by providing an interface that allows the component developer to access DOM elements though selectors, without knowing anything about the particular mark-up in question.

Components access elements in the DOM through unique selector names. The component defines default values for the selectors, but implementors are free to override the defaults if they choose.

On This Page
See Also
Still need help?

Join the fluid-talk mailing list and ask your questions there.


Component developers must declare the component's selectors in the defaults for the component:

fluid.defaults("fluid.newComponent", {
    selectors: {
        uiBit1: ".className1",
        uiBit2: ".className2"

The DOM Binder is automatically created and attached to the component when the view is initialized with fluid.initView(). The DOM Binder's location() function is bound to that.locate() (see below for more information).

Using the DOM Binder

The component must use the DOM Binder for any access to the DOM elements that make up the component, using the locate() function:

that.locate(name, localContainer);




The selector name, as declared in the component's defaults


Optional. The container element used to constrain the search for the element. Defaults to the component container.


  • No labels