[web编程]document对象详解document 文挡对象 - JavaScript脚本语言描述---------------------------------------------------------------------注页面上元素name属性和JavaScript引用的名称必须一致包括大小写 否则会提示你一个错误信息 引用的元素为空或者不是对象--------------------------------------------------------------------- 对象属性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 设置和读出cookiedocument.charset 设置字符集 简体中文gb2312---------------------------------------------------------------------常用对象方法document.write() 动态向页面写入内容document.createElement(Tag) 创建一个html标签对象document.getElementById(ID) 获得指定ID值的对象document.getElementsByName(Name) 获得指定Name值的对象document.body.appendChild(oTag)---------------------------------------------------------------------
body-主体子对象document.body 指定文档主体的开始和结束等价于bodybodydocument.body.bgColor 设置或获取对象后面的背景颜色document.body.link 未点击过的链接颜色document.body.alink 激活链接(焦点在此链接上)的颜色document.body.vlink 已点击过的链接颜色document.body.text 文本色document.body.innerText 设置body...body之间的文本document.body.innerHTML 设置body...body之间的HTML代码document.body.topMargin 页面上边距document.body.leftMargin 页面左边距document.body.rightMargin 页面右边距document.body.bottomMargin 页面下边距document.body.background 背景图片
document.body.appendChild(oTag) 动态生成一个HTML对象
常用对象事件document.body.οnclick=func() 鼠标指针单击对象是触发document.body.οnmοuseοver=func() 鼠标指针移到对象时触发document.body.οnmοuseοut=func() 鼠标指针移出对象时触发 ---------------------------------------------------------------------location-位置子对象
document.location.hash #号后的部分document.location.host 域名+端口号document.location.hostname 域名document.location.href 完整URLdocument.location.pathname 目录部分document.location.port 端口号document.location.protocol 网络协议(http)document.location.search 号后的部分
documeny.location.reload() 刷新网页document.location.reload(URL) 打开新的网页document.location.assign(URL) 打开新的网页document.location.replace(URL) 打开新的网页---------------------------------------------------------------------selection-选区子对象document.selection---------------------------------------------------------------------
images集合(页面中的图象)
a)通过集合引用document.images 对应页面上的img标签document.images.length 对应页面上img标签的个数document.images[0] 第1个img标签 document.images[i] 第i-1个img标签
b)通过nane属性直接引用img name=oImagedocument.images.oImage document.images.name属性
c)引用图片的src属性document.images.oImage.src document.images.name属性.src
d)创建一个图象var oImageoImage = new Image()document.images.oImage.src=1.jpg同时在页面上建立一个img标签与之对应就可以显示
htmlimg name=oImagescript language=javascript var oImage oImage = new Image() document.images.oImage.src=1.jpgscripthtml
htmlscript language=javascript oImage=document.caeateElement(IMG) oImage.src=1.jpg document.body.appendChild(oImage)scripthtml
----------------------------------------------------------------------
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=Myforminput name=myctrlformdocument.Myform.myctrl document.表单名.控件名
c)访问表单的属性document.forms[i].name 对应form name属性document.forms[i].action 对应form action属性document.forms[i].encoding 对应form enctype属性document.forms[i].target 对应form target属性
document.forms[i].appendChild(oTag) 动态插入一个控件-----------------------------------------------------------------------html!--Text控件相关Script--form name=Myforminput type=text name=oTextinput type=password name=oPswdformscript language=javascript获取文本密码框的值document.write(document.Myform.oText.value)document.write(document.Myform.oPswd.value)scripthtml-----------------------------------------------------------------------html!--checkbox,radio控件相关script--form name=Myforminput type=checkbox name=chk value=11 input type=checkbox name=chk value=22 form script language=javascript function fun(){ 遍历checkbox控件的值并判断是否选中 var length length=document.forms[0].chk.length for(i=0;ilength;i++){ v=document.forms[0].chk[i].value b=document.forms[0].chk[i].checked if(b) alert(v=v+被选中) else alert(v=v+未选中) } } script a href=# οnclick=fun()ddda html -----------------------------------------------------------------------html!--Select控件相关Script--form name=Myformselect name=oSelectoption value=11optionoption value=22optionoption value=33optionselectform
script language=javascript 遍历select控件的option项 var length length=document.Myform.oSelect.length for(i=0;ilength;i++) document.write(document.Myform.oSelect[i].value)script
script language=javascript 遍历option项并且判断某个option是否被选中 for(i=0;idocument.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);scripthtml-----------------------------------------------------------------------Div id=oDivTextDivdocument.all.oDiv 引用图层oDiv document.all.oDiv.style.display= 图层设置为可视document.all.oDiv.style.display=none 图层设置为隐藏document.getElementId(oDiv) 通过getElementId引用对象document.getElementId(oDiv).style=document.getElementId(oDiv).display=nonedocument.all表示document中所有对象的集合只有ie支持此属性，因此也用来判断浏览器的种类
图层对象的4个属性document.getElementById(ID).innerText 动态输出文本document.getElementById(ID).innerHTML 动态输出HTMLdocument.getElementById(ID).outerText 同innerTextdocument.getElementById(ID).outerHTML 同innerHTML
htmlscript language=javascriptfunction change(){document.all.oDiv.style.display=none}scriptDiv id=oDiv οnclick=change()TextDivhtml
htmlscript language=javascriptfunction changeText(){document.getElementById(oDiv).innerText=NewText}scriptDiv id=oDiv οnmοuseοver=changeText()TextDivhtml
转载于:https://www.cnblogs.com/hengbo/archive/2008/02/26/2232523.html
相关资源：数据结构—成绩单生成器