Javascript学习--------文档对象(document)

文档对象(document)概述:

    代表浏览器窗口中的文档,该对象是window对象的子对象。

    (由于window对象是DOM对象模型中的默认对象,

      所以window对象中的方法和子对象不需要使用window来引用)

    通过document可以访问HTML文档中包含的任何HTML标记,并可以动态的改变HTML标记中的内容。


document 对象的集合

集合 描述
all[] 提供对文档中所有 HTML 元素的访问。
anchors[] 返回对文档中所有 Anchor 对象(即链接对象:a)的引用。
applets 返回对文档中所有 Applet 对象的引用。
forms[] 返回对文档中所有 Form 对象引用。
images[] 返回对文档中所有 Image 对象引用。
links[] 返回对文档中所有 Area 和 Link 对象引用。

注1:all[] 已经被 Document 接口的标准的 getElementById() 方法和 getElementsByTagName() 方法以及 Document 对象的 getElementsByName() 方法所取代。

注2:返回文档中的链接数目 :document.anchors.length

     选择第i个链接 :document.anchors[i]

注3:images[]:为了与 0 级 DOM 兼容,该集合不包括由 <object> 标记定义的图像。


document 对象的属性

属性 描述
body

提供对 <body> 元素的直接访问。

对于定义了框架集的文档,该属性引用最外层的 <frameset>。

cookie 设置或返回与当前文档有关的所有 cookie。
domain 返回当前文档的域名。
lastModified 返回文档被最后修改的日期和时间。
referrer 返回载入当前文档的文档的 URL。
title 返回当前文档的标题。
URL 返回当前文档的 URL。


document 对象的方法

方法 描述
close() 关闭用 document.open() 方法打开的输出流,并显示选定的数据。
getElementById() 返回对拥有指定 id 的第一个对象的引用。
getElementsByName() 返回带有指定名称的对象集合。
getElementsByTagName() 返回带有指定标签名的对象集合。
open() 打开一个流,以收集来自任何 document.write() 或 document.writeln() 方法的输出。
write() 向文档写 HTML 表达式 或 JavaScript 代码。
writeln() 等同于 write() 方法,不同的是在每个表达式之后写一个换行符。

open()语法:

   document.open([mimetype],[replace]) 

参数 描述
mimetype 可选。规定正在写的文档的类型。默认值是 "text/html"。
replace 可选。当此参数设置后,可引起新文档从父文档继承历史条目。

用法 :

      用open()打开一个文档,

        write()或writeln()来写文档,

        close()关闭文档

示例:

<html>
<head>
<script type="text/javascript">
function createNewDoc()
  {
  var newDoc=document.open("text/html","replace");
  var txt="<html><body>学习非常有趣!</body></html>";
  newDoc.write(txt);
  newDoc.close();
  }
</script>
</head>

<body>
<input type="button" value="打开并写入一个新文档" onclick="createNewDoc()">
</body>

</html>


拓展:动态添加一个HTML标记

      方法:document.creatElement(sName);

示例:

       //动态创建一个HTML元素
       
       function createButton(){
       
        var
           btn = document.createElement("input");
           
        btn.type = "button";
        
        btn.value = "new button";
        
        document.creatform.appendChild(btn);
        
       }


你可能感兴趣的:(JavaScript,document)