JavaScript 组成:
ECMAScript + BOM + DOM
Window对象是JS中的顶层对象
ECMAScript: 规定了一些语法,变量,for循环等等结构
BOM: Browser object Model 浏览器对象模型
DOM:Document object Model 文档对象模型
案例:
<script type="text/javascript">
<!--
alert("abc");
//--> 如果浏览器不认识他,就忽略掉
</script>
数据类型
<html>
<head></head>
<script type="text/javascript">
/* javascript的数据类型:没有数据类型
使用typeof来判断数据类型
a.基本类型
1.undefined: 没有给变量赋值时的类型
2.String:
3.Boolean
4.Number:
5.function:
6.null
b.引用类型
Object
c.判断变量的类型的两种方式
1.typeof(): 打印的是所有类型的toString方法(所有类型的小写)
2.instanceof 关键字 ,判断变量是不是由某种类型new出来的。
*/
var a ;
a = 10;
a="abc";
a = true;
a=20;
alert(a instanceof Number);//因为不是new出来的,所以会显示false
a = new Number(30);
alert(a instanceof Number);//true
alert(typeof(a));
</script>
表单提交数据
<html> <head> <title>表单标签</title> 作用:搜集数据<br><br> </head> <body> </body> <form action="" method="get"> <!--action指要提交的页面 method默认采用的是get方式,post方式较为安全-- get方式将参数附加到网址后面,get方式的数据大小有限制 < 1k --> <!--value 表示要输入的内容 , value就是要提交到服务器的内容。 size表示字符的个数 readonly 只读 --> 姓名: <input type="text" value="请输入内容" size=50 readonly> <br><br> 密码: <input type="password" value="请输入密码" ><br><br> 隐藏框:<input type="hidden" value="hiddent"><br><br> 性别: <input type="radio" name="gender" value="male" >男<input type="radio" name="gender" value="female" checked>女<br><br>
<!--需要设定name 才能认为是一组,菜单实现单选--> <!--checked的值也是checked,可以省略,readonly的值也是readonly,可以省略--> 爱好: <input type="checkbox" name="love" value="打游戏">打游戏 <input type="checkbox" name="love" value="编程">编程 <input type="checkbox" name="love" value="打篮球">打篮球 <input type="checkbox" name="love" value="游泳">游泳 <input type="checkbox" name="love" value="追剧">追剧<br><br> 学历:<select name="xueli"> <option value="高中">高中</option> <option value="本科">本科</option> <option value="硕士">硕士</option> <option value="博士">博士</option> <option value="博士后">博士后</option> </select><br><br> 备注:<textarea rows="5" clos="5"></textarea><br><br> <!--占据5行,5列,中间不要留空--> 按钮:<br> <input type="button" value="普通按钮"onclick="alert(this.value)"><br> <input type="submit" value="提交按钮" onclick="alert(this.value)"><br> <input type="reset" value="重置按钮"><br><br> <input type="image" src="9.jpg"><br><br> <input type="image" value="普通按钮"><br><br> <button>123</button> </form> </html>
javascript的类型转换
1.把字符串转换为number类型
a.parseInt,parseFloat 不推荐,较复杂。
b.n * 1;
2.把字符串转换成boolean类型
非零为真,零为假。
NaN : not a number
var a ="123"; a = a * 1; alert(typeof(a)); function fun(){ //拿到文本框对象 var txt = document.getElementById("age"); //判断内容 if(tex == 100){ alert("年龄大于0"); }else{ alert(""); } }
函数的定义方式:
1.采用关键字function:
2.采用匿名函数的方式(采用function作为名字)--了解即可
函数的调用:
调用函数的时候是采用函数名来寻找的,不能有重名的函数。
function fun(){ alert("function"); } //写函数名调用 fun(); var a = function(){ alert("我是匿名函数"); } a();
函数劫持:改变javascript的函数预定义好的功能
window.alert = function(x){
document.write(x);
}
全局函数
1.isNaN : 是不是一个数字,返回TRUE不是数字; NaN:not a number
2.parseInt,parseFloat
3.eval:
a.主要执行字符串,将结果转换为数字
b.将json格式的字符串转换为json
{"a":"中国","b":"美国","c":"日本"}
4.escape() 编码
5.encodeURI(): 对网址(URL)进行编码
6.decodeURI(): 对网址爱(URL)进行编码
var a = "100"; if(isNaN(a)){ alert("不是数字"); }else{ alert("是数字"); } <!--结果是数字,因为javascript只判断内容,不判断类型--> alert("3" + "2"); <!--32--> alert(eval("3") + eval("2")); <!--5--> var b = "中国"; var c = escape(b); alert(c); alert(unescape(c)); var e = "http://www.sohu.com?a=中国&b=美国"; var f = encodeURI(e); alert(f); alert(decodeURI(f));
javascript中数组的类型
数组对象的定义方式
1.采用new Array() 的方式
2.采用[] 来定义(推荐使用)
javascript中数组与java中数组的差别
a.java中数组是有类型的,数组只能放一中数据类型,
javascript中的数组没有类型,但是不推荐放多种类型的数据。
b.java中数组的长度一旦确定就不能再改变了。
javascript中的数组长度是可以变化的。
c.java中的数组的数据引用必须用下标引用,
javascript中的数组的数据引用可以用任意对象。
var arr = new Array(); //定义数组arr,初始长度为0 var arr1 = new Array(4); //定义一个数组arr1,初始长度为4 arr1[0] = 1; arr1[1] = 3; alert(arr1[0]); alert(arr1[2]);<!--没有定义,则是undefined类型--> var arr2 = new Array(1,2,3,4,5,6,7,8); var arr3 = [2,4,5,8,0,3]; //定义了一个数组,同时初始化数据
数组对象的方法array
1.join(); 默认情况下用逗号隔开;
2.将元素添加到数组的末尾;
3.reverse() 翻转顺序
4.shift() 删除并返回第一个元素。
5.sort() 排序
默认情况下先将能转换为number类型的字符串和number类型的放一起比较(转换为String类型进行比较)
转换不成的作为一组进行比较
按照自己的规则进行比较:需要传递一个function类型的参数制定比较规则。
var arr1=["中国","美国","日本"]; alert(arr1.join()); <!--默认情况下用逗号隔开;--> alert(arr1.join("")); //用空字符串连接 arr1.push("东京"); alert(arr1.join()); alert(arr1.reverse());//翻转顺序 alert(arr1.shift()); ------------------------------------------------------- var arr1 = [3,6,"34","45",333]; alert(arr1.sort()); // 按字符串排序,3 < 333 < 34 < 4
//指定自己的规则 alert(arr1.sort(function(a,b){ if(a * 1 > b * 1){ return 1; }else{ return -1; } }));