它的子节点恐怕是二个DocumentType、ProcessingInstruction或Comment。

element = document.querySelector;elementList = document.querySelectorAll;

nodeName的值为“#document”。

但须求注意的是再次回到的nodeList集结中的因素是非实时的,想要不相同什么是实时非实时的回来结果,请看上边包车型地铁例证:

element = document.querySelector('selector1,selector2,...');elementList = document.querySelectorAll('selector1,selector2,...');

与NodeList相近,能够应用方括号语法或item()艺术来访谈HTMLCollection对象:

nodeType的值为9。

var doctype = document.doctype; //获取的引用

透过地点的例子就很好地精晓了怎么样是会实时更新的成分。document.getElementById回去的正是实时结果,下面对其丰盛叁个子成分后,再次获得具有子成分个数,已经由原先的2个更新为3个(这里不考虑有个别浏览器譬喻Chrome会把空荡荡也解析为一个子节点卡塔尔。

即使想要获取页面中的全数因素,能够通过在getElementByTagName()艺术中传来“*”通配符来赢得。

属性 描述

文书档案的写入

上边的页面经过浏览器拆解深入分析之后,其文书档案中只含有几个子节点,及`元素。通过documentElement`属性和childNodes列表来访谈这一个因素的代码如下:

anchors[] anchor对象数组,每壹个都意味文书档案中出现的一个锚泊地 applets[]
applet对象数组,代表文书档案中冒出的每三个applet片段 bgColor
钦赐文书档案的背景颜色,字符串类型 cookies 允许读写HTTP的cookie,字符串类型
domain 内定文书档案来自哪叁个域,用于安全目标,字符串类型 embeds[]
代表文书档案中采纳标记嵌入的数据,于plugins[]意义相同 fgColor
指定文档的前景颜色,字符串类型 forms[]
form对象数组,每一个元素对应于文档中的一个HTML

地点的代码会将最近浏览器扶植的document属性按字母排序后移表格的章程打字与印刷在页面中。

nodeValue的值为null。

var mypic = images.namedItem;

HTMLCollection对象还应该有叁个方法:namedItem(),使用这些法子能够经过成分的name属性得到会集中的项。举例地方的图纸集合中,假诺有一张图纸的name属性为mypic

document对象的质量和措施

var authors = document.getElementByName;
//取得元素的引用var html = document.documentElement;alert(html === document.childNodes[0]); //truealert(html === document.firstChild); //true

标记的从头到尾的经过 UHighlanderL 钦点当前文档的UPAJEROL,只读属性 vlinkColor
钦命已会见链接的颜色

追寻成分

Document别的三个也许的子节点是DocumentType,通常将标签看成一个与文档其它部分不同的实体,可以通过doctype属性来访谈它。

querySelectorAll措施重返全体满意条件的要素,结果是个nodeList集结。查找法则与眼下所述同样。

另三个平日使用的办法是document.getElementsByTagName,通过标签名来查找成分。该办法选择一个参数:要探究的竹具名称。它会重临0个或七个因素的NodeList。在HTML文书档案中,该方式再次回到三个HTMLCollection对象,称为“动态”群集。举个例子,上边包车型客车代码获取页面中负有的“成分,并回到三个HTMLCollection:

在地点的document对象的习性中,URLdomainreferrer属性于网页的呼吁有关。URL属性包含完整的USportageL地址,及线索在地方栏中的页面地址。domain属性只含有页面包车型大巴域名,而referrer属性中则保留着链接到当前页面包车型大巴那多少个页面包车型大巴UEnclaveL地址。在一直不来源页面包车型地铁动静下,referrer属性只怕带有空字符串。全部的这一个音讯都在HTTP乞请头中,只可是大家能够利用JavaScript来访谈它们。

那即是说就足以经过上边包车型大巴措施从images变量中拿走那张图片:

HTML5中的querySelector和querySelectorAll方法

那多少个方式应用大致的语法,都以摄取贰个字符串参数,那么些参数须求是法定的CSS接受语法。

div

第一个取得成分的秘技是HTMLDocument特有的秘技:getElementByName()。该方法会重回钦点name属性的装有因素。比如上边包车型地铁代码:

此中参数selectors 能够分包三个CSS采取器,用逗号隔离。

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

上边的例子表达,documentElementfirstChildchildNodes[0]的值相似,都照准“元素。

alert; //图片的数量alert; //第一张图片的src属性alert; //第一张图片的src属性

Document类型能够象征HTML页面或任何基于XML的文书档案。最不乏先例的使用是充作HTMLDocument实例的document对象。通过这一个文书档案对象,不仅可以够获得与页面相关的音讯,并且还能够操作页面包车型地铁外观和它底层的布局。

//首先选取页面中id为container的元素container=document.getElementById;console.log(container.childNodes.length)//结果为2//然后通过代码为其添加一个子元素container.appendChild(document.createElement;//这个元素不但添加到页面了,这里的变量container也自动更新了console.log(container.childNodes.length)//结果为3

querySelector办法重临满足条件的单个成分。根据深度优先和先序遍历的条件使用参数提供的CSS采用器在DOM进行搜寻,重返第多个满足条件的要素。

虽说DOM标准规定Document节点的子节点能够是DocumentType、、Element、ProcessingInstruction或Comment,但还会有七个放置的访谈它的子节点的快速情势。第三个是documentElement天性,该属性始终本着HTML页面包车型大巴`元素。另一个是通过childNodes列表访问文档元素,但是通过documentElement`属性能够越来越便捷的探望该因素。上边是二个例子:

在DOM的利用此中,最布满的操作时收获有些或某组成分的引用,然后再进行一些操作。取得成分的操作能够经过document对象的以下一些格局来实现。

document.getElementById()

首先个方式document.getElementById()吸纳贰个参数:要获得的成分的ID。假若找到该因素则赶回该因素,不然重返null。即使页面中存在七个具备近似ID的要素,那么getElementById()办法只回去文书档案中率先次的成分。在IE7及以下版本的IE浏览器中,纵然表单成分的name性情与要搜索的因素ID相通,该表单成分也会被再次回到,举例:

var images = document.getElementByTagName;

文书档案的子节点

回去javascript教程主目录>>

var allElements = document.getElementByTagName;
element = document.querySelector('div#container');//返回id为container的首个divelement = document.querySelector;//返回带有foo或者bar样式类的首个元素

当使用document.getElementById来寻找元素的时候,IE7浏览器会将`元素返回。而其它浏览器则是返回div`元素。

JavaScript通过Document类型来表示文书档案。在浏览器中,document对象是HTMLDocument的叁个实例,表示全部HTML页面。并且Document对象是window对象的多少个实例,因而能够将它看成全局对象来会见。Document类型节点有所上面包车型大巴部分风味:

标记 images[] image对象数组,每四个成分对应于文书档案中的几个HTML标记
lastModified 给出文档的最近修改时间,字符串类型,只读属性 linkColor
指定未访问连接的颜色 links[]
link对象数组,每一个元素对应于文档中的一个HTML
标记 location
文书档案的U揽胜L地址,该属性已抛弃,应该使用UTiguanL属性来取而代之 plugins[]
与embeds[]天性的意义相似 referrer 只读属性,连选拔当前文档的U瑞虎L title
文书档案的标题,对应于文书档案中的“

parentNode的值为null。

document对象能够将输出流写入到网页中,它有4个点子:write()writelnclose()。其中,write()writeln()方式选择三个字符串参数,即要写入到输出流的文件。write()方法会原样写出,而writeln()方法会在字符串的结尾增添一个换行符。在页面加载的进度中,能够选择那五个主意来动态的丰裕内容,举个例子上边包车型大巴代码:

“);}document.write;

document.getElementsByTagName

采纳这多少个方式无法查找带伪类状态的因素,比方querySelector不会取得预期结果。

document.getElementsByName()

document对象是window对象的叁天质量。当窗口划分为多少个框架的时候,每一个框架都以window对象的贰天性质,框架本人其实也是window对象的三个实例。document对象的常用属性如下表所示:

用作HTMLDocument的实例,document对象还应该有叁个body属性,直接指向`属性。document.body`是大家在支付中一时利用的品质:

下边的代码会回来全部的li元素。同样,getElementByName()情势也会回到贰个HTMLCollection对象。

除了上边包车型大巴三个查找成分的办法之外,在HTML5向Web
API新引进了新的document.querySelectordocument.querySelectorAll方法用来更方便人民群众地从DOM选取成分,作用相似于jQuery的选用器。

var body = document.body;
 Document 当前的时间为:  document.write("<strong>"+.toString()+"</strong>");  
elements = document.querySelectorAll;//返回所有带foo类样式的div

有着的浏览器都扶植document.documentElement属性和document.body属性。

var attrs = new Array();for(var property in window.document) { attrs.push; attrs.sort();}document.write;for(var i=0;i 0 && i%5 == 0){ document.write(""); } document.write("" + attrs[i] + "

上边列出的是有个别常用的document属性,要查看当前浏览器扶持的全体document属性,能够动用上面包车型地铁点子:

相关文章

网站地图xml地图