使用Ajax 编程最常用的功能之一就是处理页面文档,例如向页面写入信息,创建新的结点,获取表单信息等。这些都可以使用document对象来完成,他表示页面文档本身。document对象是从浏览器中引入javascript开始就提供的一种对象,它同样是window对象的一个子对象。随着浏览器的发展,document对象提供的功能也越来越多。
document对象在设计之初用来操作页面文档,但有些功能已经不再推荐使用,例如:改变背景色,改变前景色,改变超链接的效果等。取而代之的是使用DOM模型和CSS来实现这些效果,下面介绍必须使用document对象实现或用document对象可以更方便实现的功能。
document对象的属性
属性 描述
anchors 返回文档中所有的书签标记(<a name>)组成的数组
cookie 返回或者设置cookie
domain 返回或者设置文档的默认域名
embeds 返回文档中所有嵌入对象(<embed>)组成的数组
forms 返回文档中所有表单组成的数组
images 返回文档中所有图像(<img>)组成的数组
lastModified 返回文档最后一次修改日期
links 返回文档中所有链接(<a href>)组成的数组
location 返回或者设置文档的地址,和window.location对象具有同样的作用。
referrer 返回用户访问当前页面来源页面的地址,例如用户通过page1.html上的链接到达page2.html,
则在page2.html中使用 referrer属性可以得到page1.html的地址,常用于网页访问统计的来源
分析。当用户四直接在地址栏中输入地址或者使用收藏夹访问时,则返回空字符串
title 返回或设置文档的标题
URL 返回或设置文档的地址
1.使用集合属性
document对象不仅包含了文档本身的一些属性,还包括了几个重要的集合属性:anchors,forms,images,links.它们是文档中特定标记的集合,通过document对象的这些属性,可以很方便地引用这些集合,从而能通过循环遍历对它们进行处理。
(1)anchors属性
书签标记用于一个页面内的跳转位置,当一个页面很长时,这个属性很实用。anchors属性就是用于返回页面文档中所有书签标记(<a name>)组成的数组,而不管它们的结点层次。
例如打印出页面中所有的书签标记的名称:
for(var i=0;i<document.anchors.length;i++)
{
document.write(document.anchors[i].name);
document.write("<br/>");
}
(2)forms属性
forms属性用于返回一个页面中所有表单组成的数组。例如:一个页面中仅有一个表单,则可以通过document.forms[0]直接引用。
(3)images属性
使用images属性可以很方便地引用一个页面中所有的图片标记,从而对它们进行一些通用的处理。例如一个网站可能允许用户提交图片,但又限制图片的大小,如果超过某个尺寸,将按比例缩小至指定的值。如:控制页面所有的图片宽度都不超过400像素:
var imgs=document.images;
for(var i=0 ;i<imgs.length;i++)
{
if(imgs[i].offsetWidth>400)
{
var ht=imgs[i].offsetWidth*490/ims[i].offsetWidth;
imgs[i].style.height=ht+"px";
imgs[i].style.width="490px";
}
}
(4)links属性
该属性返回页面中所有链接标记组成的数组,同样可以用于进行一些通用的链接标记处理。例如在WEB标准的strict模式下,链接标记的target属性是被禁止的,如果使用则无法通过W3C关于网页标准的验证。若要在符合strict标准的页面中能够让链接在新建窗口中打开,可以使用如下代码;
var links=document.links;
for(var i=0;i<links.length;i++)
{
links[i].target="_blank";
}
当然,这种方法是通过非常规的手段(长称为hack)来绕过Web标准,并不推荐。
2.向页面写入数据
使用document对象的write方法,可以向页面直接写入信息。这些写入的文本以Html的形式被浏览器解析并显示于页面,如果要显示一些特殊字符,必须写入转义后的字符串,例如:document.write("<")用于在页面显示一个左尖括号(<)。
document.write方法的一般形式是:document.write(stirng1,[string2[,...]])
document的writeln方法,用于向页面写入一行文本。
document对象在设计之初用来操作页面文档,但有些功能已经不再推荐使用,例如:改变背景色,改变前景色,改变超链接的效果等。取而代之的是使用DOM模型和CSS来实现这些效果,下面介绍必须使用document对象实现或用document对象可以更方便实现的功能。
document对象的属性
属性 描述
anchors 返回文档中所有的书签标记(<a name>)组成的数组
cookie 返回或者设置cookie
domain 返回或者设置文档的默认域名
embeds 返回文档中所有嵌入对象(<embed>)组成的数组
forms 返回文档中所有表单组成的数组
images 返回文档中所有图像(<img>)组成的数组
lastModified 返回文档最后一次修改日期
links 返回文档中所有链接(<a href>)组成的数组
location 返回或者设置文档的地址,和window.location对象具有同样的作用。
referrer 返回用户访问当前页面来源页面的地址,例如用户通过page1.html上的链接到达page2.html,
则在page2.html中使用 referrer属性可以得到page1.html的地址,常用于网页访问统计的来源
分析。当用户四直接在地址栏中输入地址或者使用收藏夹访问时,则返回空字符串
title 返回或设置文档的标题
URL 返回或设置文档的地址
1.使用集合属性
document对象不仅包含了文档本身的一些属性,还包括了几个重要的集合属性:anchors,forms,images,links.它们是文档中特定标记的集合,通过document对象的这些属性,可以很方便地引用这些集合,从而能通过循环遍历对它们进行处理。
(1)anchors属性
书签标记用于一个页面内的跳转位置,当一个页面很长时,这个属性很实用。anchors属性就是用于返回页面文档中所有书签标记(<a name>)组成的数组,而不管它们的结点层次。
例如打印出页面中所有的书签标记的名称:
for(var i=0;i<document.anchors.length;i++)
{
document.write(document.anchors[i].name);
document.write("<br/>");
}
(2)forms属性
forms属性用于返回一个页面中所有表单组成的数组。例如:一个页面中仅有一个表单,则可以通过document.forms[0]直接引用。
(3)images属性
使用images属性可以很方便地引用一个页面中所有的图片标记,从而对它们进行一些通用的处理。例如一个网站可能允许用户提交图片,但又限制图片的大小,如果超过某个尺寸,将按比例缩小至指定的值。如:控制页面所有的图片宽度都不超过400像素:
var imgs=document.images;
for(var i=0 ;i<imgs.length;i++)
{
if(imgs[i].offsetWidth>400)
{
var ht=imgs[i].offsetWidth*490/ims[i].offsetWidth;
imgs[i].style.height=ht+"px";
imgs[i].style.width="490px";
}
}
(4)links属性
该属性返回页面中所有链接标记组成的数组,同样可以用于进行一些通用的链接标记处理。例如在WEB标准的strict模式下,链接标记的target属性是被禁止的,如果使用则无法通过W3C关于网页标准的验证。若要在符合strict标准的页面中能够让链接在新建窗口中打开,可以使用如下代码;
var links=document.links;
for(var i=0;i<links.length;i++)
{
links[i].target="_blank";
}
当然,这种方法是通过非常规的手段(长称为hack)来绕过Web标准,并不推荐。
2.向页面写入数据
使用document对象的write方法,可以向页面直接写入信息。这些写入的文本以Html的形式被浏览器解析并显示于页面,如果要显示一些特殊字符,必须写入转义后的字符串,例如:document.write("<")用于在页面显示一个左尖括号(<)。
document.write方法的一般形式是:document.write(stirng1,[string2[,...]])
document的writeln方法,用于向页面写入一行文本。