Drupal 7 Module Development

Chapter 10
If a renderable array is used instead with attached JavaScript, the renderable array
is cached which contains the calls to the JavaScript. When the cached content is
rendered and JavaScript, CSS, then the libraries included in the renderable array
will be added to the page.
An example that adds JavaScript and CSS to the output of a block would look like
the following:
$output['content'] = array(
'#value' => 'The content of the block.',
'#attached' => array(
'css' => array(
drupal_get_path('module', 'hello_world') . '/example.css',
),
'js' => array(
"alert('Hello World!')" => array('type' => 'inline'),
),
),
);
Altering JavaScript
JavaScript added to a page has a last chance to be altered before being rendered to
the output page. Just before the JavaScript is rendered in HTML it is passed through
hook_js_alter(). A module that implements hook_js_alter() has a last chance
to act on or change the JavaScript.
An example of this would be if a module wants to swap out the compressed version
of jQuery with an uncompressed version. This would be helpful for debugging
purposes. In the example, we will call the module jQuery Uncompressed. In the
jquery_uncompressed.module file hook_js_alter() would look like the following:
/**
* Implements hook_js_alter().
*/
function jquery_uncompressed_js_alter(&$javascript) {
$path = drupal_get_path('module', 'jquery_uncompressed')
$javascript['misc/jquery.js']['data'] = $path . '/jquery.
uncompressed.js';
}
The $javascript array passed in contains all the JavaScript to be added to the
current page. This hook is called just before JavaScript is rendered to be added to the
page. This is the last point to alter it.
[ 299 ]