JavaScript常用函数列表
click() 对象.click() 使对象被点击。
closed 对象.closed 对象窗口是否已关闭true/false
clearTimeout(对象) 清除已设置的setTimeout对象
clearInterval(对象) 清除已设置的setInterval对象
confirm("提示信息") 弹出确认框，确定返回true取消返回false
cursor:样式 更改鼠标样式 hand crosshair text wait help default auto e/s/w/n-resize
event.clientX 返回最后一次点击鼠标X坐标值；
event.clientY 返回最后一次点击鼠标Y坐标值；
event.offsetX 返回当前鼠标悬停X坐标值
event.offsetY 返回当前鼠标悬停Y坐标值
document.write(document.lastModified) 网页最后一次更新时间
document.ondblclick=x 当双击鼠标产生事件
document.onmousedown=x 单击鼠标键产生事件
document.body.scrollTop; 返回和设置当前竖向滚动条的坐标值，须与函数配合,
document.body.scrollLeft; 返回和设置当前横向滚动务的坐标值，须与函数配合，
document.title document.title="message"; 当前窗口的标题栏文字
document.bgcolor document.bgcolor="颜色值"; 改变窗口背景颜色
document.Fgcolor document.Fgcolor="颜色值"; 改变正文颜色
document.linkcolor document.linkcolor="颜色值"; 改变超联接颜色
document.alinkcolor document.alinkcolor="颜色值"; 改变正点击联接的颜色
document.VlinkColor document.VlinkColor="颜色值"; 改变已访问联接的颜色
document.forms.length 返回当前页form表单数
document.anchors.length 返回当前页锚的数量
document.links.length 返回当前页联接的数量
document.onmousedown=x 单击鼠标触发事件
document.ondblclick=x 双击鼠标触发事件
defaultStatus window.status=defaultStatus; 将状态栏设置默认显示
function function xx(){...} 定义函数
isNumeric 判断是否是数字
innerHTML xx=对象.innerHTML 输入某对象标签中的html源代码
innerText divid.innerText=xx 将以div定位以id命名的对象值设为XX
location.reload(); 使本页刷新，target可等于一个刷新的网页
Math.random() 随机涵数,只能是0到1之间的数,如果要得到其它数,可以为*10,再取整
Math.floor(number) 将对象number转为整数，舍取所有小数
Math.min(1,2) 返回1,2哪个小
Math.max(1,2) 返回1,2哪个大
navigator.appName 返回当前浏览器名称
navigator.appVersion 返回当前浏览器版本号
navigator.appCodeName 返回当前浏览器代码名字
navigator.userAgent 返回当前浏览器用户代标志
onsubmit onsubmit="return(xx())" 使用函数返回值
opener opener.document.对象 控制原打开窗体对象
prompt xx=window.prompt("提示信息","预定值"); 输入语句
parent parent.框架名.对象 控制框架页面
return return false 返回值
random 随机参数（0至1之间）
reset() form.reset(); 使form表单内的数据重置
split("") string.split("") 将string对象字符以逗号隔开
submit() form对象.submit() 使form对象提交数据
String对象的 charAt(x)对象 反回指定对象的第多少位的字母
lastIndexOf("string") 从右到左询找指定字符，没有返回-1
indexOf("string") 从左到右询找指定字符，没有返回-1
LowerCase() 将对象全部转为小写
UpperCase() 将对象全部转为大写
substring(0,5) string.substring(x,x) 返回对象中从0到5的字符
setTimeout("function",time) 设置一个超时对象
setInterval("function",time) 设置一个超时对象
toLocaleString() x.toLocaleString() 从x时间对象中获取时间，以字符串型式存在
typeof(变量名) 检查变量的类型，值有：String,Boolean,Object,Function,Underfined
window.event.button==1/2/3 鼠标键左键等于1右键等于2两个键一起按为3
window.screen.availWidth 返回当前屏幕宽度(空白空间)
window.screen.availHeight 返回当前屏幕高度(空白空间)
window.screen.width 返回当前屏幕宽度(分辨率值)
window.screen.height 返回当前屏幕高度(分辨率值)
window.document.body.offsetHeight; 返回当前网页高度
window.document.body.offsetWidth; 返回当前网页宽度
window.resizeTo(0,0) 将窗口设置宽高
window.moveTo(0,0) 将窗口移到某位置
window.focus() 使当前窗口获得焦点
window.scroll(x,y) 窗口滚动条坐标，y控制上下移动，须与函数配合
window.open()
window.open("地址","名称","属性")
属性:toolbar(工具栏),location(地址栏),directions,status(状态栏),
menubar(菜单栏),scrollbar(滚动条),resizable(改变大小), width(宽),height(高),fullscreen(全
屏),scrollbars(全屏时无滚动条无参 数,channelmode(宽屏),left(打开窗口x坐标),top(打开窗口y坐标)
window.location = 'view-source:' + window.location.href 应用事件查看网页源代码;
a=new Date(); //创建a为一个新的时期对象
y=a.getYear(); //y的值为从对象a中获取年份值 两位数年份
y1=a.getFullYear(); //获取全年份数 四位数年份
m=a.getMonth(); //获取月份值
d=a.getDate(); //获取日期值
d1=a.getDay(); //获取当前星期值
h=a.getHours(); //获取当前小时数
m1=a.getMinutes(); //获取当前分钟数
s=a.getSeconds(); //获取当前秒钟数
对象.style.fontSize="文字大小";
单位：mm/cm/in英寸/pc帕/pt点/px象素/em文字高
1in=1.25cm
1pc=12pt
1pt=1.2px(800*600分辩率下)
文本字体属性：
fontSize大小
family字体
color颜色
fontStyle风格，取值为normal一般,italic斜体,oblique斜体且加粗
fontWeight加粗,取值为100到900不等,900最粗,light,normal,bold
letterSpacing间距,更改文字间距离,取值为,1pt,10px,1cm
textDecoration:文字修饰;取值,none不修饰,underline下划线,overline上划线
background:文字背景颜色,
backgroundImage:背景图片,取值为图片的插入路径
点击网页正文函数调用触发器：
1.onClick 当对象被点击
2.onLoad 当网页打开,只能书写在body中
3.onUnload 当网页关闭或离开时,只能书写在body中
4.onmouseover 当鼠标悬于其上时
5.onmouseout 当鼠标离开对象时
6.onmouseup 当鼠标松开
7.onmousedown 当鼠标按下键
8.onFocus 当对象获取焦点时
9.onSelect 当对象的文本被选中时
10.onChange 当对象的内容被改变
11.onBlur 当对象失去焦点 [size=x-small][/size]
++++++++++++++++++++++++++++++++++++++
内部函数
eval()
parseInt()字符串转整数
parseFloat()字符串转浮点数
escape()将字符串编码为url形式
unescape()解码escape()编码的字符串
isNaN()判断是否是数字
isFinite()判断是否是数字
++++++++++++++++++++++++++++++++++++++
对象
Date对象
Date对象用来处理日期和时间
var objDate=new Date();
objDate.getFullYear()//返回年
objDate.getMonth()//返回月
objDate.getDate()//返回日
objDate.getDay()//返回星期
objDate.getHours()//返回小时
objDate.getMinutes()//返回分
objDate.getSeconds()//返回秒
objDate.getTime()//返回GMT时间，1970.1.1起经过的毫秒数
++++++++++++++++++++++++++++++++++++++
Math对象
Math对象用来进行数据运算
四舍五入 Math.round(x)
x=Math.round(x);
随机函数 Math.random()
返回一个0到1之间的小数。
Math.round(Math.random()*随机整数数目)+整数范围的下限
返回100-200的随机整数
Math.round(Math.random()*100)+100
++++++++++++++++++++++++++++++++++++++
Array对象
数组对象
创建数组
var objArray=new Array();//创建一个空数组
var objArray=new Array(10);//创建一个数组，包括10个元素
var objArray=new Array("a","b","c");//以"a","b","c"3个元素初始化一个数组对象
赋初值：
Myarray[1]=“字串１”；
访问数组元素
a=Myarray[0];
内部数组
anchors[]:使用<a name="anchorName">标识来建立锚的链接。
links[]: 使用<a href="URL">来定义一个越文本链接项。
Forms[]: 在程序中使用多窗体时,建立该数组。
Elements[]:在一个窗口中使用从个元素时,建立该数组。
Frames[]:建立框架时,使用该数组
多维数组
定义
var arr=new array(4);
for(var i=0;i<4;i++){
arr[i]=new Array(6);
}
访问
for(var i=0;i<4;i++){
for(var j=0;j<6;j++){
//处理arr[i][j]
}
}
属性
数组长度：objArray.length;
方法
转为字符串：objArray.toString()
以sep指定的字符作为分隔符，将数组转为字符串：objArray.join(sep)
弹出数组最后一个元素：objArray.pop()
将参数加到数组结尾：objArray.push(value)
++++++++++++++++++++++++++++++++++++++
String对象
字符串
属性
字符串长度：str.length;
方法
返回ascii字符：string.charCodeAt();//"abc".charCodeAt(0)返回97
返回长度为length的子字符串：string.substr(start,length);
返回start到end的子字符串string.substring(start,end);
以s作为分隔符切割成多个子字符串：string.split(s);
替换和匹配字符串
搜索出匹配正则的所有子字符串：match(regExp)
字符串中搜索出匹配正则的第一个子字符串：search(regExp)
++++++++++++++++++++++++++++++++++++++
navigator对象
获取浏览器信息
属性
浏览器的正式名称：appName
是否启用了cookie:cookieEnabled
操作平台：platform
浏览器及环境信息：userAgent
var i=navigator.userAgent.toLowerCase().indexOf("firefox");
++++++++++++++++++++++++++++++++++++++
location对象
处理地址栏信息
window.location.href="http://www.163.com";
<a href="javascript:void(0)" onclick="">page</a>
javascript:void(0)使<a>不起作用
++++++++++++++++++++++++++++++++++++++
history对象
历史记录
history.back();//单击[后退]按钮
history.forward();//单击[前进]按钮
history.go(-2);//单击两次[后退]按钮
++++++++++++++++++++++++++++++++++++++
document对象
文档操作
document.write("");//向页面写入数据
document.writeln("")
document.bgColor='white';//改变背景颜色
属性
返回所有表单组成的数组:forms
返回所有图像组成的数组:images
++++++++++++++++++++++++++++++++++++++
window对象
浏览器窗口
新建窗口
window.open(url,windowName,"name1=value1,...");
关闭窗口
window.close();
延时执行一次
setTimeout("function",time);
隔固定时间执行
setInterval("function",time);
属性
状态栏显示的文本：status
默认状态栏信息：defaultStatus
window.status="mesage";
window.defaultStatus="message";
alert("message");//输出
prompt(message,defaultValue);//输入
confirm("message");//[确认][取消]返回true,false
++++++++++++++++++++++++++++++++++++++
事件
onMouseDown onMouseMove onMouseOut onMouseOver onMouseUp
onFocus onBlur onChange onSelect
onKeyDown onKeyPress onKeyUp
onClick onDblClick
function statusreport() {
var tempx = event.clientX + document.body.scrollLeft;
var tempy = event.clientY + document.body.scrollTop;
status='在整个页面中的X, Y坐标 : ('+tempx+', '+tempy+') ; 在当前窗口中的X, Y坐标 : ( '+event.clientX+', '+event.clientY +')';
}
<body onmousemove="statusreport();">
event对象属性
窗口的x坐标:clientX
窗口的y坐标:clientY
屏幕的x坐标:screenX
屏幕的y坐标:screenY
鼠标按键:button
键盘按键:keyCode
按下shift键:shiftKey
按下alt键:altKey
按下ctrl键:ctrlKey
1)
<script language="javascript" type="text/javascript">
<!--
function asy(){
alert("hello");
}
document.onclick=say;
-->
</script>
2)
<textarea id="" name="content"></textarea>
<script language="javascript" type="text/javascript">
<!--
var txt=document.getElementById("content");
txt.onkeydown=function(evt){
evt=evt?evt:window.event;//兼容浏览器
if(evt.ctrlKey &&13==evt.keyCode)thie.form.submit();
}
-->
</script>
++++++++++++++++++++++++++++++++++++++
表单
获得表单
var myform=document.forms["myform"];
Form对象事件
onsubmit在表单提交之前触发
onreset在表单被重置之前触发
引用表单元素
var element=theForm.elements[idex];
var element=theForm.elements[elementName];
遍历一个表单中的所有表单域
for(var i=0;i<theForm.elements.length;i++){
if("checkbox"==theForm.elements[i].type){}
}
表单域的通用属性
1)创建只读(不可用)表单域
element.disabled=true;
element.disabled=false;
2)获取表单域的值
value
表单域的通用方法
表单域获得焦点：focus()
表单域失去焦点：blur()
表单域的通用事件
onFocus：获得焦点时，产生该事件
OnBlur：失去焦点时，产生该事件
--Onselect：文字被加亮显示后（选择），产生该文件。
onchange：表单域的值改变时
onclick:键盘单击
onkeydown:键盘按下
onkeyup:键盘松开
onkeypress:键盘按下松开
onmouseover:鼠标移上
onmouseout:鼠标移出
onmousedown:鼠标按下
onmouseup:鼠标松开
文本域
获取和设置文本域的内容：value
var a=document.the_form.the_text.value;
获得HTML标记中的value值:defaultValue
选中文本：select
<input type="text" name="" onfocus="this.select()">
复选框
当复选框被选中时checked返回true
document.forms[0].elements[i].checked
<script language="javascript">
function get(){
var a=document.getElementsByName("ck");
var b=a.length;
alert(b);
for(var i=0;i<b;i++){
if(a[i].checked){
alert(a[i].value);
}
}
}
</script>
<input type="checkbox" name="ck" value="10">
<input type="checkbox" name="ck" value="20">
<input type="checkbox" name="ck" value="30">
<input type="button" onclick="get()" value="get ck box">
--------------------
var is_checked=document.the_form.the_checkbox.checked;
if (is_checked == true){
alert("Yup, it's checked!");
}
else{
alert("Nope, it's not checked.");
}
单选按钮
checked属性来获取或设置单选按钮的状态
var is_checked=document.form_1.radio_2.checked;
下拉列表框
使用value属性获取和设置下拉列表框的值
使用length属性获取选项个数
使用selectedIndex属性获取当前选项的索引
使用options属性获取选项集合
option对象的selected属性：选中和未选中
select对象的onchange事件：选中项发生变化时
改变该下列选单中<option>标记中所指定的值
window.document.form_1.pulldown_1.options[1].value = 'new_text';
改变该下列选单中的第2个选项值
window.document.form_1.pulldown_1.options[1].text = 'new_text';
选择一个选项，selectedIndex属性将变成被选项的数组索引号
document.form_1.select_1.selectedIndex = 1;
添加一个选项
document.form_1.select_1.options[slt.length]=new Option("value3","text3");
删除一个选项
document.form_1.select_1.options[0]=null;
清空select对象
document.form_1.select_1.length=0;
替换一个选项
document.form_1.select_1.options[1]=new Option("apple","apple");
表单验证
1）<input type="submit" onclick="return validade()">
2）<form action=""method="" onsubmit="return validate()">
验证文本中否为空：
if(tbusername.value.length==0){
alert("");
return false;
}
验证下拉列表是否为空：
if(sltcity.selectIndex==0){
alert("");
return false;
}
++++++++++++++++++++++++++++++++++++++
类
javascript中，函数和类是一个概念
当对一个函数进行new操作就返回一个对象
function class1(){//定义类
//类成员的定义及构造函数
}
var obj=new class1();
动态添加属性
var user=new object();
user.name="aaa";//添加属性
动态添加方法
user.fun=function(){//添加方法
//代码
}
user.fun();//调用fun方法
动态修改属性和方法
user.name="mm";
user.fun=function(){
}
属性删除属性和方法
user.name=undefined;
user.fun=undefined;
使用{}创建无类型对象
属性名和内容之间用冒号(:)隔开
除最后一个属性（方法）定义，其他的必须以逗号(,)结尾
var obj={};//定义一个空对象
var user={
name:"mm",//定义name属性为mm
acolor:["red","green"],//定义数组
fc:function(){//定义方法
alert("hi");
}
}
prototype原型对象
表示了一个类的成员集合
//定义一个空类
function class1(){
}
//对类的prototype对象修改，增加方法method
class1.prototype.method=function(){
alert("aa");
}
var obj1=new class1();//创建实例
obj1.method();//调用方法
++++++++++++++++++++++++++++++++++++++
类的继承
1）通过拷贝一个类的prototype到另外一个类来实现继续
function class1(){}
function class2(){}
class2.prototype=class1.prototype;
class2.prototype.mor="xx";
class2.prototype.fun=function(){}
var obj=new class2();
++++++++++++++++++++++++++++++++++++++
框架
每个框架都对应一个html页面
框架间互相引用(frames)
window.frames["frameName"];
window.frames.frameName
window.frames[index]
其中window可以用self代替或省略
子框架引用父框架(parent)
改变框架的载入页面(location)
window.frames[0].location="1.html"
引用其他框架内的javascript变量和函数
例：
<frameset cols="20%,80%">
<frame src="link.html" name="link">
<frame src="show.html" name="show">
</frameset>
show.html
<a href="void(0)" onclick="self.parent.link.add(12345)">加入购物车</a>
link.html
var arr=new Array();
function add(id){
arr.push(id);
}
++++++++++++++++++++++++++++++++++++++
cookie
设置cookie
document.cookie="userId=828";
document.cookie="userId=828;userName=hulk";
document.cookie="str="+escape("I love js");
值中有特殊符号时用escape()进行编码
用escape()进行编码的值需用unescape()进行编码后
才能得原来的值
获取cookie值
var strcookie=document.cookie;
var strCookie=document.cookie;
var arrCookie=strCookie.split(";");//分多个cookie
for(var i=0;i<arrCookie.length;i++){
var arr=arrCookie[i].split("=");//分cookie的名和值
}
给cookie设置终止日期(expire)
var date=new Date();
...
document.cookie="id=828; expire="date.toGTMstring();
删除cookie
var date=new Date();
date.setTime(date.getTime-10000);//将date设置为过期时间
document.cookie="id=828; expire="+date.toGTMstring();
++++++++++++++++++++++++++++++++++++++
异常处理
1)try-catch-finally
try{
//要执行的代码
}
catch(e){
//处理异常的代码
}
finally{
无论异常发生与否都会执行的代码
}
2)用throw语句抛出异常
if(){
throw new Error("error");
}
++++++++++++++++++++++++++++++++++++++
DOM
直接引用结点
document.getElementById()
<span id="s1"></span>
var span1=document.getElementById(s1);
span1.innerHTML="hi";
引用指定标记名称的结点
document.getElementsByTagName()
<sapn id="s1"></span>
<sapn id="s2"></span>
var arrspan=document.getElementByTagName("span");
for(var i=0;i<arrspan.length;i++){
arrspan[i].innerHTML="hi";
}
++++++++++++++++++++++++++++++++++++++
Ajax
创建
处理
open
头（缓存）
send
GET
<script language="javascript">
function InitAjax(){
var ajax=false;
try {
ajax = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
ajax = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
ajax = false;
}
}
if (!ajax && typeof XMLHttpRequest!='undefined') {
ajax = new XMLHttpRequest();
}
return ajax;
}
function getNews(newsID){
if (typeof(newsID) == 'undefined'){
return false;
}
var url = "http://127.0.0.1/ajax/get/ajax_get.php?id="+ newsID;
var show = document.getElementById("show_news");
var ajax = InitAjax();
ajax.open("GET", url, true);
ajax.onreadystatechange = function() {
if (ajax.readyState == 4 && ajax.status == 200) {
show.innerHTML = ajax.responseText;
//alert(ajax.responseText);
}
}
ajax.send(null);
}
</script>
POST
<script language="javascript">
var ajaxObj = null;
function getXmlHttp(){
var xmlObj = null;
if(window.XMLHttpRequest)
{
xmlObj = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
xmlObj = new ActiveXObject("Microsoft.XMLHTTP");
}
else
{
xmlObj = new XMLHttpRequest();
}
return xmlObj;
}
function updateDiv()
{
ajaxObj = getXmlHttp();
ajaxObj.onreadystatechange = onStateChange;
ajaxObj.open("GET", "http://127.0.0.1/ajax/json.php", true);
ajaxObj.setRequestHeader('If-Modified-Since', '0');
ajaxObj.send(null);
}
function onStateChange()
{
if(ajaxObj.readyState == 4 && ajaxObj.status == 200)
{
var json = eval('(' + ajaxObj.responseText + ')');
document.getElementById("test").innerHTML = json.t2;
}
}
</script>
JSON
<script language="javascript">
function InitAjax()
{
var ajax=false;
try {
ajax = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
ajax = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
ajax = false;
}
}
if (!ajax && typeof XMLHttpRequest!='undefined') {
ajax = new XMLHttpRequest();
}
return ajax;
}
function post(){
//获取接受返回信息层
var msg = document.getElementById("msg");
//获取表单对象和用户信息值
var f = document.user_info;
var userName = f.user_name.value;
var userAge = f.user_age.value;
var userSex = f.user_sex.value;
//接收表单的URL地址
var url = "http://127.0.0.1/ajax/post/ajax_post.php";
//需要POST的值，把每个变量都通过&来联接
var postStr = "user_name="+ userName +"&user_age="+ userAge +"&user_sex="+ userSex;
//实例化Ajax
var ajax = InitAjax();
//通过Post方式打开连接
ajax.open("POST", url, true);
//定义传输的文件HTTP头信息
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//发送POST数据
ajax.send(postStr);
//获取执行状态
ajax.onreadystatechange = function() {
//如果执行状态成功，那么就把返回信息写到指定的层里
if (ajax.readyState == 4 && ajax.status == 200) {
msg.innerHTML = ajax.responseText;
}
}
}
</script>