/    Sign up×
Community /Pin to ProfileBookmark

how to track Variable without using old-school alert(‘variable’); ..?

Copy linkTweet thisAlerts:
Dec 19.2012

i’m returning, or trying to get back into JS programming.

what’s a better way to track a variable, better than using alert(‘variable’)?

thanks,

trying to catch up here.

to post a comment
JavaScript

6 Comments(s) ↴

Copy linkTweet thisAlerts:
@LesshardtoofindDec 19.2012 — I depends on the situation and the web browser it appears. If the browser being used allows Javascript to run in the main GUI thread then the window won't update until the javascript is finished processing meaning the variable won't be displayed until the end.

https://bugzilla.mozilla.org/show_bug.cgi?id=62778

if you use an interval

http://nokarma.org/2011/02/02/javascript-game-development-the-game-loop/index.html

then you could update the inner html of a "debugging" div.

Hope that makes sense.
Copy linkTweet thisAlerts:
@LesshardtoofindDec 19.2012 — Here is a small example::

<i>
</i>&lt;!DOCTYPE html&gt;
&lt;html lang = "en-US"&gt;
&lt;head&gt;
&lt;/head&gt;
&lt;body onload = "DoIt()"&gt;
&lt;div id = "debugger" style = "left: 5%; top: 5%; height: 100px; width: 100px; position: absolute; background: #EEEEFF;"&gt;
&lt;/div&gt;
&lt;script&gt;
var x = 0;
var IntervalId;
function countup()
{
x++;
var Debug = document.getElementById("debugger");
Debug.innerHTML = x;
}
function DoIt()
{
IntervalID = setInterval(countup, 1);
}
&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;
Copy linkTweet thisAlerts:
@rtretheweyDec 19.2012 — If an alert() won't help me, I generally use a variation on the method shown above by Lesshardtoofind, you can also use Firebug in Firefox, the JavaScript Console in Chrome, or Internet Explorer's built-in debugging tools to monitor variables and set breakpoints.
Copy linkTweet thisAlerts:
@LesshardtoofindDec 19.2012 — I use the Firefox tools as well. Highly informative!
Copy linkTweet thisAlerts:
@toptomatoauthorDec 21.2012 — huge thanks everyone!
Copy linkTweet thisAlerts:
@johhny-sDec 21.2012 — Don't forget about console.log(). It will give you a detailed breakdown of the contents of any variable; its particularly useful for objects (ie arrays)
×

Success!

Help @toptomato spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...