Moving JavaScript out of the Web Page
Your web pages will be far easier to maintain if you can keep your HTML and JavaScript completely separate. The problem though is that not everyone knows how to take a script that is embedded in the web page and pull it out so that it can be completely separate and still function as before. In this tutorial we look at how to identify the pieces of JavaScript that are embedded in the HTML and how to move them into a separate file.
Can JavaScript Close This Window?
JavaScript can tell whether the current page is in a window opened by JavaScript. That is useful because JavaScript can only close windows (and tabs) that were opened by JavaScript. If the window or tab was already open before your visitor got to your site then there is nothing you can do to close it - if you try then Internet Explorer will pop up an alert telling your visitor that you are trying to close their browser while other browsers will just completely ignore the request. You can get more consistent treatment between browsers if you test for yourself whether the close is allowed before attempting it - that way you don't annoy your IE visitors with that alert.
Chaining Methods
In the twentieth tutorial on Object Oriented JavaScript we look at something you can do with the methods that actually don't need to return a value in order to make using more than one of them in the same code easier.
Get Previous Node
The JavaScript DOM provides a lot of flexibility in navigating the web page. As well as being able to step forward to the next node on the same level, we can also go back to the previous one.
Get Next Node
JavaScript isn't just limited to searching the entire web page for a specific node or nodelist. Once you actually have a node you can navigate from there to the nodes around it such as the one immediately following it at the same level.
Individual Field Validations
The next step after unobtrusively attaching JavaScript validation to a form field is to add code so that theit knows what field to validate. We can do this without hard coding a reference to the form field so as to allow validation functions to be shared between all the form fields that require the same validation.
Password Fields
Placing default text in the fields in your form to describe what is supposed to be entered there is one way of making your form easier to use. You just need to remove the default text when the page gets the focus so that your visitor can then type in their response.
One problem with doing this is if you have a password field as a part of your form and want to display something there. Obviously you want the default text in that instance to be readable and not the row of asterisks or dots that will appear when your visitor types in their password. Even though the field type attribute is supposed to be read only all browsers except Internet Explorer allow us to update it so as to easily change from a password field to a text field and back. We can then use JScript conditional comments to insert the code to do a complete field swap for IE users. For those purists who don't want to take advantage of the non-standard way almost all browsers handle the type attribute somply shifting the conditional comments around the elementCreate statements and adding a standard elementCreate and name assignment for browsers other than IE will produce the same result in about the same amount of code but with all browsers doing the field swap instead of the shorter type change.
Budget Calculator Generator
Create your own unique budget calculator complete with JavaScript validation. Budget calculators are fairly simple scripts since all they have to do is add and subtract a few numbers. Where creating a budget calculator becomes more complex is in adding all of the field validations. Even for someone with a decent JavaScript knowledge creating one can take a fair amount of time or used to before I created this page which will create a custom budget calculator for you.
Password Generator
Generate passwords to your specifications with the JavaScript password generator. You choose a length (between 7 and 20 characters) and the types of characters that the password must start with and contain. Even if you aren't interested in generating passwords you may find the JavaScript code interesting as it uses lots of array manipulations. A series of tutorials describes line by line how this script works.
Public Access to Private Methods
Defining private methods in JavaScript makes sure that they don't get overridden.
In this nineteenth object oriented tutorial we look at how you can make a private method accessible from outside the JavaScript object so as to gain the benefit of it not being able to be changed while still having it available for anything interacting with the object to use.
