Javascript的部分对象详解Word文档格式.docx

上传人:b****3 文档编号:7979733 上传时间:2023-05-09 格式:DOCX 页数:26 大小:27.43KB
下载 相关 举报
Javascript的部分对象详解Word文档格式.docx_第1页
第1页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第2页
第2页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第3页
第3页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第4页
第4页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第5页
第5页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第6页
第6页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第7页
第7页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第8页
第8页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第9页
第9页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第10页
第10页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第11页
第11页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第12页
第12页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第13页
第13页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第14页
第14页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第15页
第15页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第16页
第16页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第17页
第17页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第18页
第18页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第19页
第19页 / 共26页
Javascript的部分对象详解Word文档格式.docx_第20页
第20页 / 共26页
亲,该文档总共26页,到这儿已超出免费预览范围,如果喜欢就下载吧!
下载资源
资源描述

Javascript的部分对象详解Word文档格式.docx

《Javascript的部分对象详解Word文档格式.docx》由会员分享,可在线阅读,更多相关《Javascript的部分对象详解Word文档格式.docx(26页珍藏版)》请在冰点文库上搜索。

Javascript的部分对象详解Word文档格式.docx

之间的HTML代码

document.body.topMargin//页面上边距

document.body.leftMargin//页面左边距

document.body.rightMargin//页面右边距

document.body.bottomMargin//页面下边距

document.body.background//背景图片

document.body.appendChild(oTag)//动态生成一个HTML对象

常用对象事件

document.body.onclick=”func()”//鼠标指针单击对象是触发

document.body.onmouseover=”func()”//鼠标指针移到对象时触发

document.body.onmouseout=”func()”//鼠标指针移出对象时触发

document的属性和方法:

document.createElement(tagName):

文档对象上的createElement方法可以创建由tagName指定的元素.如果以串div作为方法参数,就会生成一个div元素.

document.createTextNode(text):

文档对象的createTextNode方法会创建一个包含静态文本text的文本节点.

document.createAttribute():

用指定的名字创建新的Attr节点.

document.createComment():

用指定的字符串创建新的Comment节点.

document.getElementById():

返回文档中具有指定id的Element节点.

document.getElementsByTagName():

返回文档中具有指定标记名的所有Element节点.返回为一Element节点数组;

节点的属性和方法:

<

element>

.appendChild(childNode):

appendChild方法将指定的节点增加到当前元素的子节点列表(作为一个新的子节点).例如,可以增加一个option元素,作为select元素的子节点.

.getAttribute(name):

该方法用来获得元素中name属性的值.

.setAttribute(name,value):

该方法用来设置元素中name属性的值.

.insertBefore(newNode,targetNode):

该方法将节点newNode作为当前元素的子节点插到targetNode子节点元素的前面.

.removeAttribute(name):

该方法从元素中删除属性name.

.removeChild(childNode):

该方法从元素中删除子元素childNode.

.replaceChild(newNode,oldNode):

该方法将节点oldNode替换为节点newNode.

elemnet>

.hasChildNodes():

该方法返回一个布尔值,指示元素是否有子元素.

.tagName:

元素的标记名称,比如<

p>

元素为PHTML文档返回的tagName均为大写;

.getAttributeNode():

以Attr节点的形式返回指定属性的值;

.getElementsByTagName():

返回一个Node数组,包含具有指定标记名的所有Element节点的子孙节点,其顺序为在文档中出现的顺序.

.hasAttribute():

如果该元素具有指定名字的属性,则返回true;

.removeAttributeNode():

从元素的属性列表中删除指定的Attr节点.

.setAttributeNode():

把指定的Attr节点添加到该元素的属性列表中.

.cloneNode(true):

复制当前节点,true表示复制当前节点以及它的所有子孙节点.

Node对象常用属性:

.attributes:

如果该节点是一个Element,则以namedNodeMap形式返回该元素的属性.

.childNodes:

以Node[]的形式存放当前节点的子节点.如果没有子节点,则返回空数组.

.firstChild:

以Node的形式返回当前节点的第一个子节点.如果没有子节点,则为null.

.lastChild:

以Node的形式返回当前节点的最后一个子节点.如果没有子节点,则为null.

.nextSibling:

以Node的形式返回当前节点的兄弟下一个节点.如果没有这样的节点,则返回null.

.previousSibling:

以Node的形式返回紧挨当前节点,位于它之前的兄弟节点.如果没有这样的节点,则返回null.

.parentNode:

以Node的形式返回当前节点的父节点.如果没有父节点,则返回null.

.nodeType:

代表节点的类型.

.nodeName:

节点的名字,Element节点则代表Element的标记名称.

location-位置子对象

document.location.hash//#号后的部分

document.location.host//域名+端口号//好像返回的是主机名localhost,没有返回端口号

document.location.hostname//域名

document.location.href//完整URL

document.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

例如:

<

div>

请选中这里的部分文字。

/div>

inputtype="

button"

value="

请选中部分文字,然后点击这里执行empty"

/>

scripttype="

text/javascript"

language="

javascript"

>

!

--

functionFoo()

{

document.selection.empty();

}

-->

/script>

selection的createRange方法

document.selection.createRange()根据当前文字选择返回TextRange对象,或根据控件选择返回ControlRange对象。

配合execCommand,在HTML编辑器中很有用,比如:

文字加粗、斜体、复制、粘贴、创建超链接等。

这些好像都是只有在IE下才能实现。

images集合(页面中的图象)

a)通过集合引用

document.images//对应页面上的img标签

document.images.length//对应页面上img标签的个数

document.images[0]//第1个img标签

document.images[i]//第i-1个img标签

b)通过name属性直接引用

img

document.images.oImage//document.images.name属性

c)引用图片的src属性

document.images.oImage.src//document.images.name属性.src

d)创建一个图象

varoImage

oImage=newImage()

document.images.oImage.src=”1.jpg”

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

———————————————————————-

forms集合(页面中的表单)

document.forms//对应页面上的form标签

document.forms.length//对应页面上/formform标签的个数

document.forms[0]//第1个/formform标签

document.forms[i]//第i-1个/formform标签

document.forms[i].length//第i-1个/formform中的控件数

document.forms[i].elements[j]//第i-1个/formform中第j-1个控件

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

/formform

document.Myform.myctrl//document.表单名.控件名

c)访问表单的属性

document.forms[i].name//对应formname>

属性

document.forms[i].action//对应/formformaction>

document.forms[i].encoding//对应/formformenctype>

document.forms[i].target//对应/formformtarget>

document.forms[i].appendChild(oTag)//动态插入一个控件

document.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=”none”

/*document.all表示document中所有对象的集合

只有ie支持此属性,因此也用来判断浏览器的种类*/

图层对象的4个属性

document.getElementById(”ID”).innerText//动态输出文本

document.getElementById(”ID”).innerHTML//动态输出HTML

document.getElementById(”ID”).outerText//同innerText

document.getElementById(”ID”).outerHTML//同innerHTML

 

js-window对象的方法和属性资料收藏

熟练window对象的open、close、alert、confirm、prompt、setTimeout、clearTimeout、setInterval、clearInterval、moveBy、resizeBy、scrollBy方法的使用

掌握window对象的moveTo、resizeTo、scrollTo、print方法的使用

熟练掌握window对象的status、location、name、self、opener属性的使用  Window对象是客户端javascript最高层对象之一,只要打开浏览器窗口,不管该窗口中是否有打开的网页,当遇到BODY、FRAMESET或FRAME元素时,都会自动建立window对象的实例。

另外,该对象的实例也可由window.open()方法创建。

由于window对象是其它大部分对象的共同祖先,在调用window对象的方法和属性时,可以省略window对象的引用。

window.document.write()可以简写成:

document.write()。

 在窗口中觖发本窗口对象的任何方法和属性时可以省去窗口的实例名称。

例如给当前的myWin窗口设置status属性时,可以只用status而不用myWin.status。

但是,在事件处理中调用location属性、close()方法或open()方法时必须使用实例名称。

6-2-1window对象的方法

window对象有以下方法:

open

close

alert

confirm

prompt

setTimeout

clearTimeout

setInterval

clearInterval

moveBy

moveTo

resizeBy

resizeTo

scrollBy

scrollTo

find

back

forward

home

stop

print

blur

focus

captureEvent

enableExternalCapture

disableExternalCapture

handleEvent

releaseEvent

routeEvent

scroll

  1.open方法

  语法格式:

window.open(URL,窗口名称,窗口风格)

  功能:

打开一个新的窗口,并在窗口中装载指定URL地址的网页。

  说明:

open方法用于打开一个新的浏览器窗口,并在新窗口中装入一个指定的URL地址;

open方法在打开一个新的浏览器窗口时,还可以指定窗口的名称(第二个参数);

open方法在打开一个新的浏览器窗口时,还可以指定窗口的风格(第三个参数),

窗口风格有以下选项,这些选项可以多选,如果多选,各选项之间用逗号分隔:

toolbar:

指定窗口是否有标准工具栏。

当该选项的值为1或yes时,表示有标准工具栏,当该选项的值为0或no时,表示没有标准工具栏;

location:

指定窗口是否有地址工具栏,选项的值及含义与toolbar相同;

directories:

指定窗口是否有链接工具栏,选项的值及含义与toolbar相同;

status:

指定窗口是否有状态栏,选项的值及含义与toolbar相同;

menubar:

指定窗口是否有菜单,选项的值及含义与toolbar相同;

scrollbar:

指定当前窗口文档大于窗口时是否有滚动条,选项的值及含义与toolbar相同;

resizable:

指定窗口是否可改变大小,选项的值及含义与toolbar相同;

width:

以像素为单位指定窗口的宽度,已被innerWidth取代;

height:

以像素为单位指定窗口的高度,已被innerHeight取代;

outerWidth:

以像素为单位指定窗口的外部宽度;

outerHeight:

以像素为单位指定窗口的外部高度;

left:

以像素为单位指定窗口距屏幕左边的位置;

top:

以像素为单位指定窗口距屏幕顶端的位置;

alwaysLowered:

指定窗口隐藏在所有窗口之后,选项的值及含义与toolbar相同;

alwaysRaised:

指定窗口浮在所有窗口之上,选项的值及含义与toolbar相同;

dependent:

指定打开的窗口为当前窗口的一个子窗口,并随着父窗口的关闭而关闭,选项的值及含义与toolbar相同;

hotkeys:

在没有菜单栏的新窗口中设置安全退出的热键,选项的值及含义与toolbar相同;

innerHeight:

设定窗口中文档的像素高度;

innerWidth:

设定窗口中文档的像素宽度;

screenX:

设定窗口距离屏幕左边界的像素长度;

screenY:

设定窗口距离屏幕上边界的像素长度;

titleBar:

指明标题栏是否在新窗口中可见,选项的值及含义与toolbar相同;

z-look:

指明当窗口被激活时,不能浮在其它窗口之上,选项的值及含义与toolbar相同。

open方法返回的是该窗口的引用。

小技巧:

该方法经常用于在打开一个网页时自动打开另一个窗口。

例6-2-1:

编制一个小程序,它用于在打开当前窗口时自动打开另一个窗口,要

求该窗没有标准工具栏、地址栏、链接工具栏、菜单栏,但有状态栏,窗口中打

开的网页地址为:

2.close方法

语法格式:

window.close()

功能:

close方法用于自动关闭浏览器窗口。

3.alert方法

window.alert(提示字符串)

弹出一个警告框,在警告框内显示提示字符串文本。

4.confirm方法

window.confirm(提示字符串)

显示一个确认框,在确认框内显示提示字符串,当用户单击“确定”按钮

时该方法返回true,单击“取消”时返回false。

5.prompt方法

window.prompt(提示字符串,缺省文本)

显示一个输入框,在输入框内显示提示字符串,在输入文本框显示缺省文

本,并等待用户输入,当用户单击“确定”按钮时,返回用户输入的字符串,当

单击“取消”按钮时,返回null值。

6.setTimeout方法

window.setTimeout(代码字符表达式,毫秒数)

定时设置,当到了指定的毫秒数后,自动执行代码字符表达式。

7.clearTimeout方法

window.clearTimeout(定时器)

取消以前的定时设置,其中的参数是用setTimeout设置时的返回值。

8.setInterval方法

window.setInterval(代码字符表达式,毫秒数)

设定一个时间间隔后(第二个参数),反复执行“代码字符表达式”的内容

9.clearInterval方法

window.clearInterval(时间间隔器)

取消setInterval设置的定时。

其中的参数是setInterval方法的返回值。

10.moveBy方法

window.moveBy(水平位移量,垂直位移量)

按照给定像素参数移动指定窗口。

第一个参数是窗口水平移动的像素,第

二个参数是窗口垂直移动的像素。

11.moveTo方法

window.moveTo(x,y)

将窗口移动到指定的指定坐标(x,y)处。

12.resizeBy方法

window.resizeBy(水平,垂直)

将当前窗口改变指定的大小(x,y),当x、y的值大于0时为扩大,小于0时

为缩小。

13.resizeTo方法

window.resizeTo(水平宽度,垂直宽度)

将当前窗口改变成(x,y)大小,x、y分别为宽度和高度。

14.scrollBy方法

window.scrollBy(水平位移量,垂直位移量)

将窗口中的内容按给定的位移量滚动。

参数为正数时,正向滚动,否则反

向滚动。

15.scrollTo方法

window.scrollTo(x,y)

将窗口中的内容滚动到指定位置。

16.find方法

window.find()

当触发该方法时,将弹出一个“find”(查找)对话窗口,并允许用户在触

发find方法的页面中查找一个字符串。

注:

该属性在IE5.5及Netscape6.0中都不支持。

17.back方法

window.back()

模拟用户点击浏览器上的“后退”按钮,将页面转到浏览器的上一页。

展开阅读全文
相关资源
猜你喜欢
相关搜索
资源标签

当前位置:首页 > 小学教育 > 语文

copyright@ 2008-2023 冰点文库 网站版权所有

经营许可证编号:鄂ICP备19020893号-2