JavaScript——2(对象)
来源:互联网 发布:网络动漫黑名单所有 编辑:程序博客网 时间:2024/05/03 09:25
1,对象(Object)或实例(instance):在JavaScript中,对象则是数据与程序代码的组合,它可以是整个应用程序或整个应用程序的一部分。
2,属性(property)或字段(filed):是用来描述对象的特质。
3,方法(method):是用来执行对象的动作。
4,事件(event):是在某些情况下发出特定信号警告。
5,类(class):是对象的分类,就像对象的蓝图,隶属于相同类的对象具有相同 的属性,方法与事件,但属性的值则不一定相同。
6,window对象包括以下三类子对象:
(1)核心对象:Array,Boolean,Date,Error,Function,Global,Math,Number,Object,RegExp,String等对象;
(2)环境对象:可以通过环境对象访问浏览器或用户屏幕的信息,包括location,screen,navigator,history等对象;
(3)document对象:这个对象代表的是HTML文件本身,可以通过它访问HTML文件的元素,包括窗体,图片,表格,超链接等。
1.window对象
window对象代表一个浏览器窗口(window),索引标签(tab)或框架(frame)。
<window.html>
<html> <head> <meta charset="utf-8"> <title>范例</title> <script language="javascript"> var MyWin = null; //此变量将存放open() 所返回的window对象,即新窗口 function OpenNewWindow() //开启新窗口 { MyWin = window.open("new.html", "MyWin", "height=200, width=400"); } function CloseNewWindow() //关闭新窗口 { if(MyWin && MyWin.open && !MyWin.closed) MyWin.close(); } function CloseWindow() //关闭本窗口 { window.close(); } </script> </head> <body> <a href="javascript:window.OpenNewWindow();">开启新窗口</a> <a href="javascript:window.CloseNewWindow();">关闭新窗口</a> <a href="javascript:window.CloseWindow();">关闭本窗口</a> </body></html>
<new.html>
<!doctype html><html> <head> <meta charset="utf-8"> <title>新窗口</title> </head> <body> 这是高度为200像素、宽度为400像素的新窗口 </body></html>
2.核心对象
2.1Number
window.document.write(Number.MAX_VALUE + "<br>"); window.document.write(Number.MIN_VALUE + "<br>"); window.document.write(Number.NaN + "<BR>"); window.document.write(Number.NEGATIVE_INFINITY + "<br>"); window.document.write(Number.POSITIVE_INFINITY + "<br>"); var X = new Number(123.456); window.document.write(X + "转换为科学表示法得到" + X.toExponential() + "<br>"); window.document.write(X + "取到小数点后面二位得到" + X.toFixed(2) + "<br>"); window.document.write(X + "转换为字符串得到" + X.toString() + "<br>"); window.document.write(X + "设定为8位精确位数得到" + X.toPrecision(8) + "<br>"); window.document.write(X + "取值得到" + X.valueOf() + "<br>");
2.2Boolean
当以第一种方式简历布尔类型的变量时,只有在参数为false,0,null,undefined的情况下,会得到值为false的变量。
var X=new Boolean(false);var X=false;
2.3String
var X="Java Script!";charAt(index);charCodeAt(index);indexOf(str,start);lastIndexOf(str);match(str);search(str);concat(str);replace(str1,str2);split(str);substr(index,length);substring(i1,i2);toLowerCase();toUpperCase();
String对象也提供了如下表的格式编排方法,可以将字符串输出为对应的HTML元素。
var X = new String("JavaScript程序设计"); window.document.write("anchor(): " + X.anchor() + "<br>"); window.document.write("big(): " + X.big() + "<br>"); window.document.write("blink(): " + X.blink() + "<br>"); window.document.write("bold(): " + X.bold() + "<br>"); window.document.write("fixed(): " + X.fixed() + "<br>"); window.document.write("fontcolor('red'): " + X.fontcolor("red") + "<br>"); window.document.write("fontsize(7): " + X.fontsize(7) + "<br>"); window.document.write("italics(): " + X.italics() + "<br>"); window.document.write("link('http://www.baidu.com'): " + X.link("http://www.baidu.com") + "<br>"); window.document.write("small(): " + X.small() + "<br>"); window.document.write("strike(): " + X.strike() + "<br>"); window.document.write("sub(): " + X.sub() + "<br>"); window.document.write("sup(): " + X.sup() + "<br>");
2.4Function
var Sum=new Function("X","Y","return(X+Y)");
2.5Object
var objEmployee =new Object();objEmployee.Name="小丸子";objEmployee.Age=25;
2.6Math
window.document.write("E的值为" + Math.E + "<br>"); window.document.write("LN2的值为" + Math.LN2 + "<br>"); window.document.write("LN10的值为" + Math.LN10 + "<br>"); window.document.write("LOG2E的值为" + Math.LOG2E + "<br>"); window.document.write("LOG10E的值为" + Math.LOG10E + "<br>"); window.document.write("PI的值为" + Math.PI + "<BR>"); window.document.write("SQRT1_2的值为" + Math.SQRT1_2 + "<br>"); window.document.write("SQRT2的值为" + Math.SQRT2 + "<br>"); window.document.write("-100的绝对值为" + Math.abs(-100) + "<br>"); window.document.write("5和25的较大值为" + Math.max(5,25) + "<br>"); window.document.write("5和25的较小值为" + Math.min(5,25) + "<br>"); window.document.write("2的10次方为" + Math.pow(2,10) + "<br>"); window.document.write("1.56的四舍五入值为" + Math.round(1.56) + "<br>"); window.document.write("2的平方根为" + Math.sqrt(2) + "<br>");
2.7Date
获取日期信息
//建立一个名称为objDate的Date对象,默认值为系统目前日期时间 var objDate = new Date(); //在浏览器显示objDate对象的值 document.write("目前日期时间为" + objDate + "<br>"); //调用Date对象的方法并显示结果 document.write("getDate()的返回值为" + objDate.getDate() + "<br>"); document.write("getDay()的返回值为" + objDate.getDay() + "<br>"); document.write("getMonth()的返回值为" + objDate.getMonth() + "<br>"); document.write("getYear()的返回值为" + objDate.getYear() + "<br>"); document.write("getFullYear()的返回值为" + objDate.getFullYear() + "<br>"); document.write("getHours()的返回值为" + objDate.getHours() + "<br>"); document.write("getMinutes()的返回值为" + objDate.getMinutes() + "<br>"); document.write("getSeconds()的返回值为" + objDate.getSeconds() + "<br>"); document.write("getMilliseconds()的返回值为" + objDate.getMilliseconds() + "<br>"); document.write("getTime()的返回值为" + objDate.getTime() + "<br>");
设置日期信息
var objDate = new Date(); //建立一个名称为objDate的Date对象 objDate.setDate(14); //将日期设置为14日 objDate.setMonth(1); //将月份设置为2月 objDate.setYear(2015); //将年份设置为2015年 objDate.setHours(12); //将小时设置为12点 objDate.setMinutes(10); //将分钟设置为10分 objDate.setSeconds(25); //将秒数设置为25秒 document.write("我们设置的日期时间为" + objDate + "<br>");
2.8Array
定义
//定义1var UserNames=new Array(5);UserNames[0]="小丸子";UserNames[1]="花轮";UserNames[2]="小玉";UserNames[3]="美环";UserNames[4]="丸尾";//定义2var UserNames=new Array("小丸子","花轮","小玉","美环","丸尾");//定义3var UserNames=["小丸子","花轮","小玉","美环","丸尾"];
多维数组
var Students = new Array(5); for(var i = 0; i < Students.length; i++) Students[i] = new Array(2);//声明Array对象的元素为另一个Array对象 Students[0][0] = "小丸子"; //一一给二维数组赋值 Students[1][0] = "花轮"; Students[2][0] = "小玉"; Students[3][0] = "美环"; Students[4][0] = "丸尾"; Students[0][1] = 80; Students[1][1] = 95; Students[2][1] = 92; Students[3][1] = 88; Students[4][1] = 85; for(var i = 0; i < Students.length; i++)//使用嵌套循环显示二维数组的值 { document.write("<tr>"); for(var j = 0; j < Students[i].length; j++) document.write("<td>" + Students[i][j] + "</td>"); document.write("</tr>"); }
Array对象的方法
//concat(arr)——数组合并 var Arr1 = new Array("a", "b", "c"); var Arr2 = new Array("d", "e"); var Arr3 = Arr1.concat(Arr2); for(var i = 0; i < Arr3.length; i++) document.write(Arr3[i] + "<br>");//join(str)——使用str连接元素 var Arr = new Array("a", "b", "c"); var Result = Arr.join("--"); document.write(Result);//pop()——删除最后一个元素 var Arr = new Array("a", "b", "c"); var Result = Arr.pop(); document.write(Result);//push(data)——添加元素 var Arr = new Array("a", "b", "c"); Arr.push("d"); for(var i = 0; i < Arr.length; i++) document.write(Arr[i] + "<br>");//shift()——删除第一个元素 var Arr = new Array("a", "b", "c"); var Result = Arr.shift(); document.write(Result);//unshift(data)——将data加入数组的前端 var Arr = new Array("a", "b", "c"); Arr.unshift("d"); for(var i = 0; i < Arr.length; i++) document.write(Arr[i] + "<br>");//reverse() 反转 var Arr = new Array("a", "b", "c"); Arr.reverse(); for(var i = 0; i < Arr.length; i++) document.write(Arr[i] + "<br>");//slice(start,end),返回下标start到下标end-1之间元素所形成的新数组 var Arr1 = new Array("a", "b", "c", "d", "e"); var Arr2 = Arr1.slice(1, 3); for(var i = 0; i < Arr2.length; i++) document.write(Arr2[i] + "<br>"); //sort()--排序,由小到大 var Arr = new Array(50, 40, 80, 90, 60); Arr.sort(); for(var i = 0; i < Arr.length; i++) document.write(Arr[i] + "<br>");//toString() var Arr = new Array("a", "b", "c"); var Result = Arr.toString(); document.write(Result);
Array作为参数
var Data1 = new Array(1, 2, 3, 4, 5); var Data2 = new Array(10, 20, 30, 40, 50); var Data3 = ArrAdd(Data1, Data2); //在浏览器显示数组Data3的元素 for(var i = 0; i < Data3.length; i++) document.write(Data3[i] + "<br>"); //声明一个名称为ArrAdd、有两个数组参数的函数 function ArrAdd(Arr1, Arr2) { var Arr3 = new Array(); for(var i = 0; i < Arr1.length; i++) Arr3[i] = Arr1[i] + Arr2[i]; return Arr3; }
2.9Error
var X = 100; try //错误处理的开头 { X = Y; //Y 未被定义将导致此程序语句发生错误 } catch(e) //捕捉到Error对象e { document.write("捕捉到的Error对象错误码为" + e.number + "<br>"); document.write("捕捉到的Error对象错误信息为" + e.message + "<br>"); document.write("捕捉到的Error对象错误描述为" + e.description + "<br>"); } finally //finally区块的程序代码一定会执行 { document.write("X的值为" + X); } //错误处理的结尾
3.环境对象
3.1loacation对象
location对象包括目前开启之网页的网址信息(URI),可以通过该对象获取或控制浏览器的网址,重载网页或导向其他网页。
<!doctype html><html> <head> <meta charset="utf-8"> <title>范例</title> <script language="javascript"> for(var Property in window.location) window.document.write(Property + ":" + window.location[Property] + "<br>"); </script> </head> <body> <input type="button" value="重载" onclick="javascript:window.location.reload();"> <input type="button" value="导向到百度网站" onclick="javascript:window.location.replace('http://www.baidu.com');"> </body> </html>
3.2screen对象
用户的屏幕信息。
window.document.write("height属性的值为" + screen.height + "<br>"); window.document.write("width属性的值为" + screen.width + "<br>"); window.document.write("availHeight属性的值为" + screen.availHeight + "<br>"); window.document.write("availWidth属性的值为" + screen.availWidth + "<br>"); window.document.write("colorDepth属性的值为" + screen.colorDepth + "<br>");
3.3navigator对象
<!doctype html><html> <head> <meta charset="utf-8"> <title>范例</title> <script language="javascript"> for(var Property in window.navigator) window.document.write(Property + ":" + window.navigator[Property] + "<br>"); </script> </head></html>
3.4history对象
history对象包含浏览器的浏览历程记录。
<!doctype html><html> <head> <meta charset="utf-8"> <title>范例</title> <script language="javascript"> for(var Property in window.history) window.document.write(Property + ":" + window.history[Property] + "<br>"); </script> </head> <body> <input type="button" value="上一页" onclick="javascript:window.history.back();"> <input type="button" value="下一页" onclick="javascript:window.history.forward();"> </body></html>
4.document对象
4.1新标签
<!doctype html><html> <head> <meta charset="utf-8"> <title>范例</title> <script language="javascript"> function openDocument() { var NewWin = window.open("", "NewWin");//开启新的浏览器 NewWin.document.open("text/html");//在另一个浏览器开启新文件 NewWin.document.write("这是新的HTML文件"); //在新文件中显示此字符串 NewWin.document.close();//关闭新文件数据流 } </script> </head> <body> <input type="button" value="开启新文件" onclick="javascript:openDocument();"> </body></html>
4.2几个方法
<input type="checkbox" name="phone" id="CB1" value="hTC"><input type="checkbox" name="phone" id="CB2" value="Apple"><input type="checkbox" name="phone" id="CB3" value="ASUS">var Element1=document.getElementById("CB1");var Element2=document.getElementsByName("phone");var Element3=document.getElementByTagName("input");
4.3document的子对象body
有属性:
link;alink;vlink;background;bgColor,text;
document.body.bgColor="yellow";
有集合:
all;anchors;links;forms;frames;Images;styleSheets;embeds;applets;plugins;
<form name="myForm1"> <input type="button" id="B1" value="按钮1"> <input type="button" id="B2" value="按钮2"></form><form name="myForm2"> <input type="button" id="B3" value="按钮3"> <input type="button" id="B4" value="按钮4"></form>document.forms[0].B1.value;//获取值document.forms.myForms1.B1.value;document.forms[1].B3.value;document.forms.myForms2.B3.value;
5.element对象
<!doctype html><html> <head> <meta charset="utf-8"> <title>范例</title> <script language="javascript"> function showMsg() { var msg = document.getElementById("message"); msg.innerHTML = "Hello World!"; } </script> </head> <body> <input type="button" value="显示信息" onclick="javascript:showMsg();"> <p id="message"></p> </body></html>
- JavaScript(2)——对象
- 【JavaScript】(2)——内置对象
- JavaScript——2(对象)
- JavaScript——2(对象)
- javascript学习——对象(2)
- JavaScript对象(2)——创建对象
- javascript浏览器对象(window对象)——Location对象
- javascript浏览器对象(window对象)——Navigator对象
- javascript浏览器对象(window对象)——Screen对象
- JavaScript 面向对象之一 —— 对象(认识对象)
- JavaScript——对象
- JavaScript基础—对象
- JavaScript—内置对象
- JavaScript—内置对象
- JavaScript02—JavaScript对象
- JavaScript对象-(2)
- javascript学习3——javascript面向对象(上)
- javascript学习4——javascript面向对象(中)
- Android单点触控技术,对图片进行平移,缩放,旋转操作
- MAC下如何把android源码导入到eclipse中阅读查看
- 前端工程师的发展之路
- hdu2063 二分图(基础题)
- 写啥呀
- JavaScript——2(对象)
- Spring Mvc 文件上传
- VirtualBox
- diskpart命令详解
- 关于navicat设置主键属性identity
- 【LeetCode051】N皇后问题,回溯法,加上一个栈维护结果
- LeetCode No342. Power of Four
- BroadcastReceiver
- 获取当前日期和星期 iOS