BviLLe_Kid BviLLe_Kid - 5 months ago 19
jQuery Question

Add JS to HTML page

I need help in trying get what I have in my

<scripts>
onto my HTML page.

I am using the Yahoo Weather API and here is the information I have:

<script>
var callbackFunction = function (data) {
var location = data.query.results.channel.location;
var condition = data.query.results.channel.item.condition;
var wind = data.query.results.channel.wind;
//I could just alert all of these to get pop ups but I am not looking for that
}
</script>
<script src="https://query.yahooapis.com/v1/public/yql?q=SELECT%20*%20FROM%20weather.forecast%20WHERE%20woeid%3D%22%22&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=callbackFunction"></script>


Now how do I get the 3 variables
location
,
condition
,
wind
into a
<div>
so that they can be displayed as HTML?

Answer

Here's a simple example:

var callbackFunction = function (data) {
  var location = 'Hello'; //data.query.results.channel.location;
  var condition = 'World'; //data.query.results.channel.item.condition;
  var wind = '!'; //data.query.results.channel.wind;
  //I could just alert all of these to get pop ups but I am not looking for that

  // INTERACTING WITH THE D.O.M.
  document.getElementById('results').innerHTML = location + '</br>' + condition + '</br>' + wind;
}

callbackFunction()
<div id="results"></div>

Basically what we are doing here, is grabbing the page document, finding an element by its id .getElementById('results'), and setting its contained html with the .innerHTML property, and using </br> to put each result on a new line.