My codepen for this project: https://codepen.io/juan-coding/pen/NyKGPe?editors=0001
My code generally works, but I can tell there are some “ugly” code. One of the problems is that:
in order to display all the channels by default, I do the following:
If I place
$(".data").html(html_all);
in line 44, it works fine; but if place in line 30, not workable. (console.log(html_all)
output as “”).
I thought, after the for
loop, global variable html_all
's value will be updated to a list of data for the Twitch channels, but why (console.log(html_all)
output as “”, empty. ( run in line 30)?
But why button_click
function is workable, in which html_all
is involved?
Hopefully, someone could clarify these for me! Many thanks in advance.
You start html_all
like an empty string (var html_all =""
). You update this variable with getChannelData
because you call in this function DisplayData
. After this you call button_click
. In this moment html_all
isn’t empty, because you update it at start, when document is ready with:
$(document).ready(function() {
getChannelData();
});
1 Like
I appreciate your reply. You must have read through my code. I do understand what did you say, but my question is about why console.log(html_all)
(place in line 30 in codepen) output nothing. I mean, until this statement, html_all
is already updated with data. But why it’s empty?
I think the problem is that Javascript doesn’t wait the for-loop
's end. So it just go on console.log(html_all)
before that for-loop
is end.
Many thanks again to your reply. I think it makes sense.