180 likes | 294 Vues
JavaScript is a powerful language that interacts directly with web browsers, allowing developers to enhance user experiences. It enables form data validation, cookie management for user tracking and content customization, and dynamic content manipulation. With loops and conditional statements, JavaScript can repeat actions and make decisions, similar to Scratch programming. This guide provides practical exercises to create interactive web pages using JavaScript, fostering a deep understanding of its capabilities in web development.
E N D
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 used to 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.
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. Your output should look like this: REFERENCE 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.
6. NEXT: Berate the user if their name is too long. Your output should look like this: REFERENCE Also, remember that you can find out the length of a string with: variableName.length
7. NEXT: Ask the user their name and then change the name of the author on the madlib page. (See following slide for hints.)