Chapter: Internet & World Wide Web HOW TO PROGRAM - The Ajax Client - Introduction to XHTML

| Study Material, Lecturing Notes, Assignment, Reference, Wiki description explanation, brief detail |

Internal Linking - XHTML

Line 14 contains a tag with the id attribute (set to "features") for an internal hyper-link. To link to a tag with this attribute inside the same web page, the href attribute of an anchor element includes the id attribute value preceded by a pound sign (as in #fea-tures).

Internal Linking

 

Figure 4.14 introduces internal linking—a mechanism that enables the user to jump between loca-tions in the same document. Internal linking is useful for long documents that contain many sections. Clicking an internal link enables users to find a section without scrolling through the entire document.

 

Line 14 contains a tag with the id attribute (set to "features") for an internal hyper-link. To link to a tag with this attribute inside the same web page, the href attribute of an anchor element includes the id attribute value preceded by a pound sign (as in #fea-tures). Line 56 contains a hyperlink with the id features as its target. Selecting this hyperlink in a web browser scrolls the browser window to the h1 tag in line 14. Note that you may have to resize your browser to a small window and scroll down before clicking the link to see the browser scroll to the h1 element.

        <?xml version = "1.0" encoding = "utf-8"?>

 

        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

 

              "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

 

        <!-- Fig. 4.14: internal.html -->

 

        <!-- Internal hyperlinks to make pages more navigable. -->

 

<html xmlns = "http://www.w3.org/1999/xhtml">

              <head>

 

                     <title>Internal Links</title>

 

                </head>

                <body>

 

                       <!-- id attribute creates an internal hyperlink destination -->

 

                       <h1 id = "features">The Best Features of the Internet</h1>

                       <!-- an internal link's address is "#id" -->

 

                       <p><a href = "#bugs">Go to <em>Favorite Bugs</em></a></p>

 

                       <ul>

 

                             <li>You can meet people from countries

                                    around the world.</li>

 

<li>You have access to new media as it becomes public:

 

<ul>

<li>New games</li>

<li>New applications

<ul>

<li>For Business</li>

<li>For Pleasure</li>

</ul>

</li>

 

<li>Around the clock news</li>

<li>Search Engines</li>

<li>Shopping</li>

<li>Programming

<ul>

<li>XHTML</li>

<li>Java</li>

<li>Dynamic HTML</li>

<li>Scripts</li>

<li>New languages</li>

</ul>

</li>

                                    </ul>

 

                             </li>

                             <li>Links</li>

 

                             <li>Keeping in touch with old friends</li>

 

                             <li>It is the technology of the future!</li>

 

                       </ul>

                       <!-- id attribute creates an internal hyperlink destination -->

 

                       <h1 id = "bugs">My 3 Favorite Bugs</h1>

                       <p>

 

                             <!-- internal hyperlink to features -->

 

                             <a href = "#features">Go to <em>Favorite Features</em></a>

                       </p>

                       <ol>

 

                             <li>Fire Fly</li>

 

<li>Gal Ant</li>

 

                             <li>Roman Tic</li>

 

                       </ol>

 

                </body>

 

</html>



Fig. 4.14 |  Internal hyperlinks to make pages more navigable.

 

Although not demonstrated in this example, a hyperlink can specify an internal link in another document by specifying the document name followed by a pound sign and the id value, as in:

 

href = "filename.html#id"

 

For example, to link to a tag with the id attribute called booklist in books.html, href is assigned "books.html#booklist". You can also send the browser to an internal link on an-other website by appending the pound sign and id value of an element to any URL, as in:

 

href = "URL/filename.html#id"

 

Study Material, Lecturing Notes, Assignment, Reference, Wiki description explanation, brief detail


Copyright © 2018-2020 BrainKart.com; All Rights Reserved. Developed by Therithal info, Chennai.