If you’re creating a form using Drupal and find you want to add some javascript or CSS then you can use the “#attached” attribute to do so. Using “#attached” you can include local javascript/CSS files, external javascript/CSS files, or inline styles and scripts. You can also use drupal_add_js() to include a script but this is not recommended. First, drupal_add_js() is deprecated in Drupal 8 so you are only putting roadblocks in your way for a future upgrade. Second and more importantly, drupal_add_js() adds the script to the form page, but it does not allow any modules to interact with the JS using hook_form_alter().
  

Local Files

To include a local javascript or CSS file, include your files in an array with a key of “js” or “css” to the “#attached” array. It’s good practice to use drupal_get_path() to get the parent directory file path.

$form['#attached']['js'] = array(
  drupal_get_path('module', 'my_module') . '/scripts.js',
);

$form['#attached']['css'] = array(
  drupal_get_path('module', 'my_module') . '/styles.css',
);

External Files

It’s possible to include external files as well, here’s how.

$form['#attached']['js'] = array(
  'http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js' => array(
    'type' => 'external',
  ),
);

$form['#attached']['css'] = array(
  'http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css' => array(
    'type' => 'external',
  ),
);

Inline

You can include inline scripts and styles as well. If you have a small snippet there’s not really a need to create a file.

$form['#attached']['js'] = array(
  array(
    'data' => 'jQuery(function() { jQuery("#my-element").show(); });',
    'type' => 'inline',
    ),
);

$form['#attached']['css'] = array(
  array(
    'data' => '#my-element { display:none; }',
    'type' => 'inline',
  ),
);

Drupal Libraries

Drupal includes a number of libraries, here’s how to use them.

$form['#attached']['library'][] = array('system', 'jquery.cookie');