Intro to JavaScript Changing the Web Dynamically
description
Transcript of Intro to JavaScript Changing the Web Dynamically
![Page 1: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/1.jpg)
Intro to JavaScriptChanging the Web Dynamically
Fluency with Information Technology
INFO100 and CSE100
Katherine Deibel
2012-04-27 Katherine Deibel, Fluency in Information Technology 1
![Page 2: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/2.jpg)
Katherine Deibel, Fluency in Information Technology 2
The Plan Next few lectures: JavaScript (JS) We will not be learning all of JS
Introduction to the language Examples and projects to explore JS Establish foundation for learning more on
your own
2012-04-27
![Page 3: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/3.jpg)
Project 1B Extension Project 1B is now due on Wednesday, May 2
Turn-in on Monday for 5 extra credit points Turn-in on Tuesday for 2 extra credit points
Why? The TAs are nice people Kate is… um… Some people nicely asked I won't be on e-mail much this weekend
2012-04-27 Katherine Deibel, Fluency in Information Technology 3
![Page 4: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/4.jpg)
What is JavaScript? JavaScript is
used to make HTML Web pages dynamic used by professional Web designers and
programmers for things like gmail written using Notepad++ or TextWrangler tested by running the code in your browser
2012-04-27 Katherine Deibel, Fluency in Information Technology 4
![Page 5: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/5.jpg)
Katherine Deibel, Fluency in Information Technology 5
JavaScript is not Java JavaScript is named after the object-
oriented programming language Java The George Washington Carver to President
George Washington JS was originally called LiveScript
Designed for Netscape Navigator Browser JS released at the same time that Navigator
added Java functionality Name change was a joint marketing effort by
Netscape and Sun Microsystems2012-04-27
![Page 6: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/6.jpg)
Static versus Dynamic A page written in HTML will never
change its content (static) Sometimes, you need a page to
update to your needs (dynamic) Example: Lab Grading
Each TA needs to access your HTML file
2012-04-27 Katherine Deibel, Fluency in Information Technology 6
![Page 7: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/7.jpg)
Solution 1: Repeated Links Create a web page with links to student pages
Problems: Need to update page for each project Separate pages per TA Student switch sections, drop, add, etc. Will have to be recreated for the next term.
2012-04-27 Katherine Deibel, Fluency in Information Technology 7
<a href="http://…/netID1/fit100/Project1A/project_plan.html">netID1</a><a href="http://…/netID2/fit100/Project1A/project_plan.html">netID2</a><a href="http://…/netID3/fit100/Project1A/project_plan.html">netID3</a><a href="http://…/netID4/fit100/Project1A/project_plan.html">netID4</a><a href="http://…/netID5/fit100/Project1A/project_plan.html">netID5</a>…
![Page 8: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/8.jpg)
Solution 2: Generate links on demand Demo:
proj1A-grader-helper.html
2012-04-27 Katherine Deibel, Fluency in Information Technology 8
![Page 9: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/9.jpg)
Other Uses of JavaScript Image slideshows Image magnification Calculations Form verification Page style manipulation Calculation tools (e.g., bin to hex) Etc.
2012-04-27 Katherine Deibel, Fluency in Information Technology 9
![Page 10: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/10.jpg)
Adding JavaScriptThe Secret Ingredient is XHTML
2012-04-27 Katherine Deibel, Fluency in Information Technology 10
![Page 11: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/11.jpg)
Begin with HTML HTML is static … the contents of the
file are displayed as given<html xmlns="http;//www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>First JavaScript</title> <style type="text/css"> body {background-color: black; color: gold; font-family; corbel;} </style> </head> <body> <h1>Showing Simple JS</h1> <!-- No JavaScipt yet, just HTML --> </body></html>
2012-04-27 Katherine Deibel, Fluency in Information Technology 11
![Page 12: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/12.jpg)
JavaScript Needs HTML JavaScript must be surrounded by
<script> tags in the HTML<html xmlns="http;//www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>First JavaScript</title> <style type="text/css"> body {background-color: black; color: gold; font-family; corbel;} </style> </head> <body> <h1>Showing Simple JS</h1> <script type="text/javascript"> alert("Let's show off the alert() operation"); </script></body></html>
Note the type attribute
2012-04-27 Katherine Deibel, Fluency in Information Technology 12
![Page 13: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/13.jpg)
The Script Tag <script></script> can appear
anywhere in HTML In the <head></head> In the <body></body> Within tags within <body></body>
2012-04-27 Katherine Deibel, Fluency in Information Technology 13
![Page 14: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/14.jpg)
Browsers Process Script Tags
When the browser comes to a script tag, it processes it immediately<html xmlns="http;//www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>First JavaScript</title> <style type="text/css"> body {background-color: black; color: gold; font-family; corbel;} </style> </head> <body> <h1>Showing Simple JS</h1> <script type="text/javascript"> alert("Let's show off the alert() operation"); </script></body></html>
2012-04-27 Katherine Deibel, Fluency in Information Technology 14
![Page 15: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/15.jpg)
Just do it!
Demo 1: One alert Demo 2: Multiple alerts
2012-04-27 Katherine Deibel, Fluency in Information Technology 15
![Page 16: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/16.jpg)
Naming and VariablesWe're not in mathematical Kansas anymore
2012-04-27 Katherine Deibel, Fluency in Information Technology 16
![Page 17: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/17.jpg)
Names In Computing In normal language, names, and the
things they name—their values—usually cannot be separated In programming most names change
values … a consequence of finite specification
Titles (US_Open_Champ), Offices (Mayor), Roles (Juliet), etc. are familiar examples of names that change values
2012-04-27 Katherine Deibel, Fluency in Information Technology 17
![Page 18: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/18.jpg)
Variables Variables are named
areas in memory Recall:
Computer instructions work with the memory addresses, not the values at those addresses
2012-04-27 Katherine Deibel, Fluency in Information Technology 18
![Page 19: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/19.jpg)
Variables In a restaurant, each table is
numbered. All night long the people and the food served at the table change, but the table still has the same number. That table number functions like a variable name.
6:40pm
7:30pm8:20pm9:00pm
6pm
2012-04-27 Katherine Deibel, Fluency in Information Technology 19
![Page 20: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/20.jpg)
Variables Names in programming are identifiers The things they name are their values The package—identifier & value—is a
variable, implying a possible change Identifiers have a specific structure:
Can only use letters, digits, and _ (underscore) Must start with a letter Are case sensitive
2012-04-27 Katherine Deibel, Fluency in Information Technology 20
![Page 21: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/21.jpg)
Examples of IdentifiersCorrect identifiers X x numOfStudents numberOfStudents g_constant str COST form13 Train_36_speed
Incorrect Identifiers 12x hours/min Important!Value last-name 7 name(nick)
2012-04-27 Katherine Deibel, Fluency in Information Technology 21
![Page 22: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/22.jpg)
Declarations To declare variables is to state what
variables will be used Use the word: var Follow with a list of variables separated by , Terminate all statements with a semicolon ; Give variables an initial value with =
Examples var x, input1, input2, rate; var interestRate = 4, pi = 3.14159;
2012-04-27 Katherine Deibel, Fluency in Information Technology 22
![Page 23: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/23.jpg)
Values Computer languages allow several
types of values: numeric, strings of letters, Boolean numbers: 1 0 -433 6.022e+23 .01 not numbers: 1,000 106 5% 7±2 strings: "abc" 'efg' " " "B&B's" "" not strings: <tab> ' " \ Boolean: true false not Boolean: T F yes no
2012-04-27 Katherine Deibel, Fluency in Information Technology 23
![Page 24: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/24.jpg)
Assignment The universal form of assignment:
<variable> <assignment symbol> <expression>
For example: day = hours/24; value of the variable on the left is changed
to have the new value of expression on right read “=” as “is assigned” “becomes” “gets” right-to-left value flow
2012-04-27 Katherine Deibel, Fluency in Information Technology 24
![Page 25: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/25.jpg)
= will annoy you In mathematics, variables and =
have specific meaning In programming, those meanings are
different! Keep this in mind
In math: x = x + 1 makes no sense In programming: x = x + 1 just increases
the value of x by 1
2012-04-27 Katherine Deibel, Fluency in Information Technology 25
![Page 26: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/26.jpg)
ExpressionsThe code type, not the facial type
2012-04-27 Katherine Deibel, Fluency in Information Technology 26
![Page 27: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/27.jpg)
Expressions Expressions are like “formulas” saying how
to manipulate existing values to compute new values, e.g. hours/24 Operators: + - * / % produce numbers Operators: < <= == != >= > on numbers (or
strings for == and !=) produce Booleans Operators: && || ! on Booleans produce Booleans
Grouping by parentheses is OK and smart seconds = ((days*24 + hours)*60 + min)*60
2012-04-27 Katherine Deibel, Fluency in Information Technology 27
![Page 28: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/28.jpg)
Example: Assigning VariablesLine Assignment Statement myName yourName
1 var yourName = "Sarah"; Sarah
2 var myName = "Andrea";
3 yourName = myName;
4 myName = "Kate";
5 yourName = "myName";
2012-04-27 Katherine Deibel, Fluency in Information Technology 28
![Page 29: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/29.jpg)
Example: Assigning VariablesLine Assignment Statement myName yourName
1 var yourName = "Sarah"; Sarah
2 var myName = "Andrea"; Andrea Sarah
3 yourName = myName;
4 myName = "Kate";
5 yourName = "myName";
2012-04-27 Katherine Deibel, Fluency in Information Technology 29
![Page 30: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/30.jpg)
Example: Assigning VariablesLine Assignment Statement myName yourName
1 var yourName = "Sarah"; Sarah
2 var myName = "Andrea"; Andrea Sarah
3 yourName = myName; Andrea Andrea
4 myName = "Kate";
5 yourName = "myName";
We can also assign a value of a variable to another variable
2012-04-27 Katherine Deibel, Fluency in Information Technology 30
![Page 31: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/31.jpg)
Example: Assigning VariablesLine Assignment Statement myName yourName
1 var yourName = "Sarah"; Sarah
2 var myName = "Andrea"; Andrea Sarah
3 yourName = myName; Andrea Andrea
4 myName = "Kate"; Kate ??
5 yourName = "myName";
What happens to yourName now that we changed the value of myName?
2012-04-27 Katherine Deibel, Fluency in Information Technology 31
![Page 32: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/32.jpg)
Example: Assigning VariablesLine Assignment Statement myName yourName
1 var yourName = "Sarah"; Sarah
2 var myName = "Andrea"; Andrea Sarah
3 yourName = myName; Andrea Andrea
4 myName = "Kate"; Kate Andrea
5 yourName = "myName";
What happens to yourName now that we changed the value of myName?
Absolutely Nothing.2012-04-27 Katherine Deibel, Fluency in Information Technology 32
![Page 33: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/33.jpg)
Example: Assigning VariablesLine Assignment Statement myName yourName
1 var yourName = "Sarah"; Sarah
2 var myName = "Andrea"; Andrea Sarah
3 yourName = myName; Andrea Andrea
4 myName = "Kate"; Kate Andrea
5 yourName = "myName"; Kate myName
Remember that there is a difference between the variable myName and the
string value "myName".2012-04-27 Katherine Deibel, Fluency in Information Technology 33
![Page 34: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/34.jpg)
Other Assignment Operators
2012-04-27 Katherine Deibel, Fluency in Information Technology 34
Line Assignment Statement Value in myAge
1 var myAge = 32; 32
2 myAge = myAge + 2;
3 myAge += 2;
4 myAge ++;
5 myAge -= 3;
6 myAge -- ;
![Page 35: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/35.jpg)
Other Assignment Operators
2012-04-27 Katherine Deibel, Fluency in Information Technology 35
Line Assignment Statement Value in myAge
1 var myAge = 32; 32
2 myAge = myAge + 2; 34
3 myAge += 2;
4 myAge ++;
5 myAge -= 3;
6 myAge -- ;
![Page 36: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/36.jpg)
Other Assignment Operators
2012-04-27 Katherine Deibel, Fluency in Information Technology 36
Line Assignment Statement Value in myAge
1 var myAge = 32; 32
2 myAge = myAge + 2; 34
3 myAge += 2; 36
4 myAge ++;
5 myAge -= 3;
6 myAge -- ;
![Page 37: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/37.jpg)
Other Assignment Operators
2012-04-27 Katherine Deibel, Fluency in Information Technology 37
Line Assignment Statement Value in myAge
1 var myAge = 32; 32
2 myAge = myAge + 2; 34
3 myAge += 2; 36
4 myAge ++; 37
5 myAge -= 3;
6 myAge -- ;
![Page 38: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/38.jpg)
Other Assignment Operators
2012-04-27 Katherine Deibel, Fluency in Information Technology 38
Line Assignment Statement Value in myAge
1 var myAge = 32; 32
2 myAge = myAge + 2; 34
3 myAge += 2; 36
4 myAge ++; 37
5 myAge -= 3; 34
6 myAge -- ;
![Page 39: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/39.jpg)
Other Assignment Operators
2012-04-27 Katherine Deibel, Fluency in Information Technology 39
Line Assignment Statement Value in myAge
1 var myAge = 32; 32
2 myAge = myAge + 2; 34
3 myAge += 2; 36
4 myAge ++; 37
5 myAge -= 3; 34
6 myAge -- ; 33
![Page 40: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/40.jpg)
+ does more than one thing The + can be used to add numbers or join
strings (concatenate) 5 + 5 10 "a" + "b" + "c" "abc" '5' + '5' '55'
The operand type determines the operation Combine a number and string???
5 + '5' '55' Rule: With an operand of each type, convert
number to string, concatenate
is the symbol for “has the value”
2012-04-27 Katherine Deibel, Fluency in Information Technology 40
![Page 41: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/41.jpg)
Building An Alert() Message Use concatenate to build an alert message:
"Here's a random number: " + Math.random() In this case the letter string tells us that the
plus means concatenate; Math.random() is a JS function that gives a
random decimal number x from the range 0≤x<1
2012-04-27 Katherine Deibel, Fluency in Information Technology 41
![Page 42: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/42.jpg)
Here is the JavaScript JS “computes” the alert message for us
<html xmlns="http;//www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>First JavaScript</title> <style type="text/css"> body {background-color: black; color: gold; font-family; corbel;} </style> </head> <body> <h1>Showing Simple JS</h1> <script type="text/javascript"> alert("Let's show off the alert() operation"); alert("Here's a random number: " + Math.random()); </script></body></html>
2012-04-27 Katherine Deibel, Fluency in Information Technology 42
![Page 43: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/43.jpg)
Spaces and Concatenation JS “computes” the alert message for us
<html xmlns="http;//www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>First JavaScript</title> <style type="text/css"> body {background-color: black; color: gold; font-family; corbel;} </style> </head> <body> <h1>Showing Simple JS</h1> <script type="text/javascript"> alert("Let's show off the alert() operation"); alert("Here's a random number: " + Math.random()); </script></body></html>
Note the space after the colon. If we
omitted that, the alert would read:Here's a random number:0.34343
2012-04-27 Katherine Deibel, Fluency in Information Technology 43
![Page 44: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/44.jpg)
Parentheses JS “computes” the alert message for us
<html xmlns="http;//www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>First JavaScript</title> <style type="text/css"> body {background-color: black; color: gold; font-family; corbel;} </style> </head> <body> <h1>Showing Simple JS</h1> <script type="text/javascript"> alert("Let's show off the alert() operation"); alert("Here's a random number: " + Math.random()); </script></body></html>
Open '(' and close parentheses ')' need to be equal in number. A simple and common error is mismatched parentheses.
2012-04-27 Katherine Deibel, Fluency in Information Technology 44
![Page 45: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/45.jpg)
Basic Rules of ProgrammingYou thought XHTML was picky
2012-04-27 Katherine Deibel, Fluency in Information Technology 45
![Page 46: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/46.jpg)
My Approach to Teaching JavaScript has many rules for how it
is written The book condenses these for you I will condense them further
My goal: Get you started with good practices that
prevent common errors
2012-04-27 Katherine Deibel, Fluency in Information Technology 46
![Page 47: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/47.jpg)
Katherine Deibel, Fluency in Information Technology 47
Some basic rules for now There are absolute rules:
Open and close parentheses must match Variable names cannot begin with a
number There are 95% true rules
Every line of JS should end with a ; semicolon (exceptions will be shown on Monday)
2012-04-27
![Page 48: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/48.jpg)
Katherine Deibel, Fluency in Information Technology 48
Some basic rules for now There are good practice rules:
Indent nested statements (will be explained on Monday).
Put spaces before and after operators: x + 3 not x+3
Declare one variable per line Declare variables at the start of the script Comment your code ( /* text */ )
2012-04-27
![Page 49: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/49.jpg)
Comments Two ways to add comments in JS // …
JS will ignore everything after the // until the next line
/* … */ JS will ignore everything between the /* and */ even across multiple lines
Just use the /* */
2012-04-27 Katherine Deibel, Fluency in Information Technology 49
![Page 50: Intro to JavaScript Changing the Web Dynamically](https://reader034.fdocuments.in/reader034/viewer/2022051402/568162bc550346895dd348d1/html5/thumbnails/50.jpg)
Summary JavaScript is a typical programming
language in that it has many rules Learning strategy
Do the reading first Practicing is better than memorizing for
learning the rules Feel free to experiment but backup your
work from time to time Great to learn from examples (w3Schools)
2012-04-27 Katherine Deibel, Fluency in Information Technology 50