Dreamweaver has a lot of features to help streamline JavaScript coding tasks. Here are some of my favorites.

Tip 1: Jumping to a JavaScript function

I love this feature. When you are working in a page with JavaScript or VBScript, you can see a list of your functions and jump to the function by selecting it's name from a context popup menu.

To use the context popup menu:

1. Open a file with one or more JavaScript functions.
2. Right click anywhere in the code source view. The context popup menu will appear.
3. ClickFunctions and then select your function name. Your cursor position will jump to the selected function.

All the tips in the article also work with VBScript source code as well as with JavaScript source code.

Tip 2: Configuring Code Hints to Close HTML Tags Properly in JavaScript Strings

Dreamweaver's code hint features are great. One of the features closes HTML tags for you, so when you start typing an opening HTML tag, such as <p> Dreamweaver will print out the closing </p> tag you automatically, saving on typing. This is a very handy feature, but there is a problem when typing HTML tags in a JavaScript string.

I use JavaScript, as many people do, to output HTML code dynamically. Dynamic HTML is very common in JavaScript coding. The HTML tags are coded in JavaScript strings, for example: document.write("<p>My paragraph.</p>").

Including HTML tags in JavaScript strings trips up Dreamweaver, which misinterprets which closing tag to output. For some reason, Dreeamweaver mistakenly outputs a closing </script> everytime, no matter which HTML opening tag you start typing in the JavaScript string. So you end up with document.write("<p>My paragraph.</script> and you have replace "string" with the correct HTML tag name.

To correct this problem with code hinting, change Dreamweaver's code hinting configuration back to the way it worked prior to Dreamweaver 8.

1. On the Dreamweaver toolbar, click Edit»Preferences. The Preferences dialog window will appear.
2. Select Code Hints
3. Change the Close Tags option to After typing the open tag's ">".
4. Click OK

Tip 3: Use the Apply Comment and Remove Comment Buttons

When working in JavaScript, you often want to comment out and un-comment whole sections of code for testing. Manually typing comments around code can be a litte tedious. When I worked in HomeSite, I actually created two custom buttons to do it for me. Since I switched to Dreamweaver, I have not taken the time to port those custom buttons from HomeSite to Dreamweaver. But I found out, I don't have to, because Dreamweaver 8 already has them.

The Apply Comment and Remove Comment buttons are located on the Coding toolbar, which is usually runs verically along the left side of your document view. You can chose amoung several types of comments.

To comment out a section of code:

1. Hightlight the code you want to comment out.
2. Click the Apply Comment button. A popup menu will appear.
3. Select the type of comment you want to add to comment out your highlighted code.

The Remove Comment button is located below the Add Comment button. And it works in much the same way, except that you do not have to specify the type of comment to remove.