document对象的属性非常多,但是大多数都是没什么用的,下表只列出比较常用的属性(其他没列出的暂时不用管)。
document对象常用的属性
属性
说明
document.title
获取文档的title
document.body
获取文档的body
document.forms
获取所有form元素
document.images
获取所有img元素
document.links
获取所有a元素
document.cookie
文档的cookie
document.URL
当前文档的URL
document.referrer
返回使浏览者到达当前文档的URL
在上表中,有以下3点需要大家注意。
(1)document.title和document.body这两个我们在“9.4 获取元素”这一节已经介绍过了,这里不再赘述。
(2)document.forms、document.images、document.links这3个分别等价于下面3个,所以我们一般用document.getElementsByTagName来获取就行了,不需要去记忆。
document.getElementsByTagName("form")
document.getElementsByTagName("img")
document.getElementsByTagName("a")
(3)cookie一般结合后端技术操作中用得比较多,document.cookie单纯在前端中用得也不是非常多,我们简单看一下就行。
下面我们来介绍一下document.URL和document.referrer。
一、document.URL
在JavaScript中,我们可以使用document对象的URL属性来获取当前页面的地址。
语法:
document.URL
举例:
在线测试
var url = document.URL;
document.write("当前页面地址是:" + url);
浏览器预览效果如图所示.
分析:
document.URL和window.location.href都可以获取当前页面的URL,不过它们也有区别:document.URL只能获取不能设置;window.location.href既可以获取也可以设置。
二、document.referrer
在JavaScript中,我们可以使用document对象的referrer属性来获取用户在访问当前页面之前所在页面的地址。例如我从页面A的某个链接进入页面B,如果在页面B中使用document.referrer,就可以获取到页面A的地址。
document.referrer非常酷,因为我们可以通过它来统计用户都是通过什么方式来到你的网站的。
我们可以建立两个页面,然后在第1个页面设置一个超链接指向第2个页面。当我们从第1个页面超链接进入第2个页面时,在第2个页面使用document.referrer就可以获取第1个页面的地址了。对于这个效果,小伙伴们自行在本地编辑器测试一下,很简单。