JS document attributes and events

Source: Internet
Author: User

JS Object Attributes

Document. title // set the document title is equivalent to the <title> tag of HTML.

Document. bgColor // set the background color of the page

Document. fgColor // set the foreground color (text color)

Document. linkColor // The link color that has not been clicked

Document. alinkColor // the color of the activation Link (focus on this link)

Document. vlinkColor // the color of the clicked Link

Document. URL // set the URL attribute to open another webpage in the same window

Document. fileCreatedDate // file creation date, read-only attribute

Document. fileModifiedDate // file modification date, read-only attribute

Document. fileSize // file size, read-only attribute

Document. cookie // set and read cookies

Document. charset // set the character set to simplified Chinese: gb2312

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

Object Method

Document. write () // dynamically write content to the page

Document. createElement (Tag) // create an html Tag object

Document. getElementById (ID) // get the object with the specified ID value

Document. getElementsByName (Name) // get the object with the specified Name value

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

Images set (images in the page)

A) reference through a set

Document. images // The label on the corresponding page

Document. images. length // Number of labels on the corresponding page

Document. images [0] // 1st tags

Document. images [I] // The I-1 label

B) direct reference through the nane attribute

Document. images. oImage // document. images. name attribute

C) reference the image's src attribute

Document. images. oImage. src // document. images. name attribute. src

D) create an image

Var oImage

OImage = new Image ()

Document. images. oImage. src = "http://www.pushad.com/1.jpg"

// At the same time, create a tag on the page to display it.

<Html>

<Script language = "javascript">

Var oImage

OImage = new Image ()

Document. images. oImage. src = "http://www.pushad.com/1.jpg"

</Script>

</Html>

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

Forms set (forms in the page)

A) reference through a set

Document. forms // The <form> tag on the corresponding page

Document. forms. length // Number of <form> labels on the corresponding page

Document. forms [0] // 1st <form> tags

Document. forms [I] // The I-1 <form> label

Document. forms [I]. length // number of controls in the I-1 <form>

Document. forms [I]. elements [j] // The I-1 control in the J-1 <form>

B) direct reference through the label name attribute

<Form name = "Myform"> <input name = "myctrl"> </form>

Document. Myform. myctrl // document. form name. Control name

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

<Html>

<! -- Script related to the Text control -->

<Form name = "Myform">

<Input type = "text" name = "oText">

<Input type = "password" name = "oPswd">

<Form>

<Script language = "javascript">

// Obtain the value of the text password box

Document. write (document. Myform. oText. value)

Document. write (document. Myform. oPswd. value)

</Script>

</Html>

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

<Html>

<! -- Select control-related 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">

// Traverse the option items of the select Control

Var length

Length = document. Myform. oSelect. length

For (I = 0; I <length; I ++)

Document. write (document. Myform. oSelect [I]. value)

</Script>

<Script language = "javascript">

// Traverse the option and determine whether an option is selected

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">

// Print the selected option based on SelectedIndex

// (0 to document. Myform. oSelect. length-1)

I = document. Myform. oSelect. selectedIndex

Document. write (document. Myform. oSelect [I]. value)

</Script>

<Script language = "javascript">

// Dynamically Add the option item of the select Control

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 // reference layer oDiv

Document. all. oDiv. style

Document. all. oDiv. style. display = "" // set the layer to visible.

Document. all. oDiv. style. display = "none" // The layers are hidden.

/* Document. all indicates the set of all objects in the document.

Only ie supports this attribute, so it is also used to determine the browser type */

Input element

The input element is used to define Text object. It contains specific provisions on the format, data type, length, value, variable name, and other attributes of the input text content. When the user input meets the requirements of the input element, the user receives the input information and assigns the specified variable flexible operations and processing; otherwise, the user gives specific processing opinions through the browser, and perform a single input processing or variable initialization operation, such as refreshing the card to allow the user to re-input, or to indicate the input error to the user and wait for further processing instructions. The input element is an important element in WML programming to process user interaction activities. It is defined by a separate <input/> label. Its Syntax format is as follows:

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

All the attributes except the name attribute are required. The functions and usage of these attributes are described as follows: 1) name. This attribute is used to specify the variables and names used to save the user input text. After the name attribute is defined, WML uses this attribute, that is, the variable name, as the storage space of the Text object to be input to receive user input.

2) title. This attribute is used for the label of the input element, usually the prompt information located before the input box.

3) type. Specifies the type of the text input area, which can be text or password. The default value is text. The specified user can enter text, and the entered text will gradually respond and be displayed in the browser. If "password" is selected, the text entered by the user is treated as the password text. The WML program receives the input data according to the text entity, and the browser gradually returns the asterisk (*) when the user input is displayed (*), this serves as the purpose of confidentiality.

4) value. This attribute is used to specify the value of the variable defined by the name attribute. It is displayed in the input box.

5) default. This attribute is used to specify the default value of the variable defined by the name attribute.

6) format. This attribute is used to format input data.

7) maxlength. This attribute is used to specify the maximum length of a string that a user can enter. This attribute can contain up to 256 characters and cannot exceed 256 characters.

8) emptyok. It is used to specify whether users can enter content outside the input box.

9) size. This attribute is used to specify the width of the input box, and the width value is the number of characters.

10) tabindex. It is used to specify the location where multiple input boxes exist, similar to the Tab key in HTML.

Onabort is triggered when the user interrupts image download.
Onactivate is triggered when the object is set to an active element.
The document associated with the onafterprint object is immediately triggered on the object after being printed or previewed.
Onafterupdate is triggered when the associated object in the data source object is updated successfully on the Data Binding object.
The onbeforeactivate object is triggered immediately before it is set to the current element.
Onbeforecopy is triggered in the source object before being copied to the system clipboard.
Onbeforecut is triggered in the source object before being deleted from the document in the central region.
Onbeforedeactivate is triggered immediately before activeElement changes from the current object to another object in the parent document.
Onbeforeeditfocus is triggered before an object contained in an editable element enters the user interface activation state or before the Editable container becomes the control selected area.
Onbeforepaste is triggered on the target object before being pasted from the system clipboard to the document in the selected area.
The associated document of the onbeforeprint object is triggered on the object before being printed or previewed.
Onbeforeunload is triggered before the page is to be detached.
Onbeforeupdate is triggered on the Data Binding object before the associated objects in the data source object are successfully updated.
Onblur is triggered when the object loses the input focus.
Onbounce is triggered when the behavior attribute of the marquee object is set to "alternate" and the subtitle content reaches the window side.
Oncellchange is triggered when the data in the data supplier changes.
Onchange is triggered when the content of the object or selected area changes.
Onclick is triggered when you left-click an object.
Oncontextmenu is triggered when you right-click the client area to open the context menu.
Oncontrolselect is triggered when you want to create a control area for this object.
Oncopy is triggered on the source element when you copy an object or select a zone and add it to the system clipboard.
Oncut is triggered on the source element when an object or selected area is deleted from the document and added to the system clipboard.
Ondataavailable is triggered whenever the data of the data source object that asynchronously transmits data arrives.
Ondatasetchanged is triggered when the dataset corresponding to the data source object changes.
When ondatasetcomplete is triggered, all data of the data source object is available.
Ondblclick is triggered when you double-click an object.
Ondeactivate is triggered when activeElement changes from the current object to another object in the parent document.
Ondrag is triggered continuously on the source object during the drag operation.
Ondragend is triggered on the source object when you release the mouse after the drag operation is complete.
Ondragenter is triggered on the target element when you drag an object to a valid drag target.
Ondragleave is triggered on the target object when you move the mouse out of a valid drag target during the drag operation.
Ondragover is triggered continuously on the target element when the user drags an object across a valid drag target.
Ondragstart is triggered when the user starts to drag the selected text area or the selected object on the source object.
Ondrop is triggered on the target object when the mouse button is released during the drag operation.
Onerror is triggered when an error occurs during object loading.
Onerrorupdate is triggered when an error occurs while updating the associated data in the data source object.
Onfilterchange is triggered when the visual filter changes the status or completes the conversion.
Onfinish is triggered when the subtitle loop is completed.
Onfocus is triggered when the object obtains the focus.
Onfocusin is triggered before the element is set to focus.
Onfocusout is triggered immediately after moving the focus to other elements on the element with the current focus.
Onhelp is triggered when you press the F1 key when the browser is the current window.
Onkeydown is triggered when you press the keyboard button.
Onkeypress is triggered when you press the literal key.
Onkeyup is triggered when the user releases the keyboard button.
Onlayoutcomplete is triggered when the LayoutRect object is filled with the content of the source document after the layout is printed or previewed.
Onload is triggered immediately after the browser completes object loading.
Onlosecapture is triggered when an object loses Mouse capture.
Onmousedown is triggered when you click an object with any mouse button.
Onmouseenter is triggered when you move the mouse pointer to an object.
Onmouseleave is triggered when the user moves the mouse pointer out of the Object Boundary.
Onmousemove is triggered when you move the mouse over an object.
Onmouseout is triggered when you move the mouse pointer out of the Object Boundary.
Onmouseover is triggered when you move the mouse pointer to an object.
Onmouseup is triggered when you release the mouse button when the mouse is over the object.
Onmousewheel is triggered when the scroll wheel button is rotated.
Onmove is triggered when the object is moved.
Onmoveend is triggered when the object is stopped.
Onmovestart is triggered when the object begins to move.
Onpaste is triggered on the target object when you paste data to transfer data from the system clipboard to the document.
Onpropertychange is triggered when attribute changes occur on the object.
Onreadystatechange is triggered when the object state changes.
Onreset is triggered when the user resets the form.
Onresize is triggered when the object size changes.
Onresizeend is triggered when you change the object size in the selected area of the control.
Onresizestart is triggered when you start to change the object size in the selected area of the control.
When onrowenter is triggered, it indicates that the current row has been changed in the data source and a new data value is available on the object.
Onrowexit is triggered when the data source control changes the current row of the object.
Onrowsdelete is triggered when a row is to be deleted from the record set.
Onrowsinserted is triggered when a new row is inserted in the current record set.
Onscroll is triggered when you scroll the scroll bar of an object.
Onselect is triggered when the selected area changes.
Onselectionchange is triggered when the selected state of the document changes.
Triggered when the onselectstart object is to be selected.
Onstart is triggered at the beginning of every cycle of the marquee object.
Onstop is triggered when you click the stop button or exit the Web page.
Onsubmit is triggered when the form is to be submitted.
Onunload is triggered immediately before the object is detached.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.