JavaScript中的Doucment文档对象

Document对象:代表整个HTML文档,可用来获取文档本身的信息并访问页面中的所有元素。


document对象是window对象的一个部分,可通过window.document属性来访问


document对象的属性


body 提供对 <body> 元素的直接访问。对于定义了框架集的文档,该属性引用最外层的 <frameset>。
cookie 设置或返回与当前文档有关的所有 cookie。
domain 返回当前文档的域名。
referrer 返回载入当前文档的文档的 URL。
title 返回当前文档的标题。
URL 返回当前文档的 URL。


document对象的方法


getElementById() 返回拥有指定 id 的第一个页面元素对象。
getElementsByName() 返回带有指定名称的页面元素对象集合。
getElementsByTagName() 返回带有指定标签名的页面元素对象集合。
write() 向文档写 HTML 表达式 或 JavaScript 代码。
writeln() 类似于 write() 方法,不同的是在每个表达式之后写一个换行符。




all[] 提供对文档中所有 HTML 元素的访问。
anchors[] 返回对文档中所有 Anchor 对象的引用。
forms[] 返回对文档中所有 Form 对象引用。
images[] 返回对文档中所有 Image 对象引用。
links[] 返回对文档中所有 Area 和 Link 对象引用。




页面元素对象


访问到某个页面元素对象之后,可进一步访问到它的内容和样式。
内容:innerText | innerHTML
样式:style


表单及表单元素的访问


Form 对象代表一个 HTML 表单。在 HTML 文档中 <form> 每出现一次,Form 对象就会被创建


表单对象的访问


document.getElementById(“表单标签的ID”)
document.getElementsByName(“表单标签的name”)[索引]
document.表单标签的name属性 


表单对象的属性


action 设置或返回表单的 action 属性。
enctype 设置或返回表单用来编码内容的 MIME 类型。
id 设置或返回表单的 id。
length 返回表单中的元素数目。
method 设置或返回将数据发送到服务器的 HTTP 方法。
name 设置或返回表单的名称。
target 设置或返回表单提交结果的 Frame 或 Window 名。


表单对象的集合
elements[] 包含表单中所有元素的数组。


function test1() {
window.alert(document.getElementById("frm_1").elements.length); window.alert(document.getElementById("frm_1").elements[1].value; }


<form id="frm_1" name="frm" action="process.html" method="post">
<input type="text" id="txt_1" name="txt" />
<input type="submit" id="btn_1" name="btnSubmit" value="提交" />
<input type="button" id="btn_2" name="btnTest" value="测试" onclick="test1();" />
</form>


表单对象的方法


reset() 把表单的所有输入元素重置为它们的默认值。
submit() 提交表单。


表单元素的访问


对于有id属性的表单元素,可以使用Document对象的getElementById()方法来获得此表单元素对象

对于有name属性的表单元素,可以使用Document对象的getElementsByName()方法来获得设置了此名称的表单元素对象的集合,再通过索引访问其中之一


还可以先访问表单元素所属的表单对象后,访问表单对象的elements集合,为集合提供索引,这样获取表单内的某个表单元素。 




文本元素的访问


类型为text或password的<input />元素或<textarea></textarea>元素,它们的作用都让浏览者输入文本,称为文本元素。


使用value属性可获得或设置文本元素内的数据

使用select()方法可使文本元素选中其内部的文本


使用focus()方法和blur()方法,可将焦点移入或移出文本元素。




单选按钮元素的访问


单选按钮在表单内一般以一组多个的方式存在,供浏览者在组中选择其中之一。注意:属于同一组的单选按钮必须共享相同的名称。


使用value属性,可获得或设置单选按钮的数据


使用checked属性可获得或设置单选按钮选中或不选中的状态。


复选框元素的访问


复选框元素的访问与单选按钮组类似。 
注意:一组复选框有可能被用户选中多个,即使它们同名。




列表框元素的访问 
<select></select>标签内部的所有<option></option>标签构成了列表框元素的选项集合,由列表框元素的options表示。


options集合包含length属性可以获得或设置选项的个数,


add()可向列表框中添加新的选项,


remove()方法则用于从列表框中移除已有的选项。


列表框元素的selectedIndex属性可以获得或设置被选中的选项的索引号。


<option></option>标签被脚本视为选项对象。选项对象包含text属性,value属性。某个选项是否被选中,可由它的selected属性来获得或设置。 




Document文档对象表示整个网页文档。


文档对象包含一些属性用于获得文档本身的信息


文档对象包含getElementById,getElementsByName,getElementsByTagName方法用于获取页面元素法


使用页面元素对象的innerText或innerHTML属性用于访问其内容


使用页面元素对象的style属性用于访问其样式


除了像访问普通页面元素一样访问表单元素外,还可以先访问包含表单元素的表单对象,再访问表单对象的elements集合,在这个集合中获取某个表单元素。

你可能感兴趣的:(JavaScript,对象,文档,语言,脚本语言)