mozilla

Compare Revisions

Web Console

Change Revisions

Revision 17131:

Revision 17131 by Sheppy on

Revision 17132:

Revision 17132 by Sheppy on

Title:
Web Console
Web Console
Slug:
Tools/Web_Console
Tools/Web_Console
Tags:
Tools, Debugging, "Web Development", "Web Development:Tools", "web console"
Tools, Debugging, "Web Development", "Web Development:Tools", "web console"
Content:

Revision 17131
Revision 17132
nn139    <p>
140      You can also use the up and down arrow keys to cycle throug
 >h the history of the commands you've entered.
141    </p>
n140      Simple expressionsn143      Basic usage
n146      <img alt="simpleexpr.png" class="internal default" src="/@an149      <img alt="simpleexpr.png" class="internal default" src="/@a
>pi/deki/files/4751/=simpleexpr.png">>pi/deki/files/4751/=simpleexpr.png" style="border: 1px solid blac
 >k;">
tt151    <p>
152      For convenience, the Web Console will try to autocomplete v
 >ariable and function names it knows about. If it guesses wrong, y
 >ou can either keep typing (and it will update its guess), or you 
 >can hit tab to get the next possible match.
153    </p>
154    <p>
155      <img alt="autocomplete.png" class="internal default" src="/
 >@api/deki/files/4752/=autocomplete.png" style="border: 1px solid 
 >black;">
156    </p>
157    <p>
158      You can directly access variables defined on the page:
159    </p>
160    <p>
161      <img alt="variables.png" class="internal default" src="/@ap
 >i/deki/files/4753/=variables.png" style="border: 1px solid black;
 >">
162    </p>
163    <p>
164      Here we see that <a class=" external" href="http://jquery.c
 >om" title="http://jquery.com/">jQuery</a> is in use by the page w
 >e're looking at. Note what happens if we type "jQuery." then hit 
 >tab:
165    </p>
166    <p>
167      <img alt="jquery-tab.png" class="internal default" src="/@a
 >pi/deki/files/4754/=jquery-tab.png" style="border: 1px solid blac
 >k;">
168    </p>
169    <p>
170      If we keep hitting tab, we get successive hints as to what 
 >we might be looking for.
171    </p>
172    <h3>
173      Manipulating the page
174    </h3>
175    <p>
176      You can actually make changes to the values of variables on
 > the page to test things out. Just add "window." to the beginning
 > of the variable name to make it visible to the page. For example
 >, if the code on the page defines a variable <code>counter</code>
 >, you can change it with:
177    </p>
178    <pre>
179window.counter = newvalue;
180</pre>

Back to History