I am stuck on translating information into a more client-friendly interface. Below is the JSON response I have received from my script. However, I would like to turn this into a standard news feed you would see on a website. What is the best way to go about this?
I am looking to have the image displayed next to the headline, summary, and URL link.
[
{
"datetime": 1545215400000,
"headline": "Voice Search Technology Creates A New Paradigm For Marketers",
"source": "Benzinga",
"url": "https://cloud.iexapis.com/stable/news/article/8348646549980454",
"summary": "<p>Voice search is likely to grow by leap and bounds, with technological advancements leading to better adoption and fueling the growth cycle, according to Lindsay Boyajian, <a href=\"http://loupventures.com/how-the-future-of-voice-search-affects-marketers-today/\">a guest contributor at Loup Ventu...",
"related": "AAPL,AMZN,GOOG,GOOGL,MSFT",
"image": "https://cloud.iexapis.com/stable/news/image/7594023985414148",
"lang": "en",
"hasPaywall": true
}
]
Below is my js to initiate the pull.
function news() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var newsfeed = JSON.parse(this.responseText);
document.getElementById("news").innerHTML =
this.responseText;
}
};
xhttp.open("GET", "https://cloud.iexapis.com/stable/stock/spy/news/last/1?token=pk_6925213461cb489b8c04a632e18c25dd", false);
xhttp.send();
};
I use this in my HTML to display the raw JSON before manipulation into what I want.
<div id=news class="text-white-50">
<script>
document.onreadystatechange = function() {
if (document.readyState === 'complete')
{
news();
}
};
</script>
</div>
Aucun commentaire:
Enregistrer un commentaire