The Document property and JS method

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

The Document property

document.title //Set the document title equivalent to HTML title tags

document.bgColor //Set the page background color

document.fgColor //Set the foreground (text)

document.linkColor //Not visited link color

document.alinkColor //Activation link (focus on this link) color

document.vlinkColor //Has visited link color

document.URL //Set the URL property to open a webpage in the same window

document.fileCreatedDate //File creation date, the read-only attribute

document.fileModifiedDate //File modified date, the read-only attribute

document.charset //Set the character set simplified Chinese: GB2312

document.fileSize //The file size, the read-only attribute

document.cookie //Set up and read cookie——————————————————————

Common object method

document.write() //Dynamic page content to write

document.createElement(Tag) //Create a HTML tag object

document.getElementById(ID) //To obtain the object specified ID value

document.getElementsByName(Name) //To obtain the object specified Name value



Body- main sub object

document.body //Beginning to specify and end of the document body is equivalent to body>/body>

document.body.bgColor //Gets or sets the background color of the object. //Not visited link color

document.body.alink //Activation link (focus on this link) color

document.body.vlink //Has visited link color

document.body.text //Text color

document.body.innerText //Set the body> … /body> text between the

document.body.innerHTML //Set the body> … /body> HTML code between

document.body.topMargin //The page margins

document.body.leftMargin //Left of the page margins

document.body.rightMargin //The top of the page margins

document.body.bottomMargin //Page margins

document.body.background //Background picture

document.body.appendChild(oTag) //Dynamically generate a HTML object

Common Object Events

document.body.onclick=”func()” //The mouse pointer click object is triggered

document.body.onmouseover=”func()” //Trigger the mouse pointer to the object

document.body.onmouseout=”func()” //Trigger the mouse pointer moves out of the object


The location of the location- sub object

document.location.hash // #After the part No. // Domain name + port number // as if returned is localhost host name, port number did not return

document.location.hostname // Domain name

document.location.href // The complete URL

document.location.pathname // Directory

document.location.port // The port number

document.location.protocol // Network protocol(http:) // ?After the part No.

documeny.location.reload() //Refresh webpage

document.location.reload(URL) //Open a new webpage

document.location.assign(URL) //Open a new webpage

document.location.replace(URL) //Open a new webpage


Selection- constituency sub object


For example:

<div>Please select some text here. </div>

<div><input type="button" value="Select the part of the text, and then click here to execute empty" /></div>

<script type="text/javascript" language="javascript">


function Foo()






The createRange method selection

document.selection.createRange() According to the current text select returns a TextRange object, or according to the controls to choose return a ControlRange object.

With the execCommand, very useful, in the HTML editor such as: text bold, italic, copy, paste, to create hyperlinks.

These seemed to be only implementation under IE. .


The images collection (image of the page)

a)Through the collection of reference

document.images //The corresponding page img Tags

document.images.length //A number corresponding to the page img Tags

document.images[0] //First img Tags

document.images[i] //The I-1 img tag

b)Reference directly through the name property

img name=”oImage”

document.images.oImage //The property

c)Refer to the SRC property of the picture

document.images.oImage.src //The property.Src

d)Create an image

var oImage

oImage = new Image()


At the same time, the establishment of a img / corresponding tag and can be displayed on the page


The forms collection (page form)

a)Through the collection of reference

document.forms //The corresponding page form tags

document.forms.length //A number corresponding to the page /formform Tags

document.forms[0] //First /formform Tags

document.forms[i] //The i-1 /formform tag

document.forms[i].length //The i-1 /formform control number

document.forms[i].elements[j] //The i-1 /formform in the J-1 controls

b)Reference directly through the tag name attribute

/formform name=”Myform”>input name=”myctrl”/>/form

document.Myform.myctrl //Document. forms controls name name.

c)Attribute access form

document.forms[i].name //The corresponding form name> property

document.forms[i].action //The corresponding /formform action> property

document.forms[i].encoding //The corresponding /formform enctype> property

document.forms[i].target //The corresponding /formform target> property

document.forms[i].appendChild(oTag) //Dynamic insertion of a control

document.all.oDiv //Reference layer oDiv”" //Layer is visible”none” //Layer is set to hide

document.getElementId(”oDiv”) //Refer to the object by getElementId



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

Only ie support this property, so it is used to determine whether the browser type*/

The 4 attribute layer object

document.getElementById(”ID”).innerText //Dynamic output text

document.getElementById(”ID”).innerHTML //A dynamic output HTML

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

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

The article quoted

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download

Posted by Rex at November 14, 2013 - 1:35 PM