DOM节点层次 Document类型

最新推荐文章于 2024-01-03 21:17:33 发布

易安sparkle

最新推荐文章于 2024-01-03 21:17:33 发布

阅读量290

点赞数

分类专栏： js 文章标签： js

本文链接：https://blog.csdn.net/weixin_43675447/article/details/86683575

版权

js 专栏收录该内容

56 篇文章 3 订阅

订阅专栏

在浏览器中，document对象是HTMLDocument的一个实例，表示整个HTML页面。而且，document对象是window对象的一个属性，因此可以将其作为全局对象来访问。
1.Document节点的特征

nodeType的值为9；
nodeName的值为“#document”；
nodeValue的值为null；
parentNode的值为null；
ownerDocument的值为null；
其子节点可能是一个DocumentType（最多一个）、Element（最多一个）、ProcessingInstruction或Comment

2.文档的子节点
Document节点的子节点可以是DocumentType、Element、ProcessingInstruction或Comment,还有两个内置的访问其子节点的快捷方式。
第一个是documentElement属性，该属性始终指向HTML页面中的< html >元素；另一个是通过childNode列表访问文档元素。
例：

<html>
    <body>

    </body>
</html>

文档中只包含一个子节点，即< html >元素：

var html=document.documentElement;   //取得对<html>的引用
alert(html===document.childNodes[0]);
alert(html===document.firstChild);

document对象还有一个body属性，直接指向< body >元素：

var body=document.body;  //取得对<body>的引用

Document另一个可能的子节点是DocumentType。通常将<!DOCTYPE>标签看成一个与文档其他部分不同的实体，通过doctype属性访问其信息：

var doctype=document.doctype;  //取得对<!DOCTYPE>的引用

3.文档信息
（1）title

//取得文档标题
var orj=document.title;
//设置文档标题
document.title="New page title";

(2)对网页的请求

//取得完整的URL
var url=document.URL;
//取得域名
var domain=document.domain;
//取得来源页面的URL
var referrer=document.referrer;

4.查找元素
getElementById():接受一个参数，即要取得的元素ID。若找到相应的元素则返回该元素，若不存在则返回null。
getElementsByTagName():接受一个参数，即要取得元素的标签名，而返回的是包含零或多个元素的NodeLIst
5.特殊集合

document.anchors,包含文档中所有带name特征的< a >元素；
document.applets,包含文档中所有的< applet >元素；
document.forms,包含文档中所有的< form >元素，与documet.getElementByTagName(“form”)得到的结果相同；
document.images,包含文档中所有< img >元素，与document.getElementByTagName(“img”)得到的结果相同；
document.links,包含文档中所有带href特性的< a >元素
6.文档写入
（1）write()
接受一个字符串参数，即要写入到输出流中的文本；原样写入
例1：在页面被加载的过程中，可使用该方法向页面动态地加入内容

<p>The current date and time is:
    <script>
        document.write("<strong>"+(new Date()).toString()+"</strong>")
    </script>
</p>

如上，在页面加载过程中输出当前日期和时间，日期被包含在一个< strong >元素中，就像在HTML页面中包含一个普通文本一样。这样做会创建一个DOM元素，可在将来访问该元素。
例2：动态地包含外部资源

<script>
    document.write("<script src='file.js'>"+"<\/script>")
</script>

注意，若直接包含字符串“< /script >”,这会导致该字符串被解释为脚本块的结束，后面代码将无法执行，因此需加入转义字符\n即可。
例3：在文档加载结束后再调用该方法，那么输出的内容将会重写整个页面

window.function(){
   document.write("Hello world!");                                                                                                   
}

（2）writeln()
接受一个字符串参数，即要写入到输出流中的文本；在字符串末尾添加一个换行符（\n）
（3）open()
打开网页的输出流
（4）close()
关闭网页的输出流

易安sparkle

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
DOM节点层次 Document类型

1.文档的子节点Document节点的子节点可以是DocumentType、Element、ProcessingInstruction或Comment,还有两个内置的访问其子节点的快捷方式。第一个是documentElement属性，该属性始终指向HTML页面中的&amp;amp;amp;lt; html &amp;amp;amp;gt;元素；另一个是通过childNode列表访问文档元素。例：&amp;amp;amp;lt;html&amp;amp;amp;
复制链接

扫一扫