Building a Unicode Character Chart Using JavaScript

Because no matter how many appendices you read it in, you always want more.

The JavaScript function shown below will build and display an HTML table of the first 256 Unicode characters.

buildAsciiChart();

function buildAsciiChart()
{
    var chartAsHtmlTable = "<table width='100%'>";

    var numberOfCharacters = 256;
    var numberOfCharactersPerColumn = 16;
    var numberOfColumns = numberOfCharacters / numberOfCharactersPerColumn;

    chartAsHtmlTable += 
        "<tr><td colspan='" + numberOfColumns + "'>"
        + "Unicode Map - First " + numberOfCharacters + " Characters"
        + "</td></tr>";

    chartAsHtmlTable += "<tr>";

    for (var j = 0; j < numberOfColumns; j++)
    {
        chartAsHtmlTable += "<td><table border='1'>";

        for (var i = 0; i < numberOfCharactersPerColumn; i++)
        {
            var asciiCharacterIndex = j * numberOfCharactersPerColumn + i;
            if (asciiCharacterIndex < numberOfCharacters)
            {
                chartAsHtmlTable +=
                    "<tr>"
                    + "<td>" + asciiCharacterIndex + "</td>"
                    + "<td width='16'>&#" + asciiCharacterIndex + ";</td>"
                    + "</tr>";
            }
        }

        chartAsHtmlTable += "</table></td>";
    }

    chartAsHtmlTable += "</tr>";

    chartAsHtmlTable += "</table>";

    document.write(chartAsHtmlTable);
}

Notes

  • What I really wanted, of course, was a chart of the first 256 old-school DOS ASCII characters, with the smiley faces and everything, but I had to compromise.  Sooner or later I guess the future eats everything we love.
Advertisements
This entry was posted in Uncategorized and tagged , , . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s