How can you link xml with html tags?


XLink is used to create hyperlinks in XML documents.


How can you link xml with html tags?
  • XLink is used to create hyperlinks within XML documents
  • Any element in an XML document can behave as a link
  • With XLink, the links can be defined outside the linked files
  • XLink is a W3C Recommendation

There is no browser support for XLink in XML documents.

However, all major browsers support XLinks in SVG.


In HTML, the element defines a hyperlink. However, this is not how it works in XML. In XML documents, you can use whatever element names you want - therefore it is impossible for browsers to predict what link elements will be called in XML documents.

Below is a simple example of how to use XLink to create links in an XML document:


  Visit W3Schools
  Visit W3C

To get access to the XLink features we must declare the XLink namespace. The XLink namespace is: "http://www.w3.org/1999/xlink".

The xlink:type and the xlink:href attributes in the elements come from the XLink namespace.

The xlink:type="simple" creates a simple "HTML-like" link (means "click here to go there").

The xlink:href attribute specifies the URL to link to.


The following XML document contains XLink features:


    xlink:type="simple"
  xlink:href="/images/HPotter.gif"
  xlink:show="new">
  As his fifth year at Hogwarts School of Witchcraft and
  Wizardry approaches, 15-year-old Harry Potter is.......
 


    xlink:type="simple"
  xlink:href="/images/XQuery.gif"
  xlink:show="new">
  XQuery Kick Start delivers a concise introduction
  to the XQuery standard.......
 

Example explained:

  • The XLink namespace is declared at the top of the document (xmlns:xlink="http://www.w3.org/1999/xlink")
  • The xlink:type="simple" creates a simple "HTML-like" link
  • The xlink:href attribute specifies the URL to link to (in this case - an image)
  • The xlink:show="new" specifies that the link should open in a new window


In the example above we have demonstrated simple XLinks. XLink is getting more interesting when accessing remote locations as resources, instead of standalone pages.

If we set the value of the xlink:show attribute to "embed", the linked resource should be processed inline within the page. When you consider that this could be another XML document you could, for example, build a hierarchy of XML documents.

You can also specify WHEN the resource should appear, with the xlink:actuate attribute.


AttributeValueDescription
xlink:actuate onLoad
onRequest
other
none
Defines when the linked resource is read and shown:
  • onLoad - the resource should be loaded and shown when the document loads
  • onRequest - the resource is not read or shown before the link is clicked
xlink:href URL Specifies the URL to link to
xlink:show embed
new
replace
other
none
Specifies where to open the link. Default is "replace"
xlink:type simple
extended
locator
arc
resource
title
none
Specifies the type of link

XPointer

How can you link xml with html tags?
  • XPointer allows links to point to specific parts of an XML document
  • XPointer uses XPath expressions to navigate in the XML document
  • XPointer is a W3C Recommendation

XPointer Browser Support

There is no browser support for XPointer. But XPointer is used in other XML languages.


XPointer Example

In this example, we will use XPointer in conjunction with XLink to point to a specific part of another document.

We will start by looking at the target XML document (the document we are linking to):


 
  The Rottweiler's ancestors were probably Roman
  drover dogs.....

  Confident, bold, alert and imposing, the Rottweiler
  is a popular choice for its ability to protect....


 
  One of the earliest uses of retrieving dogs was to
  help fishermen retrieve fish from the water....

  The flat-coated retriever is a sweet, exuberant,
  lively dog that loves to play and retrieve....

Note that the XML document above uses id attributes on each element!

So, instead of linking to the entire document (as with XLink), XPointer allows you to link to specific parts of the document. To link to a specific part of a page, add a number sign (#) and an XPointer expression after the URL in the xlink:href attribute, like this: xlink:href="https://dog.com/dogbreeds.xml#xpointer(id('Rottweiler'))". The expression refers to the element in the target document, with the id value of "Rottweiler".

XPointer also allows a shorthand method for linking to an element with an id. You can use the value of the id directly, like this: xlink:href="https://dog.com/dogbreeds.xml#Rottweiler".

The following XML document contains links to more information of the dog breed for each of my dogs:


 
  Anton is my favorite dog. He has won a lot of.....
 

 
  Fact about Rottweiler
 


 
  Pluto is the sweetest dog on earth......
 

 
  Fact about flat-coated Retriever
 



a) Simply linking your Xml file You can link to your Xml file from a Html page by using Server Side Includes. If your Webserver is configured to allow this feature (this is usually disabled for security reasons) all you need to do is to rename your Html page to . shtml and add the server side include command.

How do you add an HTML tag to an XML file?

There are two solutions. If you know the data will be well formed XML, include it directly. The other, an better option, is to include the HTML in a CDATA section within an element within the XML.

Can we use HTML tags in XML?

When displaying data in HTML, you should not have to edit the HTML file when the data changes. With XML, the data can be stored in separate XML files. With a few lines of JavaScript code, you can read an XML file and update the data content of any HTML page.

How do you display XML tags in HTML?

To view raw XML source, try to select "View Page Source" or "View Source" from the browser menu. Note: In Safari 5 (and earlier), only the element text will be displayed. To view the raw XML, you must right click the page and select "View Source".