After getting my AJAX to work with help from another question I asked, I'd like to create another file that contains my functions to keep my code clean. I haven't found anything useful online, so I am thinking it might not be possible. Here is the code I'd like to extract:
<script> <!-- overall co2 -->
var co2;
var url="/solarpv/api/co2/list"
var jsonObject;
$(document).ready(function(){
$.getJSON(url,function(result){
jsonObject = result;
co2 = result[0].Cumulative_CO2;
$('#ajaxRequest').html("Our solar panels have saved " + co2 + " pounds of CO2 since they were installed.");
});
});
<!-- today co2 -->
var co2today;
var url2="/solarpv/api/co2/today"
$(document).ready(function(){
$.getJSON(url2,function(result){
co2today = result[0].CO2;
$('#today').html("Our Solar Panels have saved " + co2today + " pounds of c02 so far today.");
});
});
<!-- yesterday's CO2 -->
var url3 = "/solarpv/api/co2/list?start=2013-04-28%2001:00:00&end=2013-04-29%2001:00:00";
var yesterdayCO2;
$(document).ready(function(){
$.getJSON(url3,function(result){
yesterdayCO2 = result[0].Cumulative_CO2;
$('#yesterday').html("Yesterday alone, our solar panels saved the same amount of CO2 it would take " + yesterdayCO2/1.98 + " people to create!");
});
});
<!-- last years's CO2 -->
var url4 = "/solarpv/api/co2/list?start=2012-04-28%2001:00:00&end=2013-04-29%2001:00:00";
var trees;
$(document).ready(function(){
$.getJSON(url4,function(result){
trees = result[0].Cumulative_CO2;
$('#yesterday').html("Last year our solar panels saved the equivalent of " + trees/48.061 + " trees worth of C02");
});
});
</script>
An example of the html that would be left in the file that uses this looks like:
<li id="yesterday">
<script>
document.write("Yesterday alone, our solar panels saved the same amount of CO2 it would take " + yesterdayCO2 + " people to create!");
</script>
</li>
Use this tag to load the javascript. Put it at the bottom of your HTML just before </html>
<script type="text/javascript" src="myJs.js"></script>
Then you have to put the javascript (without the <script>
tags) in the file named myJs.js and make it loadable from the browser.