J is for javascript....

Not a programmer? You might want to skip this posting. But as I've mentioned, I've been doing a good bit of coding these last couple weeks, updating an old web app we did for one of our clients. So it's what's on my mind. If you do some web programming but you haven't tried the new Ajax techniques in your Web projects yet, you can find some great examples that demystify the whole thing in Ajax Hacks, by Bruce Perry. You'll find it's not rocket science, and after a brief learning curve you'll be creating web apps that are far more responsive than your old sites. But pretty soon find yourself lying in bed at night wondering about the best format to use to feed data to the web page. Since XML puts the X in AJAX, and the J is for Javascript, the most obvious approach is getting the data as a textbook XML data file and using Javascript to display the data elements wherever you wish. But before long you'll get fed up with the tediousness of parsing individual data elements out of the raw XML feed. XPATH promises a way out. Instead of using procedural code to travel down the XML tree, XPATH lets you address an element or list of elements with a string that looks like a directory path. For example, if you want to build a list all authors of all books with a publication date of 2000, you could reference them with a string like /book[@date="2000"]/author But here you run into browser problems - the Mozilla family and IE implement Xpath in entirely different ways. Mozilla has the more powerful implementation, but it is pretty complicated to use. IE has a much more straightforward take on it. Charles Toepfer has posted a nice cross-browser library that implements this straightforward approach to xpath for the Mozilla browsers. Still seems pretty complicated? You might want to try JSON (javascript object notation). This little trick lets you transfer data in the same way you might define it within your script - for example book { title: "War and Peace"; author: "Leon Tolstoy"; language:"Russian"; } Besides being fewer characters to transfer since the "tags" are not closed, it's trivial to parse in Javascript - just use the javascript eval function to turn the string into a javascript object! And the file is very easy for a human to read. But JSON hasn't helped us with the formatting issues. An approach which does is one Christine Herron blogged about not long ago: using microformat-style xml as a data transfer mechanism. This is a format that uses html div and span tags to identify the data elements.Like so - <div class="book"> <span class="title">War And Peace</span> <span class="author">Leon Tolstoy</span> </div> The semantic information, as you see, is indicated by the element's class. You can just assign the entire XML string to a div's innerHTML, and let your stylesheet handle the formatting. Microformats were originally developed as a way to make web pages that would be easily scraped by other applications, but turning the technique into a data transfer mechanism seems sensible in some cases.The Rico effects library uses this as one of its standard approaches to Ajax data exchange. Tags: notech, programming, javascript