title: Cordova initial code created by the Cordova command line interface
body: <p>When using the "create" command provided by the cordova command line interface, the android project is created with the following code in the index.html file :</p>
  
  <pre><code>    &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8" /&gt;
      &lt;meta name="format-detection" content="telephone=no" /&gt;
      &lt;meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /&gt;
      &lt;link rel="stylesheet" type="text/css" href="css/index.css" /&gt;
      &lt;title&gt;Hello World&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div class="app"&gt;
          &lt;h1&gt;Apache Cordova&lt;/h1&gt;
          &lt;div id="deviceready" class="blink"&gt;
              &lt;p class="event listening"&gt;Connecting to Device&lt;/p&gt;
              &lt;p class="event received"&gt;Device is Ready&lt;/p&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;script type="text/javascript" src="cordova.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/index.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
          app.initialize();
      &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>The index.js code has the following code:</p>
  
  <pre><code>    var app = {
  // Application Constructor
  initialize: function() {
      this.bindEvents();
  },
  // Bind Event Listeners
  //
  // Bind any events that are required on startup. Common events are:
  // 'load', 'deviceready', 'offline', and 'online'.
  bindEvents: function() {
      document.addEventListener('deviceready', this.onDeviceReady, false);
  },
  // deviceready Event Handler
  //
  // The scope of 'this' is the event. In order to call the 'receivedEvent'
  // function, we must explicity call 'app.receivedEvent(...);'
  onDeviceReady: function() {
      app.receivedEvent('deviceready');
  },
  // Update DOM on a Received Event
  receivedEvent: function(id) {
      var parentElement = document.getElementById(id);
      var listeningElement = parentElement.querySelector('.listening');
      var receivedElement = parentElement.querySelector('.received');
  
      listeningElement.setAttribute('style', 'display:none;');
      receivedElement.setAttribute('style', 'display:block;');
  
      console.log('Received Event: ' + id);
  }
  </code></pre>
  
  <p>};</p>
  
  <p>All the cordova examples I have found on line include no code like this. I also haven't been able to find any explanations of this code in the documentation or stack overflow. It seems a complicated way to make sure no events are triggered before the DOM and cordova.js load. I would much appreciate it if anyone could point me to any explanations of this code.</p>