javascript基础04
1、循环语句
1.While
语句:
while (exp) {
//statements;
}
var i = 1;
while(i < 3){
alert(i);
i++;
}
2.do while
do { 需执行的代码 } while (变量<=结束值)
var i = 1;
do {
alert(i);
i++;
}while(i < 3);
3.for 循环
for (变量=开始值;变量<=结束值;变量=变量+步进值) {
需执行的代码
}
for(var count = 1; count < 11; count++){
alert(count);
}
4.break 语句和 continue 语句
break 语句可以立即退出循环;
continue 语句只是退出当前循环;

var n = 0;
for(var i = 1; i < 10; i++){
if(i == 4){
continue;
}
n++;
}
alert(n);


var n = 0;
for(var i=1; i < 10; i++){
if( i > 5){
break;
}
n++;
}
alert(n);

5.for in
枚举数组和类数组对象(即json格式的)
枚举出window对象下的属性

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body> <script type="text/javascript">
for(var attr in window){
console.log(attr+":"+window[attr]);
}
</script>
</body>
</html>

2.函数
函数就是完成某个功能的一组语句,函数由关键字 function + 函数名 + 一组参数定义; 函数在定义后可以被重复调用,通常将常用的功能写成一个函数,
利用函数可以使代码的组织 结构更多清晰。
基本语法:
function funName (arg0, arg1, … argN){
//statements
}

注意:
1.位于return 语句之后的任何代码都永远不会执行!
2.在JavaScript中,不一定要指定返回值!
3. 定义函数的参数时,如果调用函数时没有传进参数,并不会报错,但可以在函数里面判
断一下是否有传进参数,例如可以这样判断:
if(variable == 'undefined‘ || variable == null){
variable=‘1’; //可以给他一个默认值
}

作业题:
纯javascript写出来的;
九九乘法表:


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>9*9表格</title>
<script type="text/javascript">
window.onload=function(){ var str="<table>";
for(var i=1;i<10;i++){
str+="<tr>";
for(var j=1;j<=i;j++){
str+="<td>"+i+"*"+j+"="+i*j+"</td>";
}
str+="</tr>";
}
str+="</table>";
document.body.innerHTML=str;
}
</script>
<style>
table td{
border:1px solid #000;
}
table td:hover{
background: #00FF00;
color: #fff;
cursor: default;
}
</style>
</head>
<body>
</body>
</html>

国际象棋的棋盘


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>国际象棋</title>
</head>
<body>
<script>
var offOn=true;
var num=65;
var str='<div class="clearfix container">';
var str01='<ul class="t-b">';
var str02='<ul class="l-r fl">';
for(var i=0;i<8;i++){
str02+= '<li class="l-r-fl">'+(i+1)+'</li>';
str01+='<li class="fl t-b-fl">'+String.fromCharCode(num)+'</li>';
num++;
}
str01+='</ul>';
str02+='</ul>';
str+=str01;
str+="<div class='clearfix'>"+str02;
str+="<table cellspacing='0' cellpadding='0' class='fl'>";
for(var i=0;i<8;i++){
str+="<tr>";
for(var j=0;j<8;j++){
if(offOn){
offOn=!offOn;
str+="<td class='td01'></td>";
}else{
offOn=!offOn;
str+="<td class='td02'></td>";
}
}
offOn=!offOn;
str+="</tr>"
}
str+="</table>";
str+=str02+"</div>";
str+=str01+"</div>"; document.body.innerHTML=str;
</script>
<style>
ul{
list-style: none;
padding:0;
margin:0;
}
.clearfix:after{
display: block;
content: " ";
visibility: hidden;
clear: both;
}
.container{
background: #FFDAB9;
border:3px solid #000;
display: inline-block;
}
.t-b{
padding-left: 32px;
}
.t-b:after{
clear: both;
content: " ";
visibility: hidden;
display: block;
}
.fl{
float: left;
}
.t-b-fl{
width: 55px;
height: 30px;
line-height: 30px;
text-align: center;
font-size: 25px;
font-weight: bold;
}
.l-r-fl{
width: 32px;
height: 55px;
line-height: 55px;
text-align: center;
font-size: 25px;
font-weight: bold;
}
table{
border:2px solid #000;
}
table td{
width: 55px;
height: 55px;
}
.td01{
background: #D2691E;
}
.td02{
background: #FFDAB9;
}
</style>
</body>
</html>

javascript基础04的更多相关文章
- javaScript基础-04 对象
一.对象的基本概念 对象是JS的基本数据类型,对象是一种复合值,它将很多值(原始值或者对象)聚合在一起,可通过名字访问这些值,对象也可看做是属性的无序集合,每个属性都是一个名/值对.对象不仅仅是字符串 ...
- JavaScript基础04——数组的创建及方法
数组的概念及定义 数组的概念: 一组数据,数据的组和 哪些数据的组和,只要是数据(所有数据),就可以放在数组中 数组的意义: 可以同时操作多个数据 数组 ...
- JavaScript基础入门04
目录 JavaScript 基础入门04 JavaScript 对象 介绍 关于键名 对象的引用 语句和表达式需要注意的地方 对象属性常见的操作 with语句 JSON 特点 语法规则 JSON合法示 ...
- JavaScript基础第04天笔记
JavaScript基础第04天笔记 1 - 数组 1.1 数组的概念 数组可以把一组相关的数据一起存放,并提供方便的访问(获取)方式. 数组是指一组数据的集合,其中的每个数据被称作元素,在数组中可以 ...
- 前端之JavaScript基础
前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript历史 1992年Nombas开发出C ...
- JavaScript 基础回顾——对象
JavaScript是基于对象的解释性语言,全部数据都是对象.在 JavaScript 中并没有 class 的概念,但是可以通过对象和类的模拟来实现面向对象编程. 1.对象 在JavaScript中 ...
- javascript基础部分
javascript基础部分 1 数据类型: 基础数据类型(通过typeof来检测):Number,string,undefined,null,boolean,function typeof只能检测 ...
- javaScript基础之闭包
不管是Jquery还是EXTJS,现代的js框架中大量应用了js的一些特性,比如:匿名函数,闭包等等,导致源代码非常难以阅读. 不过要想真正的使用好前台的UI技术,还是需要去深入的理解这些概念. ...
- 第三篇:web之前端之JavaScript基础
前端之JavaScript基础 前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript ...
随机推荐
- MySql 存储过程、触发器和权限问题
存储过程 1.1 什么是存储过程 存储过程,带有逻辑的sql语句 之前的sql没有条件判断,没有循环 存储过程带上流程控制语句(if while) 1.2 存储过程特点 1)执行效率非常快!存储过程 ...
- 转: 深入理解Linux修改hostname
from: http://www.cnblogs.com/kerrycode/p/3595724.html 写的相当详细!!! 深入理解Linux修改hostname 2014-03-12 10:17 ...
- Intellij Idea中定制getter setter的模板
Alt + Ins, 调出快捷菜单后选择 Getter and Setter, 在对话框里, 选择对应的template, 右侧点开后, 可以新建自己的模板并编辑 将getter和setter都生成到 ...
- mysqli_fetch_assoc php的新的库函数
注释:mysql_fetch_assoc() 函数 定义和用法mysql_fetch_assoc() 函数从结果集中取得一行作为关联数组. 返回根据从结果集取得的行生成的关联数组,如果没有更多行,则返 ...
- 【ASP.NET实战教程】ASP.NET实战教程大集合,各种项目实战集合
[ASP.NET实战教程]ASP.NET实战教程大集合,各种项目实战集合,希望大家可以好好学习教程中,有的比较老了,但是一直很经典!!!!论坛中很多小伙伴说.net没有实战教程学习,所以小编连夜搜集整 ...
- JavaScript indexOf() 方法 和 lastIndexOf() 方法
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置. lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索. 语法: in ...
- ionic路由传值
ionic路由传值 app.js ===================================== //新建工作任务.state(‘app.newTask’, angularAMD.rout ...
- 平行四边形导航,背景颜色渐变动画(不支持IE6/7/8)
body{ font-size: 14px; } ul ,li{ margin:0px; padding:0px; list-style: none; } .box{ width: 1000px; h ...
- 为什么print在python3中变成了函数?
转自:http://www.codingpy.com/article/why-print-became-a-function-in-python-3/ 在Python 2中,print是一个语句(st ...
- 添加native service
原文地址:http://blog.csdn.net/zhx6044/article/details/47342227 Native Service 其实就是一个 linux 守护进程,提供一些服务,不 ...