We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS


This feature is not on a current W3C standards track, but it is supported on the Firefox OS platform. Although implementations may change in the future and it is not supported widely across browsers, it is suitable for use in code dedicated to Firefox OS apps.

The setAttributes method may be used to set the data-l10n-id and data-l10n-args attributes on DOM elements.

The L10n API makes use of mutation observers to detect changes to data-l10n-* attributes and translate the affected elements asynchronously.  The L10n.setAttributes method is a convenience method which allows to translate DOM elements declaratively. Under the hood, L10n's mutation observer uses the same semantics as the L10n.get method.


navigator.mozL10n.setAttributes(element, identifier[, data]);


The element to be translated.
The string identifier of the translation to be used for translation.
An object with variables to be interpolated into the translation. All members' values must be strings or numbers.


from-contact = Missed call from {{ contact }}
var banner = document.getElementById('banner');
navigator.mozL10n.setAttributes(banner, 'from-contact', {contact: primaryInfo.toString()});

L10n.setAttributes is a convenience method which uses the standard Element.setAttribute API.  Therefore, the above is equivalent to:

var banner = document.getElementById('banner');
banner.setAttribute('data-l10n-id', 'from-contact');
banner.setAttribtue('data-l10n-args', JSON.stringify({contact: primaryInfo.toString()}));


Not part of any specification.

See also

Document Tags and Contributors

Contributors to this page: stasm
Last updated by: stasm,