JavaScript (JS) pathname Example: HTML DOM Objects – Area Object – JavaScript (JS) pathname Example

"I tried to learn .NET by taking boot camp classes that cost me $6,000. After taking the classes, I discovered tons of free (and very cheap) videos on the internet created by experts in the field. I found the videos to be much better than the classrooms. The videos were presented by Microsoft presenters that knew the material backwards and forwards, and they were much cheaper and better than the classroom teachers. I have spent the last three years organizing and hunting down the videos for my own use and decided that all could benefit by sharing what I found." - Wade Harvey

Click Here for Free 24 hour pass to lynda.com.
I AM VERY EXCITED ABOUT THIS AMAZING NEW DISCOVERY
Over 40,000 Top-Notch Video Tutorials (or 3,452 hours) on Lynda.com
I had stumbled across Lynda.com many times before, but never stopped to try it out. I recently took the plunge and started using Lynda.com to help me improve my javascript skills (See Javascript Essential Training 2007 by Dori Smith). It has revolutionized my understanding of the language! I love the fact that the exercise files allow you to follow along in real time with what the instructor is saying. Learning by doing is an extremely powerful technique. I have to give the site an A+ for both quality and content.

I am planning on using Lynda Videos to help me improve in:

1. HTML
2. CSS
3. Classic ASP
4. .NET (included in ASP section)
5. AJAX
6. Silverlight (in Microsoft Section)
7. SharePoint (in Microsoft Section)
8. Web Design
9. Blogging
10. SEO
11. and much more

You can learn more about Lynda.com by watching the 5-minute video at About Lynda.com. If you are only focusing on .NET, you are missing out on the "big picture" and on many of the underlying fundamentals! To be an Ideal Programmer, you need to have the largest knowledge base possible.

Looking for premium .NET Training Videos? The best premium .NET Videos that I have found are at Learn Visual Studio. Those videos are only about 50 cents per hour, as compared to $25 per hour that other sites charge!

LearnVisualStudio is currently having a 25% off sale ($50 savings) and giving away a free membership to TrainingSpot ($60 value) when LVS Lifetime Membership is purchased.

  
  

Limited Time Offer: Free Lifetime Membership to Progress Monitor ($24.95 value) when you purchase any membership at Learn Visual Studio, Lynda Videos or any hosting account at DiscountASP - just forward order confirmation to harvey007@sbcglobal.net

JavaScript (JS) pathname Example: HTML DOM Objects – Area Object – JavaScript (JS) pathname Example

Purpose: – Illustrates the JavaScript syntax for the Area Object pathname Property .

Prerequistes:

• Install Visual Web Developer 2008

Syntax: AreaObject.pathname="pathname" – Allows you to access the pathname of url for an AreaObject. pathname is what is after domain name in url.

Restrictions: None

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. Add New folder named "HTMLDOMObjects"
   • Right-click project name in solution explorer;
   • add new folder;
   • name of folder should be: HTMLDOMObjects
4. Add New subfolder to "HTMLDOMObjects" folder named "DOMArea"
   • Right-click folder named "HTMLDOMObjects" in solution explorer;
   • add new folder;
   • name of folder should be: DOMArea
5. Add New subfolder to "DOMArea" subfolder named "AreaObjectProperties"
   • Right-click subfolder named "DOMArea" in solution explorer;
   • add new folder;
   • name of folder should be: AreaObjectProperties
6. Add HTML Page Named pathname to AreaObjectProperties subfolder
   • Right-click AreaObjectProperties subfolder;
   • add new item;
   • Select HTML Page
   • HTML Page name should be pathname
7. Click on copy code in code below to copy code into HTML Page pathname.htm
8. Right-click on HTML page pathname.htm and select view in browser

 HTML | 
 copy code |
?
 
01
02
     < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
03
 
04
    <html>
05
      <head>
06
        <title>IdealProgrammer.com: pathname</title>
07
        <!-- 
08
        ***************************************************
09
        * This example is from http://idealprogrammer.com *
10
        ***************************************************
11
        Note:
12
        coords for rect = "upperleftx,upperlefty,bottomrightx,bottomrighty"
13
        coords for circle = x,y,r where x and y are center and r is radius
14
        coords for poly = x1,y1,x2,y2,...
15
        -->
16
       </head>
17
      <body>
18
      <a href="http://idealprogrammer.com">Ideal Programmer</a><br /><br />
19
    <img src ="http://idealprogrammer.com/wp-photos/goldbottle.jpg" width="200" height="200" alt="Planets"
20
    usemap ="#goldmap" /><br /> <br />
21
 
22
    <map name="goldmap" id="goldmapid">
23
    <area id="Area1" shape="rect" coords="0,0,100,100" href="http://www.google.com" alt="google" accesskey="1" />
24
    <area id="Area2" shape="rect" coords="100,0,200,100" pathname="pathname" href="http://www.yahoo.com" alt="yahoo" accesskey="2" />
25
    <area id="Area3" shape="rect" coords="0,100,100,200" href="http://idealprogrammer.com" alt="idealprogrammer" accesskey="3" />
26
    <area id="Area4" shape="rect" coords="100,100,200,200" href="http://progressmonitor.com" alt="progressmonitor" accesskey="4" />
27
 
28
    </map>
29
    <script type="text/javascript">
30
 
31
        //*****************************************************
32
        // DOM Objects
33
        //*****************************************************
34
 
35
 
36
        //*****************************************************
37
        //    ***    Area Object Property   ***
38
        //*****************************************************
39
 
40
        //*****************************************************
41
        // pathname
42
        //*****************************************************
43
 
44
        //    SYNTAX:
45
        //    areaObject.pathname="pathname"  Allows you to access the pathname
46
        //               property of a areaObject in an image map. If pathname is
47
        //               true the link is not active.
48
 
49
        // Two ways to retrieve pathname   
50
        //   1. GetElementsByTagName
51
        myObject = document.getElementsByTagName('area')[0];
52
        document.write("Area1 - Using getElementsByTagName : " + myObject.pathname);
53
        document.write("<br />");
54
        //   2. GetElementById
55
        document.write("Area2 - Using getElementById: ");
56
        document.write(document.getElementById('Area2').pathname);
57
 
58
        document.write("<br /><br />");
59
        // Two ways to assign pathname
60
 
61
        //   1. GetElementById
62
        myArea3 = document.getElementById('Area3');
63
        myArea3.pathname = "pathname";
64
        document.write("<br />Area3 changed to pathname: ", myArea3.pathname);
65
 
66
        //   2. GetElementsByTagName      
67
        myArea4 = document.getElementsByTagName('area')[3];
68
        myArea4.pathname = "pathname";
69
        document.write("<br />Area4 changed to pathname: ", myArea4.pathname)
70
 
71
 
72
    </script>
73
 
74
 
75
      </body>
76
    </html>
77
 
78
 
79
 
80
 
81

Related posts:

1. JavaScript (JS) coords Example: HTML DOM Objects – Area Object – JavaScript (JS) coords Example JavaScript (JS) coords Example: HTML DOM Objects - Area Object...
2. JavaScript (JS) id Example: HTML DOM Objects – Area Object – JavaScript (JS) id Example JavaScript (JS) id Example: HTML DOM Objects - Area Object...
3. JavaScript (JS) alt Example: HTML DOM Objects – Area Object – JavaScript (JS) alt Example JavaScript (JS) alt Example: HTML DOM Objects - Area Object...
4. JavaScript (JS) accessKey Example: HTML DOM Objects – Area Object – JavaScript (JS) accessKey Example JavaScript (JS) accessKey Example: HTML DOM Objects - Area Object...
5. JavaScript (JS) href Example: HTML DOM Objects – Area Object – JavaScript (JS) href Example JavaScript (JS) href Example: HTML DOM Objects - Area Object...

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