GetElementById Example JavaScript (JS): HTML DOM Objects – Document Object Methods – GetElementById Example JavaScript (JS)

Get 5 Hours of FREE PREMIUM Videos:

LearnVisualStudio.NET Free Preview


LearnVisualStudio.NET Free Preview: Declaring Variables and Assigning Values

I am a lifetime member of LearnVisualStudio.net and a Premium Plus member of dotNetVideos.net.

LearnVisualStudio.net is awesome because it grows in value each year as more videos are added.

dotNetVideos.net is also great because it focuses a lot on MS Certifications and practical interview questions.


- Wade Harvey (IdealProgrammer.com)

LearnVisualStudio Premium Videos

Visual C# 2010 for Absolute Beginners C# for Absolute Beginners C# for Absolute Beginners Study Guide Visual Basic for Absolute Beginners Visual Basic Express Edition Study Guide
Visual Basic 9.0 Language Enhancements Entity Framework Linq To Sql Windows Phone 7 Development Unit Testing
ASP.NET MVC 3 (In Progress) ASP.NET MVC Hands On Project ASP.NET For Absolute Beginners Visual Web Developer C# Study Guide Visual Web Developer VB.NET Study Guide
ASP.NET Controls Series ASP.NET AJAX ASP.NET Architecture Series ASP.NET Server Controls Silverlight 4.0
Windows Presentation Foundation Windows Forms Controls Visual Studio 2010 New Features Visual Studio Team System 2008 Visual Studio Team System Features
Getting Started With Sql Server Express Edition


dotNetVideos Premium Video Catalog

Interview Questions & Answers Windows AzureASP.NET MVC 4Windows Phone 7 (3 Videos)Visual Studio 2011 Application Lifecycle Management
LightSwitchHTML 5SOLIDVisual Studio Add-OnsVisual Studio 2010 ALM Lab Management
ASP.NET 4 Deep Dive Microsoft Enterprise Library 5 with ASP.NET 4 (10 Videos)Virtualization Techniques for Developer (5 Videos)Test Series - 70-519: Designing and Developing Web Applications Using Microsoft .NET Framework 4 (20+ Videos)
Test Series - 70-519: Supplemental70-513: Test Series (MCTS) Windows Communication Foundation 4 (20+ Videos)70-515:Web Applications Development with Microsoft .NET Framework 4 (20+ Videos)Test Series - 70-516: Accessing Data with Microsoft .NET Framework 4 (20+ Videos)Test Series: 70-432: Microsoft SQL Server 2008, Implementation and Maintenance (20+ Videos)
Test Series: 70-433: SQL Server AdministrationFrom Novice To Professional - C# (25 Videos)From Novice To Professional - VB.NET (25 Videos)




Premium (Not Free) Video Tutorials

Free Video Tutorials & Free Tools

GetElementById Example JavaScript (JS): HTML DOM Objects – Document Object Methods – GetElementById Example JavaScript (JS)

Purpose: – Illustrates the for the .

View Other HTML DOM Document Objects

Prerequistes:

Syntax: getElementById("objectid") – Allows you to access the first object with the specified id

Restrictions: Does not work in Firefox

Notes:

  • You can build your own library of syntax examples by using same web site over and over and just add new files to it.

Instructions:

  1. Use Visual Web Developer 2008
  2. Create new web site;
    • Click File/New Web Site
    • Select ASP.NET Website Template
    • Select C-Sharp for Language
    • name of Web Site could be JavaScript_Syntax.
  3. Folder

  4. Add New folder named "HTMLDOMObjects"
    • Right-click project name in solution explorer;
    • add new folder;
    • name of folder should be: HTMLDOMObjects
  5. Add New subfolder to "HTMLDOMObjects" folder named "DocumentObjectMethods"
    • Right-click folder named "HTMLDOMObjects" in solution explorer;
    • add new folder;
    • name of folder should be: DocumentObjectMethods
  6. Add HTML Page Named GetElementById to DocumentObjectMethods subfolder
    • Right-click DocumentObjectMethods subfolder;
    • add new item;
    • Select HTML Page
    • HTML Page name should be GetElementById
  7. Click on copy code in code below to copy code into HTML Page GetElementById.htm
  8. Right-click on HTML page GetElementById.htm and select view in browser
  9.  HTML |  copy code |? 
    < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     
    <html>
      <head>
        <title>IdealProgrammer.com: getElementById() </title>
        <!-- 
        ***************************************************
        * This example is from http://idealprogrammer.com *
        ***************************************************
        -->
     
        <script type="text/javascript">
            //*****************************************************
            // DOM Document
            //*****************************************************
     
     
            //*****************************************************
            //    ***    Document Object Methods   ***
            //*****************************************************
     
            //*****************************************************
            // getElementById()
            //*****************************************************
     
            //    SYNTAX:
            //    getElementById()      Allows you to access the first object with the specified id
            //
     
     
     
            function retrieveText() {
                var x = document.getElementById("myDiv")
                TextArea1.value = x.innerHTML
            }
    </script>
       </head>
      <body>
      <div id="myDiv" onclick="retrieveText()">Click on this text to see it magically appear in textbox</div>
      <br /> <br />
     
          <textarea id="TextArea1" cols="35" rows="3"></textarea>
      </body>
    </html>
     

Related posts:

  1. Close Example JavaScript (JS): HTML DOM Objects – Document Object Methods – Close Example JavaScript (JS) Close Example JavaScript (JS): HTML DOM Objects - Document Object...
  2. URL Example JavaScript (JS): HTML DOM Objects – Document Object Properties – URL Example JavaScript (JS) URL Example JavaScript (JS): HTML DOM Objects - Document Object...
  3. Title Example JavaScript (JS): HTML DOM Objects – Document Object Properties – Title Example JavaScript (JS) Title Example JavaScript (JS): HTML DOM Objects - Document Object...
  4. Referrer Example JavaScript (JS): HTML DOM Objects – Document Object Properties – Referrer Example JavaScript (JS) Referrer Example JavaScript (JS): HTML DOM Objects - Document Object...
  5. Body Example JavaScript (JS): HTML DOM Objects – Document Object Properties – Body Example JavaScript (JS) Body Example JavaScript (JS): HTML DOM Objects - Document Object...

Related posts brought to you by Yet Another Related Posts Plugin.

Speak Your Mind

Tell us what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!

Powered by WP Hashcash

This blog uses the cross-linker plugin developed by Web-Developers.Net