<h2>Me &amp; My Shadow</h2>

Then the tab control displayed “&” instead of a single ampersand character.

It looks like this occurs because the JavaScript DOM function document.createTextNode() does not convert entities. However, it looks like innerHTML does convert entities, so to fix your problem find the following line in tabber.js:

DOM_a.appendChild(document.createTextNode(t.headingText));

and replace with the following:

DOM_a.innerHTML = t.headingText;

I’ll think about this some more and if I can’t find any bad side effects I’ll add to the tabber code.

If you use a document.write() to write two script elements on the page, then instead of running the first script followed by the second script, IE apparently runs them both at the same time. This can cause an error if the second script calls a function that is defined in the first script.

The dojo bug and some test cases are in Bug #2280.

I provide some free open source software, and to help defray the costs of this website, I usually beg for PayPal donations.

Here’s a JavaScript function I use, attached to the download link, to annoy people into sending me a donation:

function begForMoney()
{
  if (!arguments.callee.stopBegging) {
    arguments.callee.stopBegging = true;
    alert("Please donate!");
  }
}

Here’s how to attach it to a link. You can attach it to multiple links on the page, and it only triggers an alert the first time it is clicked.

<a href="" onclick="begForMoney()">Download</a>

Introducing FauxJAX.

Want to get your hands on some crazy delicious Web 2.0 venture capital, but don’t have mad AJAX skills? If you can copy and paste, you too can have a website that looks oh-so two thousand and six!

Simply use our framework to display content on your site, and we’ll do the rest. Don’t worry about outdated server-side technology because FauxJax is beyond all that. Way beyond. Like in the next century, you have no idea.

Get FauxJAX today!

On the Yahoo! user interface blog I just saw their post “with Statement Considered Harmful“. Good advice.

Here are a few more things that I never do in JavaScript:

1. Never use the “with” statement (as described above)
2. Never use single line “//” comments. Use “/**/”. One day your code is going to be mangled and the newlines removed (perhaps by a crappy content management system), and suddenly your code will be commented out.

   Before:

   // a comment
   alert('ping!');

   After: (UH OH!)

   // a comment alert('ping!');

3. Never omit the semi-colon after a statement. Again, this is to protect your code in case the newlines are removed, and to make the code easier to parse (by humans and machines).

   Before:

   var t = 'ping!'
   alert('ping!')

   After: (ERROR)

   var t = 'ping!' alert('ping!')

   This can be harder than it seems! For example, in the following example you should add a semi-colon after the closing brace:

   var myFunc =
   function() {
   alert('ping!');
   }

4. Never omit the optional brackets { } around a statement. This can prevent some hard-to-debug errors when you add and remove code.

   Before: (MISLEADING INDENT!)

   if (true)
       alert('ping!');
       deleteItem();

   Fixed: (UNAMBIGUOUS)

   if (true) {
       alert('ping!');
   }
   deleteItem();

To check your code for missing semicolons and brackets, use JSLint.

I often use Google to search a particular website, using “site:example.com” and my search terms. It gets a bit tedious entering “site:example.com”, so I made the following bookmarklet:

• Search Current Site Bookmarklet

It prompts for the search terms, automatically adds the “site:” keyword and domain name, then goes to Google. You can select some text on the page before you click the bookmarklet, and your selected text will be used as the default search keywords.

For Firefox just drag-and-drop the link to your bookmarks toolbar. For IE, right-click the link then select “Add to Favorites…” (you might get a warning message since the bookmark contains javascript) then add it to your Links toolbar.

Inspired by: Search Bookmarklets

I just released a new version of my JavaScript tab interface software.

New Features

• Can automatically set a unique id for each tab navigation link, which allows you to individually style each tab.
• Includes a “minimized” version of the code (with comments and whitespace removed, for extra-fast loading).

Now with yummy cookies!

I added an example page showing how you can use the new onLoad and onClick function hooks in my JavaScript tabifier to make the tabs persistent (using browser cookies).

That is, if you leave the page and come back later, the tab you previously selected will still be selected.

The second episode of “You’re Killing Me Here!” (usability and design screencast series) discusses various uses of the page title (HTML TITLE element): in particular how you can use it to communicate with users of your web application.

View the Screencast (2.5 minutes)