Using specific sections of JSON data to display in an alert message (Vanilla JavaScript)

Question

Using specific sections of JSON data to display in an alert message (Vanilla JavaScript)

I am seeking a bookmarklet that, upon clicking, will access JSON data and retrieve the "temp" information to display in an alert indicating the weather with just one click. Is there a method to achieve this or do I need to utilize a different API?

Here's what I have attempted so far:

function insertReply(data) {
    document.getElementById('output').innerHTML = data;
}

var script = document.createElement('script');
script.src = 'http://api.openweathermap.org/data/2.5/find?q=australia,wa&mode=json';
document.body.appendChild(script);

javascript json

Answer 1

Answer №1

Yes, it's important to note that the API available appears to support JSONP. This means that by including a callback parameter in your request, the response will be wrapped with <callback>(...) where <callback> is the value of the callback parameter. For example, you could use this URL:

http://api.openweathermap.org/data/2.5/find?q=australia,wa&mode=json&callback=insertReply

Your insertReply function would then receive the appropriate object. To extract the temp value from it, simply access the content object like this:

document.getElementById('output').innerHTML = content.list[0].main.temp;

Answer 2

Yes, it's important to note that the API available appears to support JSONP. This means that by including a callback parameter in your request, the response will be wrapped with <callback>(...) where <callback> is the value of the callback parameter. For example, you could use this URL:

http://api.openweathermap.org/data/2.5/find?q=australia,wa&mode=json&callback=insertReply

Your insertReply function would then receive the appropriate object. To extract the temp value from it, simply access the content object like this:

document.getElementById('output').innerHTML = content.list[0].main.temp;

Using specific sections of JSON data to display in an alert message (Vanilla JavaScript)

Answer №1

Similar questions

Discovering the solution to populating and building a tree structure using jsTree in conjunction with SQL Server, addressing the challenges associated with the

What could be the reason for the page scrolling upwards when clicking on href="#"?

Populate HTML form with return values using jQuery AJAX

What is the best method for looping through a JavaScript object in cases where the value itself is an object?

Utilizing Angular 4 alongside ng-sidebar to incorporate the class "right"

Javascript problem: Trouble with event.clientX position

Creating a resizable SVG rectangle element with React

Combine, condense, and distribute JavaScript files using Express without applying gzip compression to the response

Prompt for confirmation in ASP.NET code-behind with conditions

How can I display lowercase am/pm instead of uppercase AM/PM with angularjs date filtering?

Removing a faded out div with Vanilla JavaScript

NextJS: encountered an error with fallback enabled

The offset value was inconsistent in the desktop version of Firefox

eliminate empty lines from csv files during the uploading process in Angular

I am having difficulty in receiving accurate speech recognition through the microphone while using the Azure Speech to Text service in a

Conceal a different CSS class if a certain CSS class is present on the page

The database is not being updated with the new values

What is the best practice for adding a DOM element at a precise location within an ng-repeat loop?

What was Douglas Crockford trying to convey with the term 'created in an alternate window or frame'?

Retrieving blog posts formatted in markdown from a centralized JSON file