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) rel Example

Description: Illustrates the JavaScript syntax for the Anchor Object rel Property .

Syntax: object.rel=languagecode – Allows you to retrieve or assign rel for linked objects. rel describes the relationship of the current object to the target object. rel describes the relationship of the current object to the target, and rev (reverse) describes the relationship of the target object to the target.

JavaScript (JS) rel 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: rel </title>
    <!-- 
    ***************************************************
    * This example is from http://idealprogrammer.com *
    ***************************************************
    Here is a table of values that rel can have:
 
    Value  	Description
appendix 	Link to the appendix page of a document
alternate 	Link to an alternative source
bookmark 	Link to a bookmark. Often used for "permalink" in web blogs
chapter 	Link to a chapter from the current documents
contents 	Link to the table of contents in the current document
copyright 	Link to copyright or policy page of the current document
glossary 	Link to glossary page of the document
index 	Link to the index page of the current document
next 	Link to next page from the current document
prev 	Link to the previous page from the current document
section 	Link to a section in a list of documents
start 	Link to the first page of the current documents. Used by search engines to show the first page
subsection 	Link to a sub-section in a list of current documents. 
 
    -->
 
 
 
   </head>
  <body>
      <a href="http://www.google.com" id="idGoogle" rel="appendix">Google</a><br /><br />
      <a href="http://www.yahoo.com" id="idYahoo" rel="bookmark">Yahoo</a><br /><br />
      <a href="http://idealprogrammer.com" id="idIdealProgrammer" rel="contents">IdealProgrammer</a><br /><br />
      <a href="http://myqol.com" id="idProgressMonitor" rel="index">ProgressMonitor</a><br /><br />
 
   <script type="text/javascript">
       //*****************************************************
       // DOM Objects
       //*****************************************************
 
 
       //*****************************************************
       //    ***    Anchor Object Properties   ***
       //*****************************************************
 
       //*****************************************************
       // rel
       //*****************************************************
 
       //    SYNTAX:
       //    object.rel=name  Allows you to retrieve or assign
       //               a rel to an object. rel describes the content of 
       //               the linked object. Primarily used by search engines
 
       // Two ways to retrieve rel   
       //   1. GetElementsByTagName
            myObject=document.getElementsByTagName('a')[0];
            document.write("Google - Using getElementsByTagName : " + myObject.rel);
            document.write("<br />");
      //   2. GetElementById
            document.write("Yahoo - Using getElementById: ");
            document.write(document.getElementById('idYahoo').rel);
 
            document.write("<br /><br />");
       // Two ways to assign rel
 
            //   1. GetElementById
            myThirdElement = document.getElementById('idIdealProgrammer');
            myThirdElement.rel = "chapter";
            document.write("<br />IdealProgrammer rel changed to chapter: ", myThirdElement.rel);
 
       //   2. GetElementsByTagName      
            myFourthElement = document.getElementsByTagName('a')[3];
            myFourthElement.rel = "glossary";
            document.write("<br />ProgressMonitor rel changed to glossary: ", myFourthElement.rel)
 
</script>
 
  </body>
</html>