Exforsys

JavaScript Tutorial

  1. JavaScript Browser Objects Part 2
  2. JavaScript Frame object
  3. JavaScript Form Object
  4. JavaScript FileUpload Object
  5. JavaScript Event Object Properties and Methods
  6. JavaScript Event Object
  7. JavaScript Elements and Embed Objects
  8. JavaScript Applet Objects
  9. JavaScript Browser Objects
  10. JavaScript Object Oriented Features
  11. JavaScript Window Object Open Method Part 2
  12. JavaScript Window Object Open Method
  13. JavaScript Window Object Timeout Methods
  14. JavaScript Location Object
  15. JavaScript Location Object Properties
  16. JavaScript History Object Properties and Methods
  17. JavaScript Document Object Methods Part II
  18. JavaScript Document Object Methods Part I
  19. JavaScript Document Object Properties
  20. JavaScript Document Object
  21. JavaScript Windows Object Properties Part II
  22. JavaScript Windows Object Properties Part I
  23. JavaScript DOM Window Object
  24. Working with JavaScript DOM Objects
  25. JavaScript Array Object Methods – Part II
  26. JavaScript Array Object
  27. JavaScript Array Object Methods – Part I
  28. JavaScript Boolean Object
  29. JavaScript OnError Event
  30. JavaScript Exception Handling – Part II
  31. JavaScript Exception Handling – Part I
  32. JavaScript Event Handler
  33. JavaScript Events Handling
  34. JavaScript Array Operations
  35. JavaScript Two Dimensional Arrays
  36. Passing values to JavaScript Function
  37. JavaScript Functions
  38. JavaScript Arrays
  39. JavaScript Iterative Structures - Part II
  40. JavaScript Iterative Structures - Part I
  41. JavaScript Math Object
  42. JavaScript Date Object
  43. JavaScript String Object
  44. JavaScript Objects
  45. JavaScript Confirm Box
  46. JavaScript Alert Box
  47. JavaScript Conditional Statements Part 2
  48. JavaScript Conditional Statements Part 1
  49. How to use JavaScript in HTML page
  50. JavaScript Variables
  51. JavaScript Features
  52. JavaScript Introduction

Ads


Home arrow Technical Training arrow JavaScript Tutorial

JavaScript Document Object Methods Part II

Author : Exforsys Inc.     Published on: 7th Aug 2007

JavaScript Document Object Methods Part II

In this JavaScript tutorial, you will learn about document object methods - getElementsByTagName, getSelection, handleEvent, releaseEvents, routeEvent, write, writeln along with syntax, examples and brief explanation.

Ads

getElementsByTagName:

The the getElementsTagName() method returns a collection of objects with the specified TagNAME given in argument. The programmer can enter an asterisk ("*") as the parameter to retrieve a list of all elements within the document.

The general syntax for using the getElementsByName method of document object is as follows:

document.getElementsByTagName(tagname)

for example:


<html>
   <
head>
      <
script type="text/javascript">
        function Exforinput()
        {
          var test=document.getElementsByTagName("input");
          alert(test.length);
        }
    
 </script>
   <
/head>
 

   <body>
      <input name="Exforsys" type="text" size="30" /><br />
      <input name="Exforsys" type="text" size="30" /><br />
      <input type="button" onclick="Exforinput()"
      value="Click to see the number of tag with input as
      tag name" />
   </body>
</
html>

The output of the above program is

and a button with message

Click to see the number of tag with input as tag name

When this button is clicked, the output appears as:

3

The statement document.getElementsByTagName("input") returns the object with tag name as Input. There are three elements with input as tag name (as seen in the program) so the displayed result is 3.

getSelection:

A programmer can return the contents of a selected text in the current document by using the getSelection()method.

The general syntax for using the getSelection method of document object is as follows:

document.getSelection( )

for example:


<html>
   <
head>
      <
script type="text/javascript">
      </
script>
   <
/head>
 

   <body>
      <INPUT TYPE="BUTTON" VALUE="Selected Highlighted Text
      is Displayed!!" onClick="alert('You have selected the
      text:\n'+document.getSelection());">
   </body>
</
html>

In the above, when the button is pressed, the message:

Selected Highlighted Text is Displayed!!

The selected text in the current document displays as:

You have selected the text: xxxx

The document.getSelection() method returns the contents of a selected text in the current document.

handleEvent:

For the handleEvent method, the event is specified as a parameter and the method calls the corresponding handler for the specified event. When a call of the handleEvent method is made, a search for the corresponding available set of event handler functions is performed. This is then passed to the event for an appropriately mapped handler function.

The general syntax for using the handleEvent method of document object is as follows:

document.handleEvent(event)

releaseEvents:

The releaseEvents method is used for indicating the events that are no longer needed. This is captured by the receiving Document object. The functionality is similar to that of window.releaseEvents() method.

The general syntax for using the releaseEvents method of document object is as follows:

document.releaseEvents(eventType)

In the above, any event of the eventType mentioned in a parameter is released. This is passed down to the Document Object for capturing.

routeEvent:

The routeEvent() method passes all previously captured events of the event type passed through their normal event processes.

The general syntax for using the routeEvent method of document object is as follows:

document.routeEvent(event)

write:

If a programmer wishes to write HTML expressions to the specified document, then it can be done using write method of document object.

The general syntax for using the write method of document object is as follows:

document.write(exp1,exp2,....)

In the above syntax, it is evident that the programmer can write multiple expressions, each separated by commas, and placed in the order of their occurrence. The values given in arguments are converted to a string value, appended to the content of the document window and then interpreted as HTML. This technique can be widely used to create dynamically changing pages.

An example to understand the write method in detail:


<html>
   <
body>
      <
script type="text/javascript">
        
document.write("Welcome to Exforsys!")
      </script>
   </
body>
</
html>

The above example would give output as below

Welcome to Exforsys!

A simple example where more than one expression using document.write method is written:


<html>
   <
body>
      <
script type="text/javascript">
          document.write("Welcome All","To Exforsys!","<p
          style='color:red;'>Training Division</p>")        
      </script>
   </
body>
</
html>

The output of the above program is

Welcome All To Exforsys!

Training Division

writeln:

The functionality of writeln method of document object is similar to that of write method but here in writeln method in addition a new line character is written after each expression. The writeln method places a carriage return after the written value of each expression.

The general syntax for using the writeln method of document object is as follows:

document.writeln(exp1,exp2,....)

Ads

for example:


<html>
   <
body>
      <
script type="text/javascript">
        
document.writeln("Welcome to Exforsys!")
      </script>
   </
body>
</
html>

The above example would give output as below

Welcome to Exforsys!

In the above output, a carriage is placed after the display of output is written.



 
This tutorial is part of a JavaScript Tutorial tutorial series. Read it from the beginning and learn yourself.

JavaScript Tutorial

  1. JavaScript Browser Objects Part 2
  2. JavaScript Frame object
  3. JavaScript Form Object
  4. JavaScript FileUpload Object
  5. JavaScript Event Object Properties and Methods
  6. JavaScript Event Object
  7. JavaScript Elements and Embed Objects
  8. JavaScript Applet Objects
  9. JavaScript Browser Objects
  10. JavaScript Object Oriented Features
  11. JavaScript Window Object Open Method Part 2
  12. JavaScript Window Object Open Method
  13. JavaScript Window Object Timeout Methods
  14. JavaScript Location Object
  15. JavaScript Location Object Properties
  16. JavaScript History Object Properties and Methods
  17. JavaScript Document Object Methods Part II
  18. JavaScript Document Object Methods Part I
  19. JavaScript Document Object Properties
  20. JavaScript Document Object
  21. JavaScript Windows Object Properties Part II
  22. JavaScript Windows Object Properties Part I
  23. JavaScript DOM Window Object
  24. Working with JavaScript DOM Objects
  25. JavaScript Array Object Methods – Part II
  26. JavaScript Array Object
  27. JavaScript Array Object Methods – Part I
  28. JavaScript Boolean Object
  29. JavaScript OnError Event
  30. JavaScript Exception Handling – Part II
  31. JavaScript Exception Handling – Part I
  32. JavaScript Event Handler
  33. JavaScript Events Handling
  34. JavaScript Array Operations
  35. JavaScript Two Dimensional Arrays
  36. Passing values to JavaScript Function
  37. JavaScript Functions
  38. JavaScript Arrays
  39. JavaScript Iterative Structures - Part II
  40. JavaScript Iterative Structures - Part I
  41. JavaScript Math Object
  42. JavaScript Date Object
  43. JavaScript String Object
  44. JavaScript Objects
  45. JavaScript Confirm Box
  46. JavaScript Alert Box
  47. JavaScript Conditional Statements Part 2
  48. JavaScript Conditional Statements Part 1
  49. How to use JavaScript in HTML page
  50. JavaScript Variables
  51. JavaScript Features
  52. JavaScript Introduction
 

Comments