浏览器对象
•
窗口对象(Window)
–
Window对象处于对象层次的最顶端，它提供了处理浏览器窗口的方法和属性。
–
•
位置对象(Location)
–
Location对象提供了与当前打开的URL一起工作的方法和属性，它是一个静态的对象。
•
历史对象(History)
–
History对象提供了与历史清单有关的信息。
•
文档对象(Document)
–
document对象包含了与文档元素(elements)一起工作的对象，它将这些元素封装起来供编程人员使用。这是我们主要使用的对象，实际上，js是把所有的html元素（也就是所有标签）视为对象，比如一个<div>就是一个div对象。而这些对象都从属于document对象
•
各种浏览器对象形成了一种层次模型，我们称其为文档对象模型（Document Object Model），简称DOM
浏览器对象的引入方式
•
通过文档对象模型中的层次关系引用
–
例如：在引用forms对象时，使用 window.document.forms
•
数组型浏览器对象的引用
–
在文档对象模型中，有些对象属于数组型对象，如document对象下一层的images、links、forms等对象，在引用这种数组对象时，可以使用对象在数组中的位置(下标)来引用
–
例如：window.document.forms[0]，表示引用文档中的第一个表单。
•
注：
–
Window对象作为文档对象模型中的最顶层对象，JavaScript认为它是默认的，因此可以不写出来。如：window.document.forms可以写成document.forms
–
例如
document.forms[1].submit()
，就是让第二个表单进行提交
•
通过对象的name属性来引用
–
例如：引用一个name属性是form1的表单对象，使用window.document.form1。
–
或代码：document.getElementsByName(“form1”)。
获取到所有name是form1的标签组成的一个对象数组
注意：IE中这个方法可能无效
•
通过对象的id属性来引用
–
例如：document.getElementById(“myid”)得到的是id为myid的表单对象
–
注意，方法名是getElementById，而不是Elements，注意最后的S
–
推荐使用此方法。注意要使用此方法必须保证id的唯一性
•
通过标签名来引用
document.getElementsByTagName(“标签名”)
例如标签名写div，就会获取到所有div组成的一个对象数组
浏览器对象的属性
•
标签被视为浏览器对象，我们自然可以引用和改变对象的属性。引用属性的方法就是对象后面加上点和属性名。例如：
document.getElementById(“myid”)
.width=
“
100px
”
;
标签的width属性被改变为100px
•
标签的样式也是它的属性，同样可以改变，例如：
var tag=document.getElementById(“myid
tag
.style.
backgroundColor
=
“
#AAA
”
;
标签的样式中的背景颜色被改变为代码AAA表示的颜色。
需要注意的是，样式属性的名字并不是完全跟
css
里写法一样，例如
background-color
属性，在
js
代码中要写成
backgroundColor
具体哪种属性在
js
中怎么写，可查阅
css
帮助手册
•
标签对象还有一些隐含的属性，js默认赋予的。例如tagName，表示该标签的类型。一个div标签对象，它的tagName属性的值就是div
•
outerHTML、innerHTML、innerText属性
•
这三个属性分别代表了：
outerHTML：标签对象本身及其内部所有内容，包括其他标签
innerHTML：标签对象内部所有内容，包括其他标签
innerText：标签对象内部所有
文本
下图以一个
div
为例，演示了这三个属性的范围区别
•
浏览器对象是可以自己定义属性的，例如：
<div myattr=“abc” id=“md”></div>
•
给这个div标签定义了一个叫myattr的属性，并赋值为abc
•
通过代码
document.getElementById(“md”)
.
myattr
可以获取到这个自定义属性的值，也就是abc。当然也可以通过直接赋值来改变它
•
注意：不同浏览器对自定义属性的支持程度不同
浏览器对象的一般方法
•
focus ()方法，让一个标签获取焦点，例如：
document.getElementById(“md”).
focus();
调用了id为”md”的标签的focus方法，结果是该标签被选中
•
submit()方法，仅限表单对象，效果如同按下提交按钮
•
reset ()方法，仅限表单对象，效果如同按下重置按钮
windows对象的方法
•
setInterval ()方法，定时调用函数。通常用window对象调用，当然window可以省略不写。语法是：
setInterval(
“
函数名
()
”
,
间隔时间
)
间隔时间的单位是毫秒，例如：var end = setInterval(“clock()”, 500)
意思是每隔500毫秒调用一次clock()方法。这效果类似java的线程。
你可以多次使用该方法，从而启动多个线程。
该方法的返回值是该线程的编号，范例中用名叫end的变量接收了。
•
clearInterval(线程编号)方法，结束setInterval ()方法启动的线程。如上述范例，当想要结束这个线程，就可以调用
•
window. clearInterval(end)
同样的，window可以省略不写
Window对象也就是窗口对象，处于文档对象模型的最顶层，代表当前浏览器窗口。
•
主要介绍两个方法：
–
open(“url”, [“window name”[, “features表”]])
功能：打开一个新的窗口
参数说明：
–
url:要打开窗口的url地址
–
Window name是新打开窗口的名称
–
Window features 是新窗口的实际特性（窗口的外观）可选项
Window features的可能参数：
–
height 窗口的高度
–
width 窗口的宽度
–
menubar是否有菜单
–
scrollbars 是否有滚动条
–
resizable 窗口大小是否可以改变
–
close()
功能：关闭窗口
•
介绍：Window对象也就是窗口对象，处于文档对象模型的最顶层，代表当前浏览器窗口。
•
主要介绍两个方法：
–
open(“url”, [“window name”[, “features表”]])
功能：打开一个新的窗口
参数说明：
–
url:要打开窗口的url地址
–
Window name是新打开窗口的名称
–
Window features 是新窗口的实际特性（窗口的外观）可选项
Window features的可能参数：
–
height 窗口的高度
–
width 窗口的宽度
–
menubar是否有菜单
–
scrollbars 是否有滚动条
–
resizable 窗口大小是否可以改变
–
close()
功能：关闭窗口
window的三种对话框方法
•
alert()方法弹出一个显示信息的警示对话框
alert("
您好
")
•
confirm()方法 弹出带有提示信息的确认对话框，根据点击返回逻辑值
flag=confirm("
确认删除吗
?")
•
prompt()方法弹出一个带有输入信息的对话框，返回所输入的值
name=prompt("
请输入你的名字
")
document对象的方法
•
document对象是JavaScript实现网页各种功能中最常用的基本对象之一，它代表浏览器窗口中的文档，可以用来处理文档中包含的html元素，如表单，图像，超 链接等。
•
write()
–
作用：向文档中写入文本