HTML DOM Examples
Examples of HTML DOM objects accessed and manipulated using JavaScript.
Document Object
- Output text using document.write()
- Output HTML using document.write()
- Return the number of anchors in the document
- Return the innerHTML of the first anchor in the document
- Return the number of forms in the document
- Return the name of the first form in the document
- Return the number of images in the document
- Return the ID of the first image in the document
- Return the number of links in the document
- Return the ID of the first link in the document
- Return all cookies' name/value pairs in the document
- Return the server domain name of the loaded document
- Return the last modified time of the document
- Return the URL of the current loaded document
- Return the title of the document
- Return the full URL of the document
- Open an output stream and input text into it
- Difference between write() and writeln()
- Pop out the innerHTML of an element with a specified ID
- Pop out the number of elements with a specified name
- Pop out the number of elements with a specified tag name
- For more Document object examples, see our JavaScript Reference Manual.
Anchor Object
- Return and set the charset attribute of a link
- Return and set the href attribute of a link
- Return and set the hreflang attribute of a link
- Return the name of an anchor
- Return the relationship between the current file and the linked document
- Change the target attribute of a link
- Return the value of a link's type attribute
- For more Anchor object examples, see our JavaScript Reference Manual.
Area Object
- Return the alternative text for a specific area of an image map
- Return the coordinates of a specific area of an image map
- Return the anchor part of the href attribute for a specific area
- Return the hostname:port of a specific area of an image map
- Return the hostname of a specific area of an image map
- Return the port of a specific area of an image map
- Return the href of a specific area of an image map
- Return the pathname of a specific area of an image map
- Return the protocol of a specific area of an image map
- Return the querystring part of the href attribute for a specific area
- Return the shape of a specific area of an image map
- Return the target value of a specific area of an image map
- For more Area object examples, see our JavaScript Reference Manual.
Base Object
- Return the base URL for all relative URLs on the page
- Return the base target for all relative links on the page
- For more Base object examples, see our JavaScript Reference Manual.
Button Object
- Disable a button after it is clicked
- Return the name of a button
- Return the type of a button
- Return the value of a button
- Return the ID of the form a button belongs to
- For more Button object examples, see our JavaScript Reference Manual.
Form Object
- Return the values of all elements in a form
- Return the value of the acceptCharset attribute of a form
- Return the value of the action attribute of a form
- Return the value of the enctype attribute of a form
- Return the number of elements in a form
- Return the method used to submit form data
- Return the name of a form
- Return the value of the target attribute of a form
- Reset a form
- Submit a form
- For more Form object examples, see our JavaScript Reference Manual.
Frame/IFrame Object
- Align an iframe
- Change the background color of a document contained in an iframe
- Return the value of the frameborder attribute of an iframe
- Remove the frameborder of an iframe
- Change the height and width of an iframe
- Return the value of the longdesc attribute of an iframe
- Return the value of the marginheight attribute of an iframe
- Return the value of the marginwidth attribute of an iframe
- Return the value of the name attribute of an iframe
- Return and set the value of the scrolling attribute of an iframe
- For more Frame/IFrame object examples, see our JavaScript Reference Manual.
More Frame/IFrame object examples in our JavaScript Reference Manual.
Image Object
- Align an image
- Return the alternative text of an image
- Add a border to an image
- Change the height and width of an image
- Set the hspace and vspace properties of an image
- Return the value of the longdesc attribute of an image
- Create a link to a low-resolution image
- Return the name of an image
- Change the src of an image
- Return the value of the usemap attribute for a client-side image map
- More Image object examples in our JavaScript Reference Manual.
Event Object
- Which mouse button was clicked?
- Keycode of the pressed keyboard key?
- Coordinates of the mouse?
- Coordinates of the mouse relative to the screen?
- Was the shift key pressed?
- Which element was clicked?
- Which event occurred?
Option and Select Objects
- Disable and enable a dropdown list
- Get the ID of the form containing the dropdown list
- Get the number of options in the dropdown list
- Make the dropdown list multi-line
- Select multiple options in the dropdown list
- Populate all options in the dropdown list
- Populate the index of the selected option in the dropdown list
- Change the text of the selected option in the dropdown list
- Remove an option from the dropdown list
Table, TableHeader, TableRow, TableData Objects
- Change the width of the table border
- Change the cellpadding and cellspacing of the table
- Specify the frame of the table
- Specify the rules for the table
- The innerHTML of a row
- The innerHTML of a cell
- Create a caption for the table
- Delete a row from the table
- Add a row to the table
- Add a cell to a table row
- Horizontally align cell content
- Vertically align cell content
- Horizontally align content in a single cell
- Vertically align content in a single cell
- Change the content of a cell
- Change the number of columns a cell spans (colspan attribute)