Common JavaScript Mistakes

Multiline Strings
New lines and semicolons can both be used to separate statements, so to make multiline strings you will need to use concatenation. "+" is the concatenation operator and the addition operator.
The "+" Operator
In JavaScript '+' is the operator for concatenation as well as the operator for addition.
setTimeout()
When you call setTimeout() from a function you need to remember that it excecutes from a global scope, not the function's scope, therefore, all variables passed to functions that it calls need to be global variables.
The = and == Operators
= is an assignment operator; == is an operator to compare if two values are equal.
<script [...] src="example.js">
When a <script> element has the src attribute set it ignores everything between the start and end tags.
javascript: pseudo-protocol
The javascript: pseudo-protocol should not be used in event handlers like onclick. It should only be used in attributes that contain a URL, for example in the href attribute of <a> elements and the action attribute of <form> elements. You can also use it to make bookmarlets.
Variables, Strings, Dot Notation, & Array Notation
When you use dot syntax, like in document.formName.formControlName formName and formControlName must be unquoted string literals, not variables. To use a string variable you can use array notation like document[formName][formControlName], where formName and formControlName are string variables. To use an object variable you can do something like this: form.formControlName.value, where form is an object reference that refers to a
element and formControlName is an unquoted string literal.
dot syntax does not resolve variables; you must use collection/array syntax. For example, var el='ta1'; document.form1.el.value; will not work because there is no element named 'el'. On the other hand, var el='ta1'; document.forms.form1.elements[el].value; will work because it is clear to the parser that 'el' is a variable.
document.getElementById()
document.getElementById() gets elements by their ID, not by their NAME. If you want to get an element by its NAME, then use document.getElementsByName()[num], where "num" is the index number. If there is only one element with that name, then use "0" (zero) for "num".
document.write()
When document.write() is called after the page has finished loading, it overwrites the content of the page. (More information.)
parseInt() and parseFloat()
When the first argument to parseInt() or parseFloat() is an empty string or does not start with a number it returns NaN. One solution to this problem is to use the Number() function instead.
parseInt()'s Second Argument
If you don't specify parseInt()'s second argument, then the function will look at the string being passed to it to determine what base to use. If the numerical string starts with "0x" then it will be interpretted as hex (hexadecimal). If the numerical string starts with "0", then it will be interpretted as octal. So to be safe, I recommend you specify 10 as the second argument so that the returned number will always be decimal. For example, parseInt("010",10) will return 10, but parseInt("010") will return 8.
<input type="button" name="submit">
Naming a form control element "submit" causes the submit() method of the <form> element to no longer work. Simply rename the offending form control to fix this.
Form Validation Event
To validate a form when it's submitted by typing enter in a form with a real submit button or clicking that real submit button, you should use <form ... onsubmit="return validate();"> instead of on the real submit button which would look something like <input type="submit" name="Submit" value="Submit" onclick="return validate();" /> or <button type="submit" onclick="return validate();" >Submit</button>. The function should return true of false, depending on whether the form submission should be stopped or allowed to continue. When you are using a simulated submit button, it's all right to use the onclick event, because clicking it won't trigger the onsubmit event of the form. This is because triggering a JavaScript form validator script from onclick of a submit button will not work correctly in some browsers.
<formObjectReference>.submit()
<formObjectReference>.submit() doesn't trigger the onsubmit event.
document.location
document.location is deprecated; use location.href instead.
window.open()
The strings passed as the second and third paramaters to window.open() should not contain any white-space characters.

Related Links:

Last update: 2006-11-09