Progress Monitor for IdealProgrammer.com

Take Swift, Intelligent, Massive, Planned, Loving, Effective (S.I.M.P.L.E.) Action to Transform Self into Ideal

Skip Repetitive Navigational Links

Home

News

Presenters

Contact

Please login

JavaScript (JS) pathname Example

Description: Illustrates the JavaScript syntax for the Area Object pathname Property .

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

JavaScript (JS) pathname Example 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: pathname</title>
        <!-- 
        ***************************************************
        * This example is from http://idealprogrammer.com *
        ***************************************************
        Note:
        coords for rect = "upperleftx,upperlefty,bottomrightx,bottomrighty"
        coords for circle = x,y,r where x and y are center and r is radius
        coords for poly = x1,y1,x2,y2,...
        -->
       </head>
      <body>
      <a href="http://idealprogrammer.com">Ideal Programmer</a><br /><br />
    <img src ="http://idealprogrammer.com/wp-photos/goldbottle.jpg" width="200" height="200" alt="Planets"
    usemap ="#goldmap" /><br /> <br />
 
    <map name="goldmap" id="goldmapid">
    <area id="Area1" shape="rect" coords="0,0,100,100" href="http://www.google.com" alt="google" accesskey="1" />
    <area id="Area2" shape="rect" coords="100,0,200,100" pathname="pathname" href="http://www.yahoo.com" alt="yahoo" accesskey="2" />
    <area id="Area3" shape="rect" coords="0,100,100,200" href="http://idealprogrammer.com" alt="idealprogrammer" accesskey="3" />
    <area id="Area4" shape="rect" coords="100,100,200,200" href="http://progressmonitor.com" alt="progressmonitor" accesskey="4" />
 
    </map>
    <script type="text/javascript">
 
        //*****************************************************
        // DOM Objects
        //*****************************************************
 
 
        //*****************************************************
        //    ***    Area Object Property   ***
        //*****************************************************
 
        //*****************************************************
        // pathname
        //*****************************************************
 
        //    SYNTAX:
        //    areaObject.pathname="pathname"  Allows you to access the pathname
        //               property of a areaObject in an image map. If pathname is
        //               true the link is not active.
 
        // Two ways to retrieve pathname   
        //   1. GetElementsByTagName
        myObject = document.getElementsByTagName('area')[0];
        document.write("Area1 - Using getElementsByTagName : " + myObject.pathname);
        document.write("<br />");
        //   2. GetElementById
        document.write("Area2 - Using getElementById: ");
        document.write(document.getElementById('Area2').pathname);
 
        document.write("<br /><br />");
        // Two ways to assign pathname
 
        //   1. GetElementById
        myArea3 = document.getElementById('Area3');
        myArea3.pathname = "pathname";
        document.write("<br />Area3 changed to pathname: ", myArea3.pathname);
 
        //   2. GetElementsByTagName      
        myArea4 = document.getElementsByTagName('area')[3];
        myArea4.pathname = "pathname";
        document.write("<br />Area4 changed to pathname: ", myArea4.pathname)
 
 
    </script>
 
 
      </body>
    </html>