Reference management in HTML, Part II

A while back I proposed a reference management scheme for HTML blog posts (incurring the wrath of the semantic web people, no doubt :)). I’ve updated it somewhat, making it easier to use. Now it’s easier than ever to ensure that your HTML content is well-referenced.

Usage is simple:

<script src="jsnote.js"></script>
<script src="references.js"></script>
<p>This is how we cite the first reference<cit>FirstRef</cit>.
We can cite the second reference like this<cit>SecondRef</cit>
and the third like so<cit>ThirdRef</cit> and the fourth reference
like this<cit>FourthRef</cit></p>
... more content goes here ... pages and pages if you want ...



The first javascript file that is included contains all the routines for making references work. The second javascript file contains a list of all the references used in the example article, namely  FirstRef, SecondRef, ThirdRef and FourthRef. All the text within <cite> tags are used as a lookup into the references.js file to find the reference and the generated list of references are placed within all the <bibliography> tags found (although why an article would need more than a single bibliography is beyond me).

The resulting article has all of the <cite>tags replaced with the reference number in square brackets, which is a link to the actual reference. The above example HTML code looks like this:

This is how we cite the first referenceFirstRef. We can cite the second reference like thisSecondRef and the third like soThirdRef and the fourth reference like thisFourthRef… more content goes here … pages and pages if you want …

The actual references appear at the end of the article (click on one, see what happens).

The function jsNote() starts all the javascript to make the reference-magic happen. Authors can now easily reference all their material in a thorough and complete manner without resorting to manually inserting links to their references.

You can download jsnote.js, the example references file references.js and the example article jsnote-example.js from the links below.

  • jsnote.js (Include this file in your article)
  • references.js (Use this file as a template and example for all your references)
  • jsnote-example.js (Small example of usage)
  • jsnote.pdf (The as-yet-unpublished paper. This link will be enabled once I publish the paper)