JavaScript DHTML/Language Basics/For — различия между версиями

Материал из Web эксперт
Перейти к: навигация, поиск
м (1 версия)
 
(нет различий)

Текущая версия на 07:24, 26 мая 2010

A Demonstration of a Nested Loop

  
<html>
<head>
  <title>A Demonstration of a Nested Loop</title>
</head><body>
  <script type="text/javascript">
  <!--
    document.write("All x,y coordinates between (0,0) and (9,9):<br>")
   
    for (var x = 0; x < 10; ++x) {
      for (var y = 0; y < 10; ++y) {
        document.write("(" + x + "," + y + "),");
      }
      document.write("<br>");
    }
   
    document.write("<br>After completing the loop, x equals : " + x);
    document.write("<br>After completing the loop, y equals : " + y);
  // -->
  </script>
</body>
</html>



A for Loop Used to Count from 0 to 99

  
<html>
<head>
<title>A for Loop Used to Count from 0 to 99</title>
<body>
  <script type="text/javascript">
  <!--
    document.write("Numbers 0 through 99:");
    document.write("<hr size="0" width="50%" align="left">");
   
    for (var i = 0; i < 100; ++i) {
      if(i%10 == 0) {
        document.write("<br>");
      }
      document.write(i + ",");
    }
    document.write("<br><br>After completing the loop, i equals : " + i);
  // -->
  </script>
</body>
</html>



Check the loop counter

 
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
for (var i = 1; i < 101; i++) {
    if (i == 99) {
        alert("The number is " + i);
    }
}
</script>
</body>
</html>



Control the loop step

  
<html>
<head>
<title>A Simple Page</title>
<script language="JavaScript">
for (x = 10; x >= 0; x = x - 2)
{
    alert(x);
}
</script>
</head>
<body>
</body>
</html>



Declare for loop counter

  
<HTML>
<HEAD>
<SCRIPT language="JavaScript">
for (count=1;count<16;count+=1)
{
  document.write(count+"<BR>");
}
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>



Drawing a Christmas Tree Using Nested For Loops

  
<HTML>
<BODY>
<CENTER>
<SCRIPT> 
   var width=1; 
   for (i=0; i <= 5 ; i++) { 
      for (x=0; x<=4; x++) { 
         for (y=1; y<=width; y++) { 
            var Number=Math.random()*10; 
            var Ornament=Math.round(Number); 
            if (Ornament<=1) { 
               document.write("O"); 
            } 
            if (Ornament>=2)  { 
               document.write(" X"); 
            } 
         } 
         document.write("<BR>"); 
         width=width+1; 
      } 
      width=width-2; 
   } 
</SCRIPT>
</CENTER>
</BODY>
</HTML>



For loop

  
<html>
<body>
<script type="text/javascript">
for (i = 0; i <= 5; i++){
    document.write("The number is " + i)
    document.write("<br>")
}
</script>
</body>
</html>



For loop for lines

  
<html>
<head>
<script language="JavaScript">
<!--
function testLoop() {
  var String1 = "<hr align="center" width=";
  document.open();
  for (var size = 5; size <= 100; size+=5)
      document.writeln(String1 + size + "%">");
  document.close();
}
//-->
</script>
</head>
<body>
<form>
<input type="button" value="Test the loop" onClick="testLoop()">
</form>
</body>
</html>



For loop with alert dialog

  
<html>
<head>
<script language="JavaScript">
<!--
function seeElem(f)  {
  var elementList = "";
  for (var num=0; num < f.elements.length; num++) {
      elementList += num + ". " + f.elements[num] + "\n";
  }
  alert(elementList);
}
//-->
</script>
</head>
<body>
<form>
<table>
<tr>
 <td>Name:</td>
 <td><input name="persname" 
            type="text">
</tr>
<tr>
  <td>E-mail:</td>
  <td><input name="email" type="text"></td>
</tr>
</table>
<input type="button" value="See elements" onClick="seeElem(this.form)">
</form>
</body>
</html>



Labeled Statements

  
/*
JavaScript Bible, Fourth Edition
by Danny Goodman 
John Wiley & Sons CopyRight 2001
*/

<HTML>
<HEAD>
<TITLE>Breaking Out of Nested Labeled Loops</TITLE>
<SCRIPT LANGUAGE="JavaScript">
var targetA = 2
var targetB = 2
var range = 5
function run1() {
    var out = document.forms[0].output
    out.value = "Running WITHOUT labeled break\n"
    for (var i = 0; i <= range; i++) {
        out.value += "Outer loop #" + i + "\n"
        for (var j = 0; j <= range; j++) {
            out.value += "  Inner loop #" + j + "\n"
            if (i == targetA && j == targetB) {
                out.value += "**BREAKING OUT OF INNER LOOP**\n"
                break
            }
}
    }
    out.value += "After looping, i = " + i + ", j = " + j + "\n"
}
function run2() {
    var out = document.forms[0].output
    out.value = "Running WITH labeled break\n"
    outerLoop:
    for (var i = 0; i <= range; i++) {
        out.value += "Outer loop #" + i + "\n"
        innerLoop:
        for (var j = 0; j <= range; j++) {
            out.value += "  Inner loop #" + j + "\n"
            if (i == targetA && j == targetB) {
                out.value += "**BREAKING OUT OF OUTER LOOP**\n"
                break outerLoop
            }
        }
    }
    out.value += "After looping, i = " + i + ", j = " + j + "\n"
}
</SCRIPT>
</HEAD>
<BODY>
<H1>Breaking Out of Nested Labeled Loops</H1>
<HR>
<P>Look in the Results field for traces of these button scripts:</P>
<FORM>
<P><INPUT TYPE="button" VALUE="Execute WITHOUT Label" onClick="run1()"></P>
<P><INPUT TYPE="button" VALUE="Execute WITH Label" onClick="run2()"></P>
<P>Results:</P>
<TEXTAREA NAME="output" ROWS=43 COLS=60> </TEXTAREA>
</FORM>
</BODY>
</HTML>



Plain for loop

  
<HTML>
<HEAD>
<SCRIPT language="JavaScript">
<!-- 
for (count=1;count<16;count+=1){
    document.write(count+". This is getting way too repetitive.<BR>");
}
//-->
</SCRIPT>
</HEAD>
</HTML>



The break Statement

  
<HTML>
<HEAD>
<TITLE>Using the Break Statement</TITLE>
</HEAD>
<BODY>
<SCRIPT><!--
for(i=100;i>0;--i){
 document.write(i+"<BR>")
 if(i%17==0) 
   break;
}
// --></SCRIPT>
</BODY>
</HTML>



The continue Statement

  
<HTML>
<HEAD>
<TITLE>Using the Continue Statement</TITLE>
</HEAD>
<BODY>
<SCRIPT><!--
for(i=1;i<10;++i){
 if(i%2!=0) continue
 document.write(i+"<BR>")
}
// --></SCRIPT>
</BODY>
</HTML>



Use for in loop to go through an array

  
<html>
<head>
<title>A Simple Page</title>
<script language="JavaScript">
var myarray = new Array(5);
myarray[0] = 5
myarray[1] = 8
myarray[2] = 10
myarray[3] = 18
myarray[4] = 180
for (x in myarray) 
{
    myarray[x] = ++myarray[x];
}
alert(myarray);
alert(x);
</script>
</head>
<body>
</body>
</html>



Use for loop to fill an array

  
<html>
<head>
<title>A Simple Page</title>
<script language="JavaScript">
var myarray = new Array();
for (i = 0; i < 10; i++) 
{
    myarray[i] = i;
}
alert(myarray);
</script>
</head>
<body>
</body>
</html>



Use of the for Statement

  
<HTML>
<HEAD>
<TITLE>Using the For Statement</TITLE>
</HEAD>
<BODY>
<SCRIPT><!--
for(i=1;i<7;++i)
 document.write("<H"+i+">This is a level "+i+" heading." +"</H"+i+">")
// --></SCRIPT>
</BODY>
</HTML>



Using a for..in Loop in JavaScript

  
<html>
<head>
<title>JavaScript Unleashed</title>
</head>
<body>
  <script language="JavaScript1.1" type="text/javascript">
  <!--
    var anObject = document;
    var propertyInfo = "";
   
    for (var propertyName in anObject) {
      propertyInfo = propertyName + " = " + anObject[propertyName];
      document.write(propertyInfo + "<br>");
    }
  // -->
  </script>
</body>
</html>



Using the continue and break Statements

  
<html>
<head>
  <title>Using the continue and break Statements</title>
</head>
<body>
  <script type="text/javascript">
  <!--
    var highestNum = 0;
    var n = 201;
   
    for(var i = 0; i < n; ++i){
      document.write(i + "<br>");
      if(n < 0){
        document.write("n cannot be negative.");
        break;
      }
      if (i * i <= n) {
        highestNum = i;
        continue;
      }
      document.write("<br>Finished!");
      break;
    }
    document.write("<br>The integer less than or equal to the Square Root");
    document.write(" of " + n + " = " + highestNum);
  // -->
  </script>
</body>
</html>



Using the label Statement

  
<html>
<head>
<title>Using the label Statement</title>
</head>
<body>
  <script language="JavaScript1.2" type="text/javascript">  <!--
    var stopX = 3;
    var stopY = 8;
   
    document.write("All x,y pairs between (0,0) and (");
    document.write(stopX + "," + stopY + "):<br>");
   
    loopX:
    for(var x = 0; x < 5; ++x){
      for(var y = 0; y < 10; ++y){
        document.write("("+x + "," + y +") ");
        if((x == stopX) && (y == stopY)){
          break loopX;
        }
      }
      document.write("<br>");
    }
    document.write("<br>x equals : " + x);
    document.writeln("<br>y equals : " + y);
  // -->
  </script>
</body>
</html>