浏览器对象模型

浏览器本身就是一个对象,也是一个对象容器。包含了很多功能独立的小对象。通过JavaScript可以自由操纵这些对象。
 

1 window对象
    window对象是浏览器对象中的默认对象。所以可以隐式地引用window对象的属性和方法.
    window对象表示浏览器中打开的窗口,提供关于窗口状态的信息。可以用window对象访问窗口中绘制的文档、窗口中发生的事件和影       响窗口的浏览器特性。
   浏览器在打开HTML文档时生成window对象。如果文档定义一组帧,则浏览器对原文档生成 一个window对象,并对每个帧生成window对  象。 这些对象是原父窗口的子窗口。父窗口中的动作会影响子窗口:例如,如果关闭父窗口,则子窗口也关闭。也可以通过用     showModalDialog方法, 生成新窗口,从而生成新的window对象。 
 
属性  作用 
client 保存浏览器版本与名称信息及其启用特性的信息
closed 窗口关闭时返回(true表示窗口关闭,否则为false)
defaultStatus 提供窗口状态条中显示的缺省消息
dialogArguments 返回从主窗口传递给模态对话框的变量或变量数组
dialogHeight 返回对话框的高度
dialogLeft 返回对话框左边坐标
dialogTop 返回对话框上边坐标
dialogWidth 返回对话框的宽度
document 提供窗口的文档对象引用
event 提供窗口的事件对象引用
history 提供窗口的历史对象引用
length 提供集合中的元素个数
location 提供文档的URL
name 指定窗口或帧的名称
navigator 提供窗口的浏览器对象引用
offscreenBuffering 指定是否对文档使用屏外缓冲
opener 提供生成当前窗口的窗口引用
parent 返回父窗口:对于通过FRAME生成的窗口,父窗口是FRAMESET元素所在的窗口
returnValue 指定从模态对话框返回主窗口的数值
screen 提供窗口的屏幕对象引用
self 提供引用当前窗口或帧的办法
status 设置或返回窗口底部状态条中的消息
top 返回最上层窗口对象,它是自己的父对象
window 提供当前窗口的引用,与self相同
 
方法  作用 
alert 显示带消息和OK按钮的alert对话框
blur 使对象失去焦点并激活onBlur事件
clearInterval 取消由setInterval启动的间隔
clearTimeout 取消由setTimeout设置的超时
close 关闭当前浏览器窗口
confirm 显示带消息和OK按钮及Cancel 按钮的确认对话框
execScript 执行指定的脚本
focus 使控件取得焦点并执行由onFocus事件指定的代码
navigate 显示某个URL,只用于VBScript
open 打开新窗口并装入指定URL文档
prompt 显示带消息和输入字段的提示对话框
scroll 相对于整个文档冼窗口滚动指定X和Y偏离量
setInterval 在指定毫秒数后重复求值一个表达式
setTimeout 在指定毫秒数后求值一个表达式
showHelp 显示指定URL的帮助文件
showModalDialog 将HTML文档作为模态对话框打开

事件  发生时
onBeforeunload 页面删除之前。这个事件可以让用户不离开页面。可以用脚本编一个事件处理器,显示一个对话框,让用户选择不离开页面
onBlur 对象失去焦点时
onError 装入文档或图形发生错误时
onFocus 对象取得焦点时
onHelp 用户按F1键或单击浏览器Help按钮时
onLoad 浏览器打开指定对象之后
onResize 窗口调整尺寸时
onScroll 滚动框移动时
onUnload 页面删除之前

2 document
 document是文档对象,提供了许多用于访问文档中所包含HTML元素的属性。
对象属性
document.title             //设置文档标题等价于HTML的<title>标签
document.bgColor           //设置页面背景色
document.fgColor           //设置前景色(文本颜色)
document.linkColor         //未点击过的链接颜色
document.alinkColor        //激活链接(焦点在此链接上)的颜色
document.vlinkColor        //已点击过的链接颜色
document.URL               //设置URL属性从而在同一窗口打开另一网页
document.fileCreatedDate   //文件建立日期,只读属性
document.fileModifiedDate  //文件修改日期,只读属性
document.fileSize          //文件大小,只读属性
document.cookie            //设置和读出cookie
document.charset           //设置字符集 简体中文:gb2312
---------------------------------------------------------------------
对象方法
document.write()                  //动态向页面写入内容
document.createElement(Tag)       //创建一个html标签对象
document.getElementById(ID)       //获得指定ID值的对象
document.getElementsByName(Name)  //获得指定Name值的对象
---------------------------------------------------------------------

images集合(页面中的图象)

a)通过集合引用
document.images             //对应页面上的<img>标签
document.images.length      //对应页面上<img>标签的个数
document.images[0]          //第1个<img>标签          
document.images[i]          //第i-1个<img>标签

b)通过nane属性直接引用
<img name="oImage">
document.images.oImage      //document.images.name属性

c)引用图片的src属性
document.images.oImage.src  //document.images.name属性.src

d)创建一个图象
var oImage
oImage = new Image()
document.images.oImage.src="/1.jpg"
同时在页面上建立一个<img>标签与之对应就可以显示

<html>
<img name=oImage>
<script language="javascript">
   var oImage
   oImage = new Image()
   document.images.oImage.src="/1.jpg"
</script>
</html>

----------------------------------------------------------------------

forms集合(页面中的表单)

a)通过集合引用
document.forms                 //对应页面上的<form>标签
document.forms.length          //对应页面上<form>标签的个数
document.forms[0]              //第1个<form>标签
document.forms[i]              //第i-1个<form>标签
document.forms[i].length       //第i-1个<form>中的控件数
document.forms[i].elements[j]  //第i-1个<form>中第j-1个控件

b)通过标签name属性直接引用
<form name="Myform"><input name="myctrl"></form>
document.Myform.myctrl         //document.表单名.控件名

-----------------------------------------------------------------------
<html>
<!--Text控件相关Script-->
<form name="Myform">
<input type="text" name="oText">
<input type="password" name="oPswd">
<form>
<script language="javascript">
//获取文本密码框的值
document.write(document.Myform.oText.value)
document.write(document.Myform.oPswd.value)
</script>
</html>
-----------------------------------------------------------------------
<html>
<!--Select控件相关Script-->
<form name="Myform">
<select name="oSelect">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</form>

<script language="javascript">
   //遍历select控件的option项
   var length
   length=document.Myform.oSelect.length
   for(i=0;i<length;i++)
   document.write(document.Myform.oSelect[i].value)
</script>

<script language="javascript">
   //遍历option项并且判断某个option是否被选中
   for(i=0;i<document.Myform.oSelect.length;i++){
   if(document.Myform.oSelect[i].selected!=true)
   document.write(document.Myform.oSelect[i].value)
   else
   document.write("<font color=red>"+document.Myform.oSelect[i].value+"</font>")  
   }
</script>

<script language="javascript">
   //根据SelectedIndex打印出选中的option
   //(0到document.Myform.oSelect.length-1)
   i=document.Myform.oSelect.selectedIndex
   document.write(document.Myform.oSelect[i].value)
</script>

<script language="javascript">
   //动态增加select控件的option项
   var oOption = document.createElement("OPTION");
   oOption.text="4";
   oOption.value="4";
   document.Myform.oSelect.add(oOption);
</script>
<html>
-----------------------------------------------------------------------
<Div id="oDiv">Text</Div>
document.all.oDiv                       //引用图层oDiv
document.all.oDiv.style                
document.all.oDiv.style.display=""      //图层设置为可视
document.all.oDiv.style.display="none"  //图层设置为隐藏
/*document.all表示document中所有对象的集合
只有ie支持此属性,因此也用来判断浏览器的种类*/
 
3 history对象
  history对象保存当前对话中用户访问的URL信息。它的length属性提供浏览器历史清单中的项目个数。它的方法如表所示,可用于在历   史清单中移动。
 
方法  作用 
Back 装入历史清单中上一个URL的文档
Forward 装入历史清单中下一个URL的文档
Go 装入历史清单中指定位置的文档
   
4 location对象
   location对象提供当前页面的URL信息。它的方法可以重装当前页面或装入新页面。表列出了location对象的属性和方法。
 
属性  作用
Hash 返回HREF中#号后面的字符串
Host 提供URL的hostname:port部分
Hostname 提供URL的hostname部分
Href 提供整个URL
Pathname 提供URL中第三个斜杠后面的文件名
Port 返回URL的端口号
Protocol 返回表示URL访问方法的首字母子串
Search 提供完整URL中?号后面的查询字符串 
   
5 navigator对象
   navigator对象保存浏览器厂家、版本和功能的信息,共五个属性。 
 
属性  作用
AppCodeName 提供浏览器的代码名
AppName 提供浏览器的产品名
AppVersion 提供浏览器的版本号
CookieEnabled 表示浏览器是否允许客户机方Cookie
UserAgent 作为HTTP协议的一部分发送的浏览器名
   
6 screen对象
    screen对象的属性保存最终用户的屏幕分辨率和屏幕绘制文档的功能的信息。这个信息在设置浏览器窗口的特征时或要选择几个图形     这一以充分利用和最终用户的屏幕特性时很有用。表列出了screen对象的属性。
 
属性  作用
colorDepth 返回用户系统支持的最大颜色个数信息
height 提供用户屏幕的总高度
pixelDepth 提供系统每个象素占用的位数
updateInterval 保持用户机器上屏幕更新的间隔
width 提供用户屏幕的总宽度  

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值