从浏览器隐藏API密钥

I have an API Key that I use to retrieve information which is displayed on the browser. The problem I have is that using Chrome - Inspect Element - Source, the API key can be viewed. The code look like the following:

<meta charset="utf-8">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <link href="/styles.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript">
        //<![CDATA[
         var dbtKey = "<?php echo $apiKey; ?>"; 

The $apiKey is a var which sits in my config.php file: $apiKey = 'my key'

Is there any way I can prevent this from being displayed?

You would need to handle all the request via PHP and return the result as JSON which you can process client side.

For extra security, use SSL which will help against external threats but not internal.