TW Blog :: Entries for DOM Scripting

What we cannot speak about we must pass over in silence Ludwig Wittgenstein

Link Title Bookmarklet

Jesse Ruderman's excellent collection of bookmarklets have become a vital development tool offering functionality for CSS fine tuning and accessibility auditing among other things.

Based around the Validation Bookmarklets collection, I have written a bookmarklet to display the values of all anchor title attributes within a page. This is particularly useful to view the alternative text for links out of context to ensure it makes sense. This could easily be extended to view the title attribute for all elements on the page.

Posted on May 09, 2004 at 14:51:57. [Comments for Link Title Bookmarklet- 0]

View PHP Source

Also relates to PHP and Apache

Here is a cute little bookmarklet to tie in with the source file for viewing underlying PHP as outlined in the PHP Manual. The source file should be placed in the server root directory for the main server or a virtual host, and the Location directive set accordingly in the Apache configuration file (See the PHP Manual). This code snippet simply performs a regular expression replace to change the location.href to point to the source file.


javascript:var re=/\/\/([-a-z\.]+)\//i; _
window.location.href= _
window.location.href.replace(re,"//$1/source/");

This code can be pasted into a new bookmark ( _ just represents line continuation), or drag this PHP Source link onto your bookmarks. I find this quite useful when walking through a site on my test platform, and it complements the many client side developer utilities in the Firefox Web Developer toolbar and these comprehensive Web Development Bookmarklets.

Posted on Mar 27, 2004 at 04:49:49. [Comments for View PHP Source- 1]

Venkman Debugger To The Rescue

Also relates to Firefox and Co and XUL

I have had some problems getting the XUL Console to work on Mozilla 1.6. I caught a brief glimpse of the sample widgets the first time I ran it, but since then the console has been blank and totally functionless. Since I was keen to utilise the downloaded version of Alice Corbin's Periodic Table to help learn the markup, and with lack of bug reports for the console on MozDev, I decided to try and debug it myself.

The JavaScript Console told me the error was an unrecognised path in the file chrome://mozlib/content/lib/js/io/file/instantiator.js, part of the MozLib extension library. So, enter the Venkman JavaScript Debugger. This was the first time I had test run this for genuine reasons, but it is relatively easy and intuitive to get going.

Open up the Debugger.
Uncheck the Exclude Browser Files option in the Debug menu since the target was part of the chrome.
Start up the XUL Console.
Locate the file instantiator.js in the Loaded Scripts window and set a break point on the line the error was occurring (Line 73).
Attempt to perform a function in the XUL Console.
The Debugger stops on the breakpoint, and the variable at fault can be examined.

The error was clear, the directory path to Mozilla was set in Windows format with escaped backslashes, while the additional path to the particular file (in this case the samples) was set with forward slashes. (One of the many Windows banes!). Well, time was not available to delve deep into the MozLib library and find out where this was originating, so I settled with adding a regular expression snippet at this point to correct the path and see if that would work.


var re = /\//g;
var result = path.replace(re, "\\");
path = result;

The problem was resolved and now the XUL Console is functioning perfectly. I could have quite easily passed an hour reinstalling the extensions and editing chrome files in an attempt to fix this, but in 5 minutes Venkman had pointed me in the right direction and the problem was resolved - an excellent tool!

Posted on Mar 07, 2004 at 20:45:12. [Comments for Venkman Debugger To The Rescue- 1]

Article On Accessible DHTML

Also relates to Accessibility

One of my aims now the new site is up and running is to start writing some articles. I regularly find my blog entries become too drawn out, and ideally these would be better presented as short articles. As always, I am currently way too busy to really get underway with this. However, to get the ball rolling, I have posted a short article on creating DHTML content without compromising accessibility. It basically surmises the process I went through on a recent site development to create a manual image slideshow, hence allowing the maximum preservation of screen real estate.

I haven't found time to add a comments section following the article (which I do hope to do for all future articles, since discussion generally brings out further ideas and enhancements). However, feel free to post any remarks, criticisms, or errors for the article under this blog entry. I hope it is of use to those crossing the accessibility threashold.

Posted on Feb 25, 2004 at 23:04:08. [Comments for Article On Accessible DHTML- 0]

Key Press Event Revisited

Also relates to Accessibility and Firefox and Co

In a posting last month I presented an onkeypress event handling script to avoid the Mozilla browsers triggering the event when the user tabs of the anchor. This was achieved by calling an intermediary function when the onkeypress event handler was triggered that would call the final function (in this case a style switcher) only if the pressed key was return.

While this resolved the problem, I discovered the other day that a better solution is to just call the onclick event of the same anchor element when the onkeypress event is triggered.

<a href="#" onclick="setStyleSheet('sheet'); return false;"
onkeypress="this.onclick">Switch to List View</a>

This works fine on the Mozilla browsers and does not raise the problem when the function is called directly by the event handler. Also, there is no need to hard code this and it can be extracted to a DOM creation scripting once the page has loaded, thus making the markup ever so slightly purer.

Posted on Oct 15, 2003 at 04:49:05. [Comments for Key Press Event Revisited- 3]