详细讲解JavaScript脚本语言的 document 对象

对象属性

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

 

对象方法

 

images集合(页面中的图象)

a)通过集合引用 


代码
document.images               // 对应页面上的<img>标签   
document.images.length        // 对应页面上<img>标签的个数   
document.images[ 0 ]            // 第1个<img>标签              
document.images[i]            // 第i-1个<img>标签  
b)通过nane属性直接引用 


代码
< 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 >    
</ select >    
</ form >    
   
< script language = " javascript " >    
     // 遍历select控件的option项   
     var  length   
    length = document.Myform.oSelect.length   
     for (i = 0 ;i < length;i ++ )   
    document.write(document.Myform.oSelect[i].value)   
</ 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)   
    else   
    document.write("<font color=red>"+document.Myform.oSelect[i].value+"</font>")      
    }    
</ script >    
   
< script language = " javascript " >    
     // 根据SelectedIndex打印出选中的option   
     // (0到document.Myform.oSelect.length-1)   
    i = document.Myform.oSelect.selectedIndex   
    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支持此属性，因此也用来判断浏览器的种类*/