【程式碼筆記】Web-JavaScript-javaScript for迴圈
阿新 • • 發佈:2018-12-20
一,效果圖。
二,程式碼。
<!DOCTYPE html>
<html> <head> <meta charset="utf-8"> <title>javascript for迴圈</title> </head> <body> <script> cars = ["bmw", "volvo", "saab", "ford"]; for (var i = 0; i < cars.length; i++) { document.write(cars[i] + "<br>"); } </script> <p>點選按鈕迴圈程式碼5次</p> <button onclick="myFunction()">點選這裡</button> <p id="demo"></p> <script> function myFunction() { var x = ""; for (var i = 0; i < 5; i++) { x = x + "the number is" + i + "<br>"; } document.getElementById("demo").innerHTML = x; } </script> <p>點選下面的按鈕,迴圈遍歷物件"person"的屬性</p> <button onclick="myFunction()">點選這裡</button> <p id="demo1"></p> <script> function myFunction() { var x; var txt = ""; var person = { fname: "bill", lname: "gates", age: 56 }; for (x in person) { txt = txt + person[x]; } document.getElementById("demo1").innerHTML = txt; } </script> </body> </html>
參考資料:《菜鳥教程》
一,效果圖。
二,程式碼。
<!DOCTYPE html>
<html> <head> <meta charset="utf-8"> <title>javascript for迴圈</title> </head> <body> <script> cars = ["bmw", "volvo", "saab", "ford"]; for (var i = 0; i < cars.length; i++) { document.write(cars[i] + "<br>"); } </script> <p>點選按鈕迴圈程式碼5次</p> <button onclick="myFunction()">點選這裡</button> <p id="demo"></p> <script> function myFunction() { var x = ""; for (var i = 0; i < 5; i++) { x = x + "the number is" + i + "<br>"; } document.getElementById("demo").innerHTML = x; } </script> <p>點選下面的按鈕,迴圈遍歷物件"person"的屬性</p> <button onclick="myFunction()">點選這裡</button> <p id="demo1"></p> <script> function myFunction() { var x; var txt = ""; var person = { fname: "bill", lname: "gates", age: 56 }; for (x in person) { txt = txt + person[x]; } document.getElementById("demo1").innerHTML = txt; } </script> </body> </html>
參考資料:《菜鳥教程》