Javascript之document对象详解

本文转载自点击打开链接

以下是document对象的属性和函数的总结:

对象属性       

  
title:设置文档标题等价于HTML的<title>标签       
  
bgColor:设置页面背景色       
  
fgColor:设置前景色(文本颜色)       
  
Links:此文档中所有链接的集        
  
linkColor:未点击过的链接颜色       
  
alinkColor:激活链接(焦点在此链接上)的颜色       
  
vlinkColor:已点击过的链接颜色       
  
URL:设置URL属性从而在同一窗口打开另一网页       
  
Location:此页的URL        
  
Referrer:链接此页的网页的URL        
  
fileCreatedDate:文件建立日期,只读属性       
  
fileModifiedDate:文件修改日期,只读属性       
  
fileSize:文件大小,只读属性       
  
cookie:设置和读出cookie       
  
charset:设置字符集 简体中文:gb2312       

  
属性描述        
  
ActiveElement:当前具有焦点的元素        
  
All:此文档中所有元素的集        
  
Anchors: 此文档中所有定位的集        
  
Applets:此文档中所有applet的集        
  
Domain: 获得此文件的Web服务器所在的域名        
  
Forms 此文档中所有窗体的集        
  
Frames:此文档中所有框架的集        
  
Images: 此文档中所有图象的集        
  
LastModified: 此文件最后一次修改时的日期和时间        
  
ReadyState:此页的下载状态,等于”uninitialized”(页调入前)、”loading”(页调入中)、”interactive”(操作链接时)或”complete”(完成调入)       
  
Scripts:此文档中所有脚本的集        
  
StyleSheets:此文档中所有style sheet的集        
  
Title:此页的标题        
  
URL: 此页的URL        
  
VlinkColor :点击过的链接的颜色        
  
对象方法
  
Close():关闭HTML输出流        
  
Open():打开HTML输出流        
  
Write(str):往HTML输出流中写入str        
  
Writeln(str):往HTML输出流中写入str和一个新行        
  
document.write():动态向页面写入内容       
  
document.createElement(Tag):创建一个html标签对象       
  
document.getElementById(ID):获得指定ID值的对象       
  
document.getElementsByName(Name):获得指定Name值的对象       
      
  
images集合(页面中的图象)       
  
      
  
a)通过集合引用       
  
document.images             //对应页面上的<img>标签       
  
document.images.length      //对应页面上<img>标签的个数       
  
document.images[0]          //第1个<img>标签                  
  
document.images[i]          //第i-1个<img>标签       
  
      
  
b)通过name属性直接引用       
  
<img name="oImage">      
  
document.images.oImage      //document.images.name属性       
  
      
  
c)引用图片的src属性       
  
document.images.oImage.src  //document.images.name属性.src       
  
      
  
d)创建一个图象       
  
var oImage       
  
oImage = new Image()       
  
document.images.oImage.src="/1.jpg"      
  
同时在页面上建立一个<img>标签与之对应就可以显示       
  
      
  
<html>      
  
<img name=oImage>      
  
<script language="javascript">      
  
   var oImage       
  
   oImage = new Image()       
  
   document.images.oImage.src="/1.jpg"      
  
</script>      
  
</html>      
      
  
forms集合(页面中的表单)       
  
      
  
a)通过集合引用       
  
document.forms                 //对应页面上的<form>标签       
  
document.forms.length          //对应页面上<form>标签的个数       
  
document.forms[0]              //第1个<form>标签       
  
document.forms[i]              //第i-1个<form>标签       
  
document.forms[i].length       //第i-1个<form>中的控件数       
  
document.forms[i].elements[j]  //第i-1个<form>中第j-1个控件       
  
      
  
b)通过标签name属性直接引用       
  
<form name="Myform"><input name="myctrl"></form>      
  
document.Myform.myctrl         //document.表单名.控件名       
  
      
  
-----------------------------------------------------------------------       
  
<html>      
  
<!--Text控件相关Script-->      
  
<form name="Myform">      
  
<input type="text" name="oText">      
  
<input type="password" name="oPswd">      
  
<form>      
  
<script language="javascript">      
  
//获取文本密码框的值       
  
document.write(document.Myform.oText.value)       
  
document.write(document.Myform.oPswd.value)       
  
</script>      
  
</html>      
  
-----------------------------------------------------------------------       
  
<html>      
  
<!--Select控件相关Script-->      
  
<form name="Myform">      
  
<select name="oSelect">      
  
<option value="1">1</option>      
  
<option value="2">2</option>      
  
<option value="3">3</option>      
  
<option value="4">4</option>      
  
<option value="7">sdf</option>      
  
</select>      
  
</form>      
  
      
  
<script language="javascript">      
  
   //遍历select控件的option项       
  
   var length       
  
  document.write(document.Myform.oSelect.length+"<BR>")       
  
   length=document.Myform.oSelect.length       
  
   for(i=0;i<length;i++)       
  
   document.write(document.Myform.oSelect[i].value+"<BR>")       
  
</script>      
  
      
  
<script language="javascript">      
  
   //遍历option项并且判断某个option是否被选中       
  
   for(i=0;i<document.Myform.oSelect.length;i++){       
  
   if(document.Myform.oSelect[i].selected!=true)       
  
   document.write(document.Myform.oSelect[i].value+"<BR>")       
  
   else       
  
   document.write("<font color=red>"+document.Myform.oSelect[i].value+"</font>"+"<BR>")          
  
   }       
  
</script>      
  
      
  
<script language="javascript">      
  
   //根据SelectedIndex打印出选中的option       
  
   //(0到document.Myform.oSelect.length-1)       
  
   i=document.Myform.oSelect.selectedIndex       
  
   document.write(i+"<B>"+"<BR>")       
  
   document.write(document.Myform.oSelect[i].value)       
  
</script>      
  
      
  
<script language="javascript">      
  
   //动态增加select控件的option项       
  
   var oOption = document.createElement("OPTION");       
  
   oOption.text="4";       
  
   oOption.value="4";       
  
   document.Myform.oSelect.add(oOption);       
  
</script>      
  
<html>      
  
-----------------------------------------------------------------------       
  
<Div id="oDiv">Text</Div>      
  
document.all.oDiv                       //引用图层oDiv       
  
document.all.oDiv.style                        
  
document.all.oDiv.style.display=""      //图层设置为可视       
  
document.all.oDiv.style.display="none"  //图层设置为隐藏       
  
/*document.all表示document中所有对象的集合      
 
只有ie支持此属性,因此也用来判断浏览器的种类*/ 
展开阅读全文

没有更多推荐了,返回首页