Making Javascript DOM a Piece of Cake with the graft() Function
Posted by Maciek Sun, 15 Oct 2006 17:45:43 GMT
In an earlier article I presented DOM as a useful way to construct documents on the fly in Javascript. DOM is well known for this purpose, but it’s also well known for being extremely irritating and verbose to use in Javascript. Some programmers may be tempted to use quoted HTML combined with the innerHTML property, which may (for them) be somewhat easier to crank out than DOM code. But this is hardly a way to go forward, and creates all sorts of problems when using AJAX, JSON, or when working in an environment involving a lot of strict XML usage. Casting all of that aside, this article will demonstrate the use of the graft() function to simplify the construction of DOM structures using Javascript’s own simple object notation.
More after the jump..
Read more...Simplify Scope with Javascript Closures
Posted by Maciek Mon, 25 Sep 2006 20:25:09 GMT
For those of you using Javascript prototypes as classes and interacting them with HTML or DOM elements, it’s often tricky or painful to keep things clean and nicely separated. Often, the result is a bunch of global (i.e. members of window) variables littered all over the place. Still more difficult is the problem of somehow associating given DOM objects with given class (or prototype) instances without having to use clumsy proxies or tracking keys in hashes.. etc. You can greatly simplify this sort of code by using closures. In the following article, I will give you a simple pattern to apply to any functionality you want to attach to objects that steal or would otherwise confuse scope. This pattern is useful anywhere you attach functions to the properties of objects outside of those functions’ context: AJAX XMLHttpRequest objects, DOM elements, or your own prototype-derived objects..
Read more...Using the DOM in Your Web Applications
Posted by Maciek Wed, 20 Sep 2006 17:13:26 GMT
The DOM (Document Object Model) can be a clear and useful way to represent and interact with XML documents. It can also be a rather obtuse and un-obvious way to work with data when you first come in contact with it. In spite of some of its more difficult parts (especially as one digs into DOM Level 2 and 3) , the core DOM API is fairly consistent. It is this consistency that offers programmers some of DOM’s great strengths: operational sameness from language-to-language and system-to-system, schema-to-schema—and, to a lesser extent, browser to browser. As one works with it, however, one comes to realize that DOM is only a piece of a puzzle that fits into a greater whole in the XML world, and this consistency is only part of that larger philosophy that embodies XML.
Read more...Google AJAXSLT 0.2 Notes and Patches
Posted by Maciek Thu, 18 Aug 2005 03:32:00 GMT
Lately I’ve been working on a tutorial about Google AJAXSLT, which is Steffen Meschkat’s promising cross-browser AJAX / XSLT API. It provides a basic DOM implementation, and an XSLT 1.0 processor. A neatly-separated XPath implementation not only powers XSLT’s xsl:select, but can also be used to query documents outside of XSLT, for use with DOM. All of this is written in pure Javascript (!), which means that all your browser needs to use it is a working Javascript implementation.
While the project name has the word “AJAX” in it, there aren’t, strictly speaking, any actual AJAX functions included in the API. What you get is a toolkit that provides what many of the AJAX stuff out there doesn’t provide—a powerful, standards-aware way of generating, accessing, and rendering the XML that your AJAX queries work with. Even at this stage, I’ve been able to drop in a few formerly-server-side XSLT stylesheets without modification for use with AJAX output.
The major drawback with Google AJAXSLT at this stage (version 0.2 at time of writing) is that the API is very much in beta, and there are some rough edges. Until Steffen decides to release 0.3, some of us are already itching to play with this thing on a daily basis! What follow are some patches that I’ve been applying to the API to deal with existing issues.
Read more...
