Non-attachment

When Kitano Gempo, abbot of Eihei temple, was twenty-eight he studied Chinese calligraphy and poetry. He grew so skillful in these arts that his teacher praised him.

Kitano mused: "If I don't stop now, I'll be a poet, not a Zen teacher." So he never wrote another poem.

— Zen Flesh, Zen Bones

Happy birthday "Ajax"

Well, almost. February 18th is the official one-year anniversary of Jesse James Garrett's essay that coined the term "Ajax" to describe what applications like Google Maps were using under the hood.

Thus rekindling interest in what some longtime web developers have pooh-poohed as old news: DHTML. But man. Books. Articles and tutorials. Conferences! Workshops! And the prime indicator that a concept has gained serious traction, haters!

Not bad for something once considered just a few short years ago to be too broken, unevenly-supported, and often downright ridiculous to be of any use.

Y! Design Pattern Library

While it's awesome that Yahoo! has released a suite of JS tools, I'm actually more enamored of the Yahoo! Design Pattern Library.

The Yahoo! Design Pattern Library is an evolving set of sophisticated design guidelines for building web pages and applications. Our design patterns do not require the Yahoo! UI Library components, although using our UI Library can help you more easily implement the patterns described in these pages.

Very cool.

Safari quirk: Copying innerHTML

Here's a fun one. Given the following HTML, let's attempt to copy the contents of div1 to div2, then grab a reference to the SPAN element "foo."

<div id="div1">
  <span id="foo">Foo span</span>
</div>

<div id="div2"></div>

The easy way out is to just copy innerHTML from one element to the other, then destroy the contents of the original element:

document.getElementById('div2').innerHTML = 
    document.getElementById('div1').innerHTML;
document.getElementById('div1').innerHTML = '';
alert(document.getElementById('foo'));

In most browsers, the alert dialog displays "Element SPAN" or something similar. But in Safari 1.3 and above, the dialog displays null. Why?

For a brief moment, when we copy the innerHTML, we create two SPANs with identical IDs of "foo." Even after we destroy the contents of div1 (leaving only the one SPAN), the DOM is screwed up enough to confuse Safari, which continues to return null even after the DOM is "fixed." By contrast, Firefox for OS X is far more forgiving.

The solution seems to be: duh, don't copy from element to element. Instead, hold the contents in a variable until it's safe to reinsert them into the page:

var tempHTML = document.getElementById('div1').innerHTML;
document.getElementById('div1').innerHTML = '';
document.getElementById('div2').innerHTML = tempHTML;
alert(document.getElementById('foo'));

The dialog should now display "Object SPAN" in Safari. Of course, astute JS developers would probably prefer to skip using innerHTML altogether

Automatic JavaScript documentation generation

I'm looking for some recommendations for auto-generating API docs for JS libraries. There doesn't seem to be a lot of info out there on Google, so let's build a list here.

I'm interested in everything from mods to existing packages like DocBook, JavaDocs, etc. to Perl scripts you've stitched together back in 1999. Have at it!

Non-Blogger members can email me and I'll post your link.

Tip: the MS Script Debugger

I'm surprised that more JavaScript developers don't know (or maybe have forgotten) about the Microsoft Script Debugger. If you're weary of IE script errors that report "Line 324: Object expected" and no filename when you have 500K of script divided over 12 files, install this beastie, then open IE and go to Tools > Internet Options > Advanced and uncheck "Disable Script Debugging (Internet Explorer)."

Restart IE and the next time you encounter a JS error, a dialog box should pop up asking you if you wish to debug it. Clicking OK will launch the debugger, taking you to the file (hallelujah!) and the line at which it occurred.

It's not specifically tailored for JS like Venkman, but it's waaaaay better than IE's native JS error reporting.

Follow-up: Safari and String.replace() caveat

Following up on the Safari and String.replace() issue, it looks like this is a known bug that is fixed in the Webkit CVS tree but not yet part of any public release of Safari. So, if you're a junkie for nightly builds, you should be golden. (Your customers, on the other hand, are probably not so golden.)

MacIE's numbered days

MSFT is officially pulling the plug IE5 for the Mac:

In accordance with published support lifecycle policies, Microsoft will end support for Internet Explorer for Mac on December 31st, 2005, and will provide no further security or performance updates.

Additionally, as of January 31st, 2006, Internet Explorer for the Mac will no longer be available for download from Mactopia. It is recommended that Macintosh users migrate to more recent web browsing technologies such as Apple's Safari.

So long, old buddy.

BONUS: best comment via Slashdot: "Couldn't they have just emailed both people still using IE on the Mac and saved themselves the trouble of a whole press release."

Y! JavaScript Dev Center

Yahoo!'s JavaScript Developer Center looks pretty sweet.