the big picture. how does javascript interact with the browser?
TRANSCRIPT
THE BIG PICTURE
How does JavaScript interact with the browser?
What sort of things can we do with JavaScript?
We can use JavaScript to process and check data entered in forms.
What sort of things can we do with JavaScript?
We can use JavaScript to store and read information in “cookies.”
Cookies are bits of data that are stored in the browser folder on the user’s local computer. They are used to track users (creepy) and are also usedto customize content (convenient).
What sort of things can we do with JavaScript?
We can use JavaScript to dynamically show and hide content.
What sort of things can we do with JavaScript?
We can use JavaScript to dynamically access any part of the document.
Loops in JavaScript.
In Scratch we used loops to repeat a series of instructions for a fixed period of time.
In JavaScript, we can do the same thing with a “for” loop.
Conditional statements in JavaScript.
In Scratch we use if and if-else statements to check if something was true.
In JavaScript, we can do the same thing with if and if-else statements.
Variables in JavaScript.
In Scratch we use variables as information containers. They can hold numbers or letters (strings).
In JavaScript we create variables by giving them a name.
EXERCISE
1. Download the source files from TLEARN2: madlib.html and madlib.css
2. Link your HTML file to an external JavaScript file by adding the <script> line in the <head>.
3. Create a new file called madlib.js, and add the following code. Test by loading the page.
Use your name instead of my name for the function. For example: zackFunction, ellenFunction.
4. Now, modify the page so the user will have to answer a question when the page loads.
Your output should look like this:
REFERENCE
5. NEXT: Ask the user for their name, and then greet them by name.
From now on, these reference code blocks will
show you the building blocks, will not give you the
exact answer about how your code should look.
Your output should look like this:
REFERENCE
6. NEXT: Berate the user if their name is too long.
Also, remember t
hat
you can find out
the
length of a stri
ng with:
variableName.len
gth
Your output should look like this:
REFERENCE
7. NEXT: Ask the user their name and then change the name of the author on the madlib page. (See following slide for hints.)
REFERENCE FOR PREVIOUS SLIDE