document文档节点

概述:

document节点对象是文档的根节点,每张网页都有自己的document对象

document节点的属性

document.doctype获取octype节点
var doctype=document.doctype;
doctype //<!DOCTYPE html>
document.name //“html”
如果该网站没有声明文档类型。则返回null
示例:
image.png
document.documentElement属性返回当前文档的根节点。

一般是html

docment.body/document.head返回文档中的body/head节点。

这两个属性总是存在的,如果省略了<head>或<body>,浏览器会自动创建

document.links属性返回当前文档所有设定了href属性的<a>及<area>节点。
//打印文档所有的链接
var links =document.links
for(var i=0;i<links.length;i++){
console.log(links[i])
}
示例:
image.png
结果:
image.png
document.forms返回当前文档所有的form表单节点
 /* HTML代码如下:*/
 <form name=“foo” id=“bar”></form>
 document.forms[0]===document.forms.foo  //true
 document.forms.bar===document.forms.foo //true
document.images返回页面所有的img图片节点
document.title返回当前文档的标题,可读可写。
document.charset返回当前的编码方式 ,返回UTF-8

document的方法

document.createElement()创建元素
示例:
image.png
结果:
image.png
document.createTextNode()创建文本节点
示例:
image.png
结果:
image.png
document.creareComment()创建注释节点
示例:
image.png
document.creaateAttribute()创建属性节点
 var a=document.createAttibute(“attr”)
  a.value=“newVal”
  node.setAttributeNode(a)
 //或者
 node.setAttribute(“attr”,“newVal”)
示例:
方法一:
image.png

image.png
方法二:
image.png

image.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 这个数行返回的是doctype的节点首先先把这个属性变量,然后在控制台显示,如果有这个标签会返回<!DOCTYPE...
    e0013abd041e阅读 149评论 0 1
  • 概述 document节点是文档的根节点,每张网页都有自己的document节点。window.document属...
    许先生__阅读 690评论 0 2
  •   DOM(文档对象模型)是针对 HTML 和 XML 文档的一个 API(应用程序编程接口)。   DOM 描绘...
    霜天晓阅读 3,726评论 0 7
  • 一、概述 document节点是整个文档树的顶层节点,每张网页都有自己的document节点。window.doc...
    周花花啊阅读 1,363评论 0 1
  • 这个时候日子还长,天气尚热,外头的人在放爆竹烟火,我不觉得喜庆,只觉得滑稽。很多事情与我无关系,只与与我有关的人有...
    解伊阅读 164评论 0 0