title: Keep PHP and HTML separated
body: <p>My website prints the user location by calling an API. Say I have the following code all in one file <code>index.php</code> on my website:</p>
  
  <pre><code>&lt;?php
      $sIP = $_SERVER['REMOTE_ADDR'];
      $sURL = "http://ipinfo.io/" .$sIP . "/json";
      $sJSON = file_get_contents($sURL);
      $view = (object) array();
      $view-&gt;JSON = $sJSON;
  ?&gt;
  
  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;script src="//code.jquery.com/jquery-1.11.3.min.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
      &lt;script&gt;
          // global string of Data
          var gsData = &lt;?= $view-&gt;JSON ?&gt;
  
          $(document).ready(function(){
              var sRegion = gsData.region;
              $('#result').html(sRegion);
          });
      &lt;/script&gt;
      &lt;div&gt;Region from data is:&lt;/div&gt;
      &lt;div id="result"&gt;&lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>Though, I need to keep the PHP script and the markup separated. I can't embed the PHP script in a <code>script</code> element. What can I do to have a PHP and a HTML file?</p>