Javascript - document对象


注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写
    否则会提示你一个错误信息 "引用的元素为空或者不是对象"

对象属性

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


常用对象方法

Javascript - document对象document.write()                   //动态向页面写入内容
Javascript - document对象document.createElement(Tag)        //创建一个html标签对象
Javascript - document对象document.getElementById(ID)        //获得指定ID值的对象
Javascript - document对象document.getElementsByName(Name)   //获得指定Name值的对象
Javascript - document对象document.body.appendChild(oTag)



body-主体子对象

Javascript - document对象 document.body                //指定文档主体的开始和结束等价于<body></body>
Javascript - document对象document.body.bgColor        //设置或获取对象后面的背景颜色
Javascript - document对象document.body.link           //未点击过的链接颜色
Javascript - document对象document.body.alink          //激活链接(焦点在此链接上)的颜色
Javascript - document对象document.body.vlink          //已点击过的链接颜色
Javascript - document对象document.body.text           //文本色
Javascript - document对象document.body.innerText      //设置<body>Javascript - document对象</body>之间的文本
Javascript - document对象document.body.innerHTML      //设置<body>Javascript - document对象</body>之间的HTML代码
Javascript - document对象document.body.topMargin      //页面上边距
Javascript - document对象document.body.leftMargin     //页面左边距
Javascript - document对象document.body.rightMargin    //页面右边距
Javascript - document对象document.body.bottomMargin   //页面下边距
Javascript - document对象document.body.background     //背景图片
Javascript - document对象
Javascript - document对象document.body.appendChild(oTag) //动态生成一个HTML对象


常用对象事件

Javascript - document对象document.body.onclick="func()"           //鼠标指针单击对象是触发
Javascript - document对象document.body.onmouseover="func()"       //鼠标指针移到对象时触发
Javascript - document对象document.body.onmouseout="func()"        //鼠标指针移出对象时触发


location-位置子对象


Javascript - document对象document.location.hash       // #号后的部分
Javascript - document对象document.location.host       // 域名+端口号
Javascript - document对象document.location.hostname   // 域名
Javascript - document对象document.location.href       // 完整URL
Javascript - document对象document.location.pathname   // 目录部分
Javascript - document对象document.location.port       // 端口号
Javascript - document对象document.location.protocol   // 网络协议(http:)
Javascript - document对象document.location.search     // ?号后的部分
Javascript - document对象
Javascript - document对象documeny.location.reload()       //刷新网页
Javascript - document对象document.location.reload(URL)    //打开新的网页
Javascript - document对象document.location.assign(URL)    //打开新的网页
Javascript - document对象document.location.replace(URL)   //打开新的网页


selection-选区子对象

Javascript - document对象document.selection



images集合(页面中的图象)

a)通过集合引用

Javascript - document对象document.images              //对应页面上的<img>标签
Javascript - document对象document.images.length       //对应页面上<img>标签的个数
Javascript - document对象document.images[0]           //第1个<img>标签           
Javascript - document对象document.images[i]           //第i-1个<img>标签


b)通过nane属性直接引用

Javascript - document对象<img name="oImage">
Javascript - document对象document.images.oImage       //document.images.name属性


c)引用图片的src属性

Javascript - document对象document.images.oImage.src   //document.images.name属性.src


d)创建一个图象

Javascript - document对象var oImage
Javascript - document对象oImage = new Image()
Javascript - document对象document.images.oImage.src="1.jpg"

同时在页面上建立一个<img>标签与之对应就可以显示

Javascript - document对象<html>
Javascript - document对象<img name=oImage>
>

 

Javascript - document对象<html>
>

 

----------------------------------------------------------------------

forms集合(页面中的表单)

a)通过集合引用

Javascript - document对象document.forms                  //对应页面上的<form>标签
Javascript - document对象document.forms.length           //对应页面上<form>标签的个数
Javascript - document对象document.forms[0]               //第1个<form>标签
Javascript - document对象document.forms[i]               //第i-1个<form>标签
Javascript - document对象document.forms[i].length        //第i-1个<form>中的控件数
Javascript - document对象document.forms[i].elements[j]   //第i-1个<form>中第j-1个控件


b)通过标签name属性直接引用

Javascript - document对象<form name="Myform"><input name="myctrl"></form>
Javascript - document对象document.Myform.myctrl          //document.表单名.控件名


c)访问表单的属性

Javascript - document对象 document.forms[i].name          //对应<form name>属性
Javascript - document对象document.forms[i].action        //对应<form action>属性
Javascript - document对象document.forms[i].encoding      //对应<form enctype>属性
Javascript - document对象document.forms[i].target        //对应<form target>属性
Javascript - document对象
Javascript - document对象document.forms[i].appendChild(oTag) //动态插入一个控件



Javascript - document对象<html>
Javascript - document对象<!--Text控件相关Script-->
Javascript - document对象<form name="Myform">
Javascript - document对象<input type="text" name="oText">
Javascript - document对象<input type="password" name="oPswd">
Javascript - document对象<form>
>
Javascript - document对象<html>
Javascript - document对象<!--checkbox,radio控件相关script-->
Javascript - document对象<form name="Myform">
Javascript - document对象<input type="checkbox" name="chk" value="1">1     
Javascript - document对象<input type="checkbox" name="chk" value="2">2     
Javascript - document对象</form>     

 

Javascript - document对象 <html>
Javascript - document对象<!--Select控件相关Script-->
Javascript - document对象<form name="Myform">
Javascript - document对象<select name="oSelect">
Javascript - document对象<option value="1">1</option>
Javascript - document对象<option value="2">2</option>
Javascript - document对象<option value="3">3</option>
Javascript - document对象</select>
Javascript - document对象</form>
Javascript - document对象
>


-----------------------------------------------------------------------

Javascript - document对象<Div id="oDiv">Text</Div>
Javascript - document对象document.all.oDiv                               //引用图层oDiv                
Javascript - document对象document.all.oDiv.style.display=""              //图层设置为可视
Javascript - document对象document.all.oDiv.style.display="none"          //图层设置为隐藏
Javascript - document对象document.getElementId("oDiv")                   //通过getElementId引用对象
Javascript - document对象document.getElementId("oDiv").style=""
Javascript - document对象document.getElementId("oDiv").display="none"
*/


图层对象的4个属性

Javascript - document对象document.getElementById("ID").innerText   //动态输出文本
Javascript - document对象document.getElementById("ID").innerHTML   //动态输出HTML
Javascript - document对象document.getElementById("ID").outerText   //同innerText
Javascript - document对象document.getElementById("ID").outerHTML   //同innerHTML
Javascript - document对象<html>
>

 

Javascript - document对象<html>
>

 



相关文章：

猜你喜欢
相关资源
相似解决方案
热门标签
Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode