`
xchyou
  • 浏览: 28314 次
最近访客 更多访客>>
社区版块
存档分类
最新评论

js文档属性与事件大全

阅读更多

 

对象属性

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

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

对象方法

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)通过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="http://www.pushad.com/1.jpg"

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

<html>

<img name=oImage>

<script language="javascript">

   var oImage

   oImage = new Image()

   document.images.oImage.src="http://www.pushad.com/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支持此属性,因此也用来判断浏览器的种类*/

input元素

input元素用于定义文本实体对象,包含有对输入文本内容的格式、数据类型、长度、值、变量名等多种属性的具体规定。当用户输入满足input元素的规定时,则接收输入信息,并赋给指定的变量灵活进行相应的操作、处理;否则,就通过浏览器给出具体的处理意见,并进行是单个输入处理或变量初始化操作,比如刷新卡片以让用户重新输入,或给用户指出输入错误所在并等待进一步的处理指令等。input元素是WML编程中处理用户交互活动的重要元素,它通过单独的<input/>标签进行定义,其语法格式如下:

<input name="variable" title="label" type="type" value="value" default="default" format="specifier" emptyok="false|true" size="n" maxlength="n" tabindex="n"/>

其中除了name属性是必选的以外,其他属性都是可选的。这些属性的功能和用法介绍如下: 1)name。该属性用于指定用来保存用户输入文本的变量和名称。定义name属性后WML将根据该属性也即变量名,为即将输入的文本实体对象与之存储空间,以便接收用户输入。

2)title。该属性用于input元素的标签,通常是位于输入框前的提示信息。

3)type。用于指定文本输入区的类型,有text和password两种选择。默认值为text,指定的用户可以输入文本,而且输入的文本会同时逐渐响应并显示在浏览器中。如果选择password,则指定用户输入的文本作为密码文本处理,WML程序按文本实体接收输入的数据,而浏览器上响应用户输入显示时逐渐均为星号(*),由此起到保密的目的。

4)value。该属性用于指定name属性所定义变量的值,它将显示在输入框中。

5)default。该属性用于指定name属性所定义变量的默认值。

6)format。该属性用于格式化输入的数据。

7)maxlength。该属性用于指定用户可输入字符串的最大长度。该属性的上限为256,最多不能超过256个字符。

8)emptyok。用于指定用户是否可以不在输入框内输入内容。

9)size。该属性用于指定输入框的宽度,宽度值为字符个数。

10)tabindex。用于指定多个输入框存在时,类似于HTML中Tab键的具体位置。 

onabort 当用户中断下载图像时触发。 
onactivate 当对象设置为活动元素时触发。 
onafterprint 对象所关联的文档打印或打印预览后立即在对象上触发。 
onafterupdate 当成功更新数据源对象中的关联对象后在数据绑定对象上触发。 
onbeforeactivate 对象要被设置为当前元素前立即触发。 
onbeforecopy 当选中区复制到系统剪贴板之前在源对象触发。 
onbeforecut 当选中区从文档中删除之前在源对象触发。 
onbeforedeactivate 在 activeElement 从当前对象变为父文档其它对象之前立即触发。 
onbeforeeditfocus 在包含于可编辑元素内的对象进入用户界面激活状态前或可编辑容器变成控件选中区前触发。 
onbeforepaste 在选中区从系统剪贴板粘贴到文档前在目标对象上触发。 
onbeforeprint 对象的关联文档打印或打印预览前在对象上触发。 
onbeforeunload 在页面将要被卸载前触发。 
onbeforeupdate 当成功更新数据源对象中的关联对象前在数据绑定对象上触发。 
onblur 在对象失去输入焦点时触发。 
onbounce 当 marquee 对象的 behavior 属性设置为"alternate"且字幕的内容到达窗口一边时触发。 
oncellchange 在数据供应者中的数据变更时触发。 
onchange 当对象或选中区的内容改变时触发。 
onclick 在用户用鼠标左键单击对象时触发。 
oncontextmenu 在用户使用鼠标右键单击客户区打开上下文菜单时触发。 
oncontrolselect 当用户将要对该对象制作一个控件选中区时触发。 
oncopy 当用户复制对象或选中区,将其添加到系统剪贴板上时在源元素上触发。 
oncut 当对象或选中区从文档中删除并添加到系统剪贴板上时在源元素上触发。 
ondataavailable 每当异步传输数据的数据源对象的数据到达时触发。 
ondatasetchanged 当数据源对象对应的数据集发生变更时触发。 
ondatasetcomplete 触发就表明数据源对象所有数据都可用。 
ondblclick 当用户双击对象时触发。 
ondeactivate 当 activeElement 从当前对象变为父文档其它对象时触发。 
ondrag 当进行拖曳操作时在源对象上持续触发。 
ondragend 当用户在拖曳操作结束后释放鼠标时在源对象上触发。 
ondragenter 当用户拖曳对象到一个合法拖曳目标时在目标元素上触发。 
ondragleave 当用户在拖曳操作过程中将鼠标移出合法拖曳目标时在目标对象上触发。 
ondragover 当用户拖曳对象划过合法拖曳目标时持续在目标元素上触发。 
ondragstart 当用户开始拖曳文本选中区或选中对象时在源对象上触发。 
ondrop 当鼠标按钮在拖曳操作过程中释放时在目标对象上触发。 
onerror 当对象装载过程中发生错误时触发。 
onerrorupdate 更新数据源对象中的关联数据出错时在数据绑定对象上触发。 
onfilterchange 当可视滤镜更改状态或完成转换时触发。 
onfinish 当字幕循环完成后触发。 
onfocus 当对象获得焦点时触发。 
onfocusin 当元素将要被设置为焦点之前触发。 
onfocusout 在移动焦点到其它元素之后立即触发于当前拥有焦点的元素上触发。 
onhelp 当用户在浏览器为当前窗口时按 F1 键时触发。 
onkeydown 当用户按下键盘按键时触发。 
onkeypress 当用户按下字面键时触发。 
onkeyup 当用户释放键盘按键时触发。 
onlayoutcomplete 当打印或打印预览版面处理完成用来自于源文档的内容填充当前 LayoutRect 对象时触发。 
onload 在浏览器完成对象的装载后立即触发。 
onlosecapture 当对象失去鼠标捕捉时触发。 
onmousedown 当用户用任何鼠标按钮单击对象时触发。 
onmouseenter 当用户将鼠标指针移动到对象内时触发。 
onmouseleave 当用户将鼠标指针移出对象边界时触发。 
onmousemove 当用户将鼠标划过对象时触发。 
onmouseout 当用户将鼠标指针移出对象边界时触发。 
onmouseover 当用户将鼠标指针移动到对象内时触发。 
onmouseup 当用户在鼠标位于对象之上时释放鼠标按钮时触发。 
onmousewheel 当鼠标滚轮按钮旋转时触发。 
onmove 当对象移动时触发。 
onmoveend 当对象停止移动时触发。 
onmovestart 当对象开始移动时触发。 
onpaste 当用户粘贴数据以便从系统剪贴板向文档传送数据时在目标对象上触发。 
onpropertychange 当在对象上发生对象上发生属性更改时触发。 
onreadystatechange 当对象状态变更时触发。 
onreset 当用户重置表单时触发。 
onresize 当对象的大小将要改变时触发。 
onresizeend 当用户更改完控件选中区中对象的尺寸时触发。 
onresizestart 当用户开始更改控件选中区中对象的尺寸时触发。 
onrowenter 触发就表明当前行已经在数据源中更改,对象上有可用的新数据值。 
onrowexit 当数据源控件更改对象当前行前触发。 
onrowsdelete 当行将要从记录集中被删除时触发。 
onrowsinserted 当在当前记录集中插入新行后触发。 
onscroll 当用户滚动对象的滚动条时触发。 
onselect 当当前选中区改变时触发。 
onselectionchange 当文档的选中状态改变时触发。 
onselectstart 对象将要被选中时触发。 
onstart 在 marquee 对象的每次循环开始时触发。 
onstop 当用户单击停止按钮或离开 Web 页面时触发。 
onsubmit 当表单将要被提交时触发。 
onunload 在对象卸载前立即触发。

分享到:
评论

相关推荐

    js对象属性大全下载

    Window对象代表浏览器窗口,是JavaScript中的全局对象,提供了与浏览器窗口相关的属性和方法。例如: - `alert(message)`:显示一个带有指定消息的警告对话框。 - `confirm(message)`:显示一个确认对话框,用户...

    JavaScript文档

    本资源包包含了多个关于JavaScript的重要参考资料,包括“JavaScript权威指南(英文版).chm”、“javascript5.5.chm”、“css2gb.chm”以及“JavaScript对象与数组参考大全 .chm”。 首先,我们来看“JavaScript权威...

    javaScript 中文开发文档

    13. **Node.js**:JavaScript还可以通过Node.js在服务器端运行,构建高性能的网络应用,利用其非阻塞I/O和事件驱动的模型。 14. **框架和库**:JavaScript社区有众多框架和库,如React、Vue、Angular用于前端开发,...

    使用JavaScript事件综合查询,js事件大全

    JavaScript事件是浏览器或Node.js环境中发生的特定行为,如用户点击按钮、页面加载完成或输入框获得焦点等。事件驱动编程是JavaScript的核心特性之一,通过监听和处理这些事件,我们可以创建响应式的用户体验。 二...

    html,javascript元素属性文档

    另外,JavaScript还有一套强大的对象模型,如DOM(文档对象模型),它允许我们以编程方式操纵HTML文档。 DOM2-Style是DOM的一个扩展,专门处理CSS样式。通过DOM,我们可以动态改变元素的样式属性,实现动态效果。...

    ThreeJS中文文档

    Three.js 是一个非常流行的JavaScript库,它用于在Web浏览器中创建和展示三维图形。这个库是基于 WebGL 技术的,WebGL 是一种允许在浏览器中进行硬件加速3D图形渲染的标准。Three.js通过简化复杂的WebGL API,使得...

    javascript,js帮助文档

    7. **原型与原型链**:JS中的每个对象都有一个proto属性,指向创建该对象的函数的原型,形成了原型链,这是实现继承的基础。 8. **面向对象**:JavaScript支持基于原型的面向对象编程,可以通过构造函数创建对象...

    javascript文档操作

    ### JavaScript文档操作知识点详解 #### 一、Document对象概述 **Document对象**是浏览器对象模型(BOM)中的核心组成部分之一,它表示加载在浏览器窗口中的HTML文档。通过Document对象,开发者能够实现对网页内容的...

    js帮助文档,帮助文档

    本压缩包“js帮助文档”包含了全面的JavaScript学习资料,是开发者学习和查阅JS语法、函数、对象、API以及最佳实践的重要资源。 1. **基础语法** JavaScript的基础包括变量、数据类型(如字符串、数字、布尔、null...

    JS操作DOM元素属性和方法大全

    **JS操作DOM元素属性和方法大全** 在JavaScript中,DOM(Document Object Model)是一种标准,用于表示HTML或XML文档的结构,并提供了与这些文档交互的方法。DOM是浏览器提供的一种接口,使得JavaScript能够读取、...

    jsTree中文文档

    **jsTree 中文文档概述** jsTree 是一个流行的JavaScript库,用于在网页上创建交互式的树状视图。它主要用于组织结构化的数据,如文件系统、数据库目录或自定义项目结构。jsTree 支持多种操作,包括点击、拖放、...

    javaScript属性详解

    本文将详细介绍JavaScript中的一些基础对象和数组,并探讨它们的属性、方法和事件处理程序。对于初学者而言,理解这些基本概念至关重要。 #### 2. Anchor对象 (B.1) **Anchor对象简介:** - **定义:** 使用 `...

    JS常用属性方法大全.pdf

    以上就是文档中所提到的一些JavaScript常用属性和方法的详解。通过这些知识点,可以构建基础的前端网页交互功能,以及进行更复杂的编程任务。需要注意的是,文档中的文字有些是通过OCR扫描识别出来的,可能会存在...

    Vue.js学习文档

    ### Vue.js 学习文档知识点总结 #### 一、Vue.js 概览 - **起源与发展**: - **起源**:Vue.js 最初由尤雨溪(Evan You)在2013年底作为个人实验项目开始开发。 - **公开发布**:2014年2月正式公开发布。 - **...

    fabricjs_API中文文档.zip

    这份中文文档详细解释了各种类、方法、属性和事件,使得国内开发者能够无障碍地学习和使用这个库。无论你是初学者还是有经验的开发者,都能从中找到你需要的信息,快速提升你的Canvas开发能力。 总的来说,Fabric....

    EXT JS 3.0 中文版文档

    通过阅读这些文档,开发者可以学习如何初始化组件、配置属性、监听事件、处理数据、以及如何与其他EXT JS 功能结合使用。此外,文档可能还会介绍一些最佳实践和常见问题解答,帮助开发者避免陷阱,提高开发效率。 ...

    JsGrid官网离线版/离线文档

    **JsGrid离线版文档详解** JsGrid是一款轻量级的JavaScript数据网格插件,它提供了丰富的功能,用于在Web应用中展示和编辑数据。这个离线版文档包含了所有关于JsGrid的重要信息,使得开发者无需互联网连接也能查阅...

    javascript文档

    六、事件与事件处理 事件是用户与网页交互时产生的触发点,JavaScript通过事件处理程序响应这些事件,实现交互性。常见的事件有点击(click)、鼠标移动(mousemove)、键盘输入(keydown)等。事件监听器可以使用...

    JavaScript学习文档大全.zip #资源分享达人#

    其中包含:Array对象的方法参考表格,Canvas参考手册,Date对象方法参考表格,HTML事件列表,jQuery的事件方法,jQuery选择器参考手册,Math参考文档,String对象方法参考表格,SVG参考手册,Window 对象属性与方法...

    ThreeJS中文API文档

    这个中文API文档将详细解释每个类、方法和属性,帮助开发者快速定位和学习THREE.JS的特定功能。同时,文档中的注释使得对于非英语背景的开发者来说,理解THREE.JS更为方便。通过深入阅读和实践,开发者可以创建出...

Global site tag (gtag.js) - Google Analytics