title: Using JavaScript with JSF and Facelets
body: <p>I would like to use JavaScript to manipulate hidden input fields in a JSF/Facelets page. When the page loads, I need to set a hidden field to the color depth of the client.</p>
  
  <p>From my Facelet:</p>
  
  <pre><code>&lt;body onload="setColorDepth(document.getElementById(?????);"&gt;
  
  &lt;h:form&gt;
    &lt;h:inputHidden value="#{login.colorDepth}" id="colorDepth" /&gt;
  &lt;/h:form&gt;
  </code></pre>
  
  <p>When JSF processes the page, it is of course changing the IDs of the elements. What's the best way to reference these elements from my JavaScript code?</p>