Javascript学习笔记之 javascript中的浏览器对象
Javascript 时间处理的 原则为 时间 触发 动作
时间调用多个动作函数时,函数之间用逗号隔开
Javascript常用事件
onclick() 鼠标单击 触发两个动作 submit 和 函数 所以无法阻止表单的提交
onchange() 内容改变 一般用在文本框 和下拉列表
onfocus() 获得焦点
onblur() 失去焦点 对应 onfocusout()
onmouseover() 鼠标经过事件
onmouseont() 鼠标离开事件
onmousemove() 鼠标移动事件
onload() 页面载入事件 用在<body>标签中
onsubmit() 表单提交事件 用在 form标签中 当点击submit按钮後 触发 在做表单验证的时候 如果表单出错 return false 可以是终止表单的提交 多用与客户端验证
onmousedown() 鼠标按下事件
onmouseup() 鼠标弹起事件
onresize() 窗口大小改变
onblur() 时间 可以作出注册 或 登录 表单中 自动判断 格式的效果
function logonDisplay()
{
var name = document.helloForm.emailValue.value; //获得 登录名的值
name=name.substr(0,name.indexOf("@",0)); //取@前的字符
var birthdayYear=document.helloForm.year.value;
var now=new Date();
var day=now.getDay();
switch(day)
{
case 0:day="星期日";break;
case 1:day="星期一";break;
case 2:day="星期二";break;
case 3:day="星期三";break;
case 4:day="星期四";break;
case 5:day="星期五";break;
case 6:day="星期六";break;
}
alert("欢迎光临!/n"+name+"先生/小姐(^_^)");
document.write("今天是"+day+"<br>");
if(now.getYear()-parseInt(birthdayYear)<=20)
{
document.write("<br>欢迎光临 <a href='p209_starname.html'>游戏世界</a>");
}else if(now.getYear()-parseInt(birthdayYear)<=30){
document.write("<br>欢迎光临<a href='p209_myHelloTime.html'>理财专区</a>");
}else{
document.write("<br>欢迎光临<a href='p336_buypaycalc.html'>夕阳红专区</a>");
}
}
function funCheckEmail() //登录邮件检查 用于 emailValue onblur时调用
{
var checkEmail = document.helloForm.emailValue.value; //获得登录窗口的值
if(checkEmail.length==0) //长度不能为0
{
document.helloForm.statusEmail.value="Email地址不能为空!"; //一个readonly border-width:0px的 文本框 用来显示信息 位于 emailValue的后面
document.helloForm.emailValue.focus(); // 重新获得焦点
}else if(checkEmail.indexOf("@",1)==-1 || checkEmail.indexOf(".",1)==-1)
{
document.helloForm.statusEmail.value="Email地址格式不正确!";
document.helloForm.emailValue.focus(); //检查@和 dot 的存在
}else{
document.helloForm.statusEmail.value="Email地址填写正确!"; //格式正确的输出
}
}
function funCheckPwd() //密码检查 用于pwdValue onblur时调用
{
var checkPwd=document.helloForm.pwdValue.value; //获得密码文本框的值
if(checkPwd.length == 0) //长度不能为0
{
document.helloForm.statusPwd.value="密码不能为空!"; //一个readonly border-width:0px的 文本框 用来显示信息 位于 pwdValue的后面
//没有重新获得焦点 防止出现逻辑错误
}else{
document.helloForm.statusPwd.value="";
}
}
function funCheckYear()
{
var checkYear=document.helloForm.year.value;
if(checkYear.length==0)
{
document.helloForm.statusYear.value="年不能为空!";
}else if(isNaN(checkYear)){
document.helloForm.statusYear.value="年必须为数字!";
}else{
document.helloForm.statusYear.value="";
}
}
</script>
JAVASCRIPT浏览器对象
Window对象
属性
Document 文档 history 历史记录 location 地址
Name 窗体名称 screen 客户的屏幕和显示性能 status 浏览器底部状态栏的消息
方法
Alert(); 警告窗 blur() 使对象失去焦点 并触发 onblur()事件
Close() 关闭当前浏览器窗口 open(“url”,”name”,”option”); 打开新窗口 按照窗口特征
Focus() 使对象接受焦点 并触发onfocus()事件
Confirm(); 确认对话框 确定 返回 true 取消 返回 false
setTimeout() 定时器 clearTimeout() 清除定时器对象
open() 方法
窗口特征属性:
Height width 窗口高度 宽度
Top left 上 左 边距
Toolbars 工具栏 menubars 菜单栏 scrollbars 滚动栏 resizable 可控大小
Location 地址栏 statusbars 状态栏
实例
<body>
<input type="button" name="Submit" value="打开窗口" οnclick="window.open('stayTime_p342.html');"/>
<input type="button" name="Submit2" value="打开固定大小窗口,无菜单栏等" οnclick="window.open('stayTime_p342.html','','height=150,width=150,toolbars=0,menubars=0,scrollbars=0,resizable=0,location=0,status=0');"/>
<input type="button" name="Submit3" value="打开全屏窗口" οnclick="window.open('stayTime_p342.html','','fullscreen=1');"/>
<input type="button" name="Submit4" value="全屏" οnclick="window.open(document.location,'','fullscreen=1');"/>
<input type="button" name="Submit5" value="关闭退出" οnclick="window.close();"/>
</body>
Document对象
属性
Alinkcolor 活动链接颜色 bgcolor 背景颜色 body 文档的开始与结束
Linkcolor 文档链接颜色 location 当前url的信息 title 标题 url 当前文档的url
Vlinkcolor 访问过的链接的颜色
方法
Clear() 清除当前文档 close() 关闭输出流 并强制显示发送的数据
Write() 写入文档 会清除当前文档
getElementById(); 根据 ID名称 获得 HTML对象 一般用来操作 层对象
history对象
方法
back() 加载列表中的上一个url forward() 加载 列表中的下一个url
go(url or number) 加载 列表中的 url 或者 移动 指定页面数
location 对象
属性
host 当前主机 和 端口 hostname 主机 名 href 完整url字符串
方法
assign(url) 加载url指定的新文档
reload() 重新加载当前页面 replace(url) 通过加载URL指定的文档替换当前文档