ex1.html: first example.
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>JavaScript Example 1</title> </head> <body> <script type="text/javascript"> <!-- for(i=1;i<=10;i++) document.writeln("<p>The square of "+i+" is "+ i*i + ".</p>"); // --> </script> </body> </html>
ex2.html: show an alert
<script type="text/javascript"> <!-- alert("Hello World!"); // --> </script>>
ex3.html: comments
<script type="text/javascript"> <!-- // the program prints out numbers and there square /* for loop write square from 1 to 1 */ for(i=1;i<=10;i++) document.writeln("<p>The square of "+i+" is "+ i*i + ".</p>"); // --> </script>
ex4.html: external javascript file
<script type="text/javascript" src="ex4.js"> </script>
/* for loop write square from 1 to 1 */ for(i=1;i<=10;i++) document.writeln("<p>The square of "+i+" is "+ i*i + ".</p>");
ex5.html: join strings.
<script type="text/javascript"> <!-- var name="Charles", age=20; document.writeln("<p>" + name + " is " + age + ".</p>"); // --> </script>
ex6.html: different types.
<script type="text/javascript"> <!-- var name="Charles", age=20; document.writeln("<p>" + name + " is " + age + ".</p>"); name=20; age="Charles" document.writeln("<p>" + name + " is " + age + ".</p>"); // --> </script>
<script type="text/javascript"> <!-- var name="Charles", age=20; document.writeln("<p style=\"color: red; font-size: 30pt\">" + name + " is " + age + ".</p>"); // --> </script>
ex8.html: different variable types.
<script type="text/javascript"> <!-- var counter, index, pi=3.1415, pi2= 31.415e-1, passExam = true, name ="Charles"; document.writeln(pi + "<br />"); document.writeln(pi2 + "<br />"); document.writeln(name + "<br />"); // --> </script>
ex9.html: Math class.
<script type="text/javascript"> <!-- document.writeln("<table border=\"1\">"); document.writeln("<tr><th>n</th><th>sqrt n</th></tr>"); for(var i=1; i<=100; i++) { document.writeln("<tr><td>" + i + "</td><td>" + Math.sqrt(i) + "</td></tr>"); } document.writeln("</table>"); // --> </script>
ex10.html: String class.
<script type="text/javascript"> <!-- var str="PIC 40A is fun!"; document.writeln(str.charAt(5) + "<br>"); // returns 0 document.writeln(str.indexOf('C') + "<br>"); // returns 2 document.writeln(str.indexOf("fun") + "<br>"); // return 11 document.writeln(str.indexOf("abc") + "<br>"); // return -1 document.writeln(str.substring(4, 8) + "<br>"); // returns "40A i" document.writeln(str.toLowerCase() + "<br>"); // "pic 40a is fun!" // --> </script>
ex11.html: confirm.
<script type="text/javascript"> <!-- var ans; ans = confirm("Do you want to continue?"); if(ans) { // if true document.writeln("<p>Ok!!!</p>"); } else { document.writeln("<p>Cancel!!!</p>"); } // --> </script>
ex12.html: alert and prompt.
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//w3c//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <!-- firstproduct.html --> <head> <title>JavaScript Example 12</title> <script type="text/javascript"> <!-- alert("Welcome to First Products in JavaScript"); var num1, num2, product; num1 = prompt("Enter first integer", "0"); num2 = prompt("Enter second integer", "0"); product = num1 * num2; document.writeln("<h1>The product is " + product + "</h1>"); // --> </script> </head> <body> <p>Click Refresh (or Reload) to run script again.</p> </body> </html>
ex13.html: error check.
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//w3c//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>JavaScript Example 13</title> <script type="text/javascript"> <!-- alert("Welcome to Products in JavaScript"); var num1, num2, product; num1 = parseInt(prompt("Enter first integer", "")); num2 = parseInt(prompt("Enter second integer", "")); if (!isNaN(num1) && !isNaN(num2)) { product = num1 * num2; document.writeln("<h1>The product is " + product + "</h1>"); } else { document.writeln("<h1>Hey, you forgot to type in the numbers!</h1>"); } // --> </script> </head> <body> <p>Click Refresh (or Reload) to run script again.</p> </body> </html>
ex14.html: array.
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//w3c//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>JavaScript Example 14</title> <script type="text/javascript"> <!-- function avgeScores (scores) { var size = scores.length; var sum = 0; for (var i = 0; i < size; i++) sum += scores[i]; return sum / size; } // --> </script> </head> <body> <script type="text/javascript"> <!-- var num = 0, i = 0; var scores = new Array(); document.writeln("<h1 style=\"text-align: center\">Welcome" + " to the Average Center</h1>"); while (num != -1) { num = parseInt(prompt("Enter the score, -1 to stop: ", "0")); if (num != -1) { scores[i] = num; i++; } } if (i > 0) document.writeln("<p>The average is " + avgeScores(scores) + "</p>") else document.writeln("<h1>You didn't enter any scores!</h1>"); // --> </script> <p>To find another average, click Reload (or Refresh).</p> </body> </html>
ex15.html: function.
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//w3c//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>JavaScript Example 15</title> <script type="text/javascript"> <!-- function absValue (n) { if (n >= 0) return n; else return -n; } //--> </script> </head> <body> <script type="text/javascript"> <!-- var num; document.writeln("<h1>Find absolute value</h1>"); num = parseInt(prompt("Enter an integer", "0")); if (!isNaN(num)) document.writeln("The absolute value of " + num + " is " + absValue(num) + "<br>"); else document.writeln("<p>You did not enter a number.</p>"); // --> </script> <p>Click Refresh (or Reload) to run the script again.</p> </body> </html>
ex16.html: sorting
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//w3c//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Sales Sorter for XYZ Corp.</title> <script type="text/javascript"> <!-- function compareFloat(num1, num2) { return (num1 - num2); } // --> </script> </head> <body> <script type="text/javascript"> <!-- var i = 0, value = 0; var sales = new Array(); value = parseFloat(prompt("Enter sales, -1 to stop: ", "")); while (value != -1) { if (!isNaN(value)) { sales[i] = value; i++; } value = prompt("Enter sales, -1 to stop: ", ""); } sales.sort(compareFloat); document.writeln("<h1>Sales for XYZ Corp. in order:</h1>\n<p>" + sales.join(", ") + "</p>"); // --> </script> </body> </html>