JavaScript基础
document.write() 用来输入信息 需注意的是：document.write一定要写到<script></script>中
案例：
1 <head> 2 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 3 <title>New Web Project</title> 4 <script type="text/javascript"> 5 document.write("你好,注意了是要在script标签的里面") 6 7 </script> 8 </head> 9 <body> 10 11 </body>
JavaScript的声明
var 变量名；
因为JavaScript是一种弱类型的语言，所以声明是不用声明数据类型，而是有变量的值决定的
JavaScript中有6中常用的基本数据类型:
1.undefined(未定义类型) 默认值为undefined
2.null(空类型) 默认为null值，但是它和undefined不同，不同点在于，undefined是声明变量不赋值，而null回赋一个空的值
3.number（数值类型） 它既可声明小数也可声明整数
4.String（字符串类型） 声明的字符串用单或双引括起来（‘’，“”）
常用的方法：
4.1 toString() 返回字符串
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> var boo = new Boolean(true) document.write(boo.toString()) </script> </head> <body> </body>
4.2 toLowerCase() 把字符串转为小写
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> var mu = 'ABCDEFG'; document.write(mu.toLowerCase()); </script> </head> <body> </body>
4.3 toUpperCase() 把字符串转为大写
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> var mu = 'abcdefg'; document.write(mu.toUpperCase()); </script> </head> <body> </body>
4.4 charAt() 返回在指定位置的字符
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //charAt(5是下标)，下标都是从0开始的，第5个是f就会输入f var mu = 'abcdefg'; document.write(mu.charAt(5)); </script> </head> <body> </body>
4.5 indexOf(str,index)返回某个指定的字符串中首次出现的位置
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //m 它会查找到e的下标 u 它会查找e的下标是否是6如果是就会输入它的下标位置，如果不是就会输出-1 var mu = 'abcdefg'; var m = mu.indexOf('e'); var u = mu.indexOf('e',4); document.write(m,u); </script> </head> <body> </body>
4.6 substring(index1,index2) 返回index1和index2之间的字符串，包括index1，但不包括index2
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> // var mu = 'abcdefg'; var m = mu.substring(2,5); document.write(m); </script> </head> <body> </body>
4.7 split（str） 把字符串分割为字符串数组
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //</br>换行 join（）是数组的一个连接方法 var mu = 'red,green,blue'; var m = mu.split(','); var u = m.join('-'); document.write('分割前:'+mu+"</br>"); document.write('使用\'-\'从连后'+u); </script> </head> <body> </body>
5.boolean（布尔类型） 它只有两个值true和false
6.object
常用输入/输出窗口
alert('提示信息');
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //一打开页面就会有一个窗口 var a = '我爱你，木木'; alert(a); //或者 alert('我爱你，木木') </script> </head> <body> </body>
prompt('提示信息','输入框默认信息')
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> var a = '我爱你，木木'; prompt('你爱我吗?','爱'); </script> </head> <body> </body>
逻辑控制语句
1.if-else
if(表达式){
//javaScript语句
}else{
//javaScript语句
}
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //如果成绩大于90就去玩，否则加油 var score = prompt('请输入成绩',' '); if(score>90){ alert('我带你去游乐园玩一次') }else{ alert('加油，下次好有机会'); } </script> </head> <body> </body>
2.switch()选择语句
//break 退出 continue跳过这一次进入下次
switch(表达式){
case 值1:
break;
case 值1:
break;
default:
break;
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //要是成绩等于优就去游乐园一日游，要是良80买娃娃，其他加油 case后面也可以是整形类型比如 case 1： var score = prompt('请输入成绩',' '); switch(score){ case "优": alert('给你买一个大娃娃'); break; case "良": alert('游乐园一日游'); break; default: alert('加油吧'); break; } </script> </head> <body> </body>
一般什么时候用循环?
当声明一个变量有很多的值时就用循环，能声明很多变量的值叫做数组
如何定义数组？
变量名可以有数字，大小写字母，美元符号（$），下划线，但是只能以大小写字母和美元符号开头
var 变量名（随便取名既可） = new array(5)或者 new array('apple', 'pear');
3.while()循环
while(条件判断）{
//javaScript语句
}
var count = 0; while (count < 10){ document.write(count + "<br />"); count++; }
4.do-while()循环
do{
//javaScript语句
}while(条件判断);
var count = 0; do{ document.write(count + "<br />"); count++; } while(count < 10);
5.for()循环
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //i=0是，走里面一遍，走完i++=（i=i+1）=1,再走一遍，一直到i=10位置 var mu = 0; for(var i=0;i<=10;i++){ document.write(i+'</br>'); } </script> </head> <body> </body>
6.for()增强
for(变量 in 数组）{
javaScript语句
}
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> var mu = ['mu','m','u']; for(var i in mu){ document.write(mu[i]+'</br>'); } </script> </head> <body> </body>
常用系统函数
parseInt() //解析一个字符串，返回整数
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //从开始差，如果这个字符串是数字就差下一个，直到遇到不是数字就停止，把之前查到的读出到，如果第一个就不是数字就返回NaN var mu = parseInt('12.58'); //返回12 var m = parseInt('18'); //返回18 var u = parseInt('aabs'); //返回NaN document.write(mu); document.write(m); document.write(u); </script> </head> <body> </body>
parseFolat() //解析一个字符串，返回浮点型（小数）
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //从开始差，如果这个字符串是数字就差下一个，直到遇到不是数字就停止，把之前查到的读出到，如果第一个就不是数字就返回NaN var mu = parseFloat('12.58'); //返回12.58 var m = parseFloat('18'); //返回18 var u = parseFloat('aabs'); //返回NaN document.write(mu); document.write(m); document.write(u); </script> </head> <body> </body>
自定义函数 【】 说明可用可不用 onclick按钮的单机事件
function 函数名(参数1,参数2...){
//javaScript语句
[return 返回值]
}
1.1无参函数，直接调用
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //创建一个无参数函数，在调用 function mu(){ alert('我爱你，木木'); } mu(); </script> </head> <body> </body>
1.2无参函数，在body的事件调用
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //创建一个无参数函数，在调用 function mu(){ alert('我爱你，木木'); } </script> </head> <body> <input name='btn' type='button' value='调用mu()' onclick='mu()'/> </body>
2.有参函数
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //创建一个有参数函数，在调用 function mu(count){ for(var i =0;i<count;i++){ document.write('我爱你，木木'+"</br>"); } } </script> </head> <body> <input name='btn' type='button' value='调用mu()' onclick="mu(prompt('请输入显示几次木木我爱你',''))"/> </body>
3.方法匿名 因为没有名字，容易出错所以不推荐使用
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript"> //方法匿名 var mu=function (count){ for(var i =0;i<count;i++){ document.write('我爱你，木木'+"</br>"); } } </script> </head> <body> <input name='btn' type='button' value='调用mu()' onclick="mu(prompt('请输入显示几次木木我爱你',''))"/> </body>
