首页 > 代码库 > DOM 4
DOM 4
1. ***HTML DOM常用对象:
Form
2. BOM
1. ***HTML DOM常用对象:
Form: 代表一个<form元素
获取: var form=document.forms[i/id/name];
属性: .length: 相当于form.elements.length
方法: .submit() : 专用于手动提交表单
问题: 用户可能按回车，自动提交
解决: 表单提交的最后一关是一个事件
form.onsubmit(): 当表单正式提交前自动触发
获取*表单*元素:
var elem=form.elements[i/id/name];
更简化: 如果表单元素有name属性:
form.name
方法: .focus() : 让当前表单元素获得焦点
1. ***BOM
window
打开关闭窗口
窗口大小和位置
定时器
1. ***BOM:
什么是: Browser Object Model
专门操作浏览器窗口的API —— 没有标准
DHTML对象模型:
window 2个角色:
1. 代替global作为全局作用域对象
所有全局函数和全局变量都是window的成员
2. 封装所有DOM和BOM的API
包括:
history 当前窗口打开后成功访问的历史记录
location 当前窗口正在打开的URL
document DOM树的根节点，包含所有网页内容
screen 当前显示设备的信息
navigator 浏览器的配置信息(版本，名称，插件，cookie)
event 定义了浏览器中所有事件
window: 指代当前浏览器窗口对象
打开和关闭窗口
打开: open("url","name")
关闭: close();
打开一个连接，共有几种方式：
1. 在当前窗口打开, 可后退:
html: <a href="http://www.mamicode.com/url" target="_self">
js: open("url","_self");
2. 在当前窗口打开, 禁止后退:
js: location.replace("url")
在当前窗口打开新url，用新url替换history中原有url
原理:
history: 保存当前窗口打开后成功访问过的url的历史记录栈
3. 在新窗口打开，可打开多个:
html: <a href="http://www.mamicode.com/url" target="_blank">
js: open("url","_blank");
4. 在新窗口打开，只能打开一个:
html:<a href="http://www.mamicode.com/url" target="name">
js: open("url","name");
每个窗口都有一个唯一的name属性
name: 在内存中唯一标识一个窗口的名称
规定: 同时只能打开一个相同name的窗口
预定义: _self : 和当前窗口使用相同的name
_blank: 不指定自定义name，由浏览器随机分配
窗口大小和窗口位置: (了解)
窗口大小:
1. 完整窗口大小: window.outerWidth/outerHeight
***2. 文档显示区大小: window.innerWidth/innerHeight
调整: 2个机会:
1. 在打开窗口时，就规定大小:
var config="left=?,top=?,width=?,height=?";
open("url","name",config)
2. 打开窗口后再调整——被禁用
window.resizeTo(width,height)
window.resizeBy(width增量,height增量)
窗口位置: 窗口左上角距屏幕左上角的位置
window.screenLeft|screenX
window.screenTop|screenY
调整:
moveTo(left,top)
moveBy(left的增量,top的增量)
*****定时器:
什么是: 让程序按照指定时间执行一项任务
何时:
1. 让程序每隔一段时间间隔反复执行一项任务——周期性
2. 让程序等待一段时间后自动执行一次任务——一次性
如何:
周期性定时器: 3件事:
1. 任务函数task
2. 启动定时器: 将task放入定时器中，设定时间间隔
timer=setInterval(task, ms);
timer是唯一标识一个定时器实例的序号
强调: task不能加()，因为是传递给定时器去回调执行
3. 停止定时器:
clearInterval(timer);
问题: 定时器往往需要自动停止
解决: 在*任务函数*中判断临界值
如果未达到临界值，继续执行任务
否则 停止定时器
一次性定时器: 先等待，再执行一次，然后自动释放
3件事:
1. 任务函数task
2. 启动定时器: 将task放入定时器中，设定等待时间
timer=setTimeout(task, ms);
3. 停止定时器: （其实是在执行之前，停止等待）
clearTimeout(timer);
定时器原理:
定时器中的回调函数，必须在主程序所有语句执行完最后才能开始执行！
DOM 4