NaN -> not a number exception
ex. subtotal = (0 +12) * ?(uninitialized number) = NaN
isNaN(NumOfItem) -> whether the variable is a number?
subtotal.toFixed(2) -> 四捨五入至小數第二位
donutString.indexOf("dozen") != -1 -> whether "dozen" appears in the string
document.body.clientHeight/clientWidthdocument.getElementById("rockImg").style.height="100px";
document.getElementById("rockImg").src= smileRock.png
圖將根據新設定的高度自行縮放,並維持比例
要補捉<span>test</span>或<div>test</div>裡的字
alert(document.getElementById("test").firstChild.nodeValue); ->test
alert(document.getElementById("test").value); ->undefine (used to capture the value of text fields)
A safety way to change the text under a node
- remove all child nodes
- create a new node
- append the new node to its parent
ex. var node = document.getElementById("test");
while(test.firstChild){
node.removeChild(node.firstChild);
}
node.appendChild(document.createTextNode("new content"));
refresh(); ->refresh web page
setTimout ("alert('wake up');", 1000); 延遲一秒
var accept =
confirm("Do you really want to delete?"); -> return true/false
if (navigator.cookieEnabled)
onblur -> The onblur event occurs when an object loses focus. <-> onfocus<input type="text" onblur="
validateNonEmpty(this); upperCase();"></input>
function validateNonEmpty(
inputField){
if(
inputField.value.length == 0)
alert('please enter a value');
}
===using alert to inform user of validation error is a bad practice. better way===
<input type="text" onblur="
validateNonEmpty(this,document.getElementById('phone_help'));"></input>
<span id="phone_help" class="help"></span>
function validateNonEmpty(
inputField, helpText){
if(
inputField.value.length == 0){
if(helpText != null){
helpText.innerHTML = "please enter a value";
}
return false;
} else{
if(helpText != null){
helpText.innerHTML = "";
}
return true;
}
}
=============================================================
onchange -> The onchange event occurs when an object loses focus and the content of a field changes.
If there isn't any change, the onchange event will not be trigered.
Therefore, it is better to use onblur for validation.
<input type="text" onchange="calculateTotalPrice()"></input>
onresize -> The onresize event occurs when a window or frame is resized.function myFunction(){
var username = prompt('what is your name?'); if(username){
alert('hi '+username);
}
}
css
========
visibility:hidden/visible
display:none/block
comment
// or /* /*/
id attribute -> unique within a web page
name attribute -> unique within a form
function showIt(thForm){
alert(theForm["zipcode"].value);
}
<input type="text" value="第一個得到焦點" tabIndex="1">
<input type="text" value="第二個得到焦點" tabIndex="2">
textField.focus();
textField.select();
escape character -> \
pitfall
var num1 = document.getElementById("one").value; ->value = 3
var num2 = document.getElementById("two").value; ->value = 4
var total = num1 + num2 = ?? ->34
why? The default data type is String.
Therefore you should transform the datatype from String to Int or Float.
parseInt/parseFloat
var total = parseInt(num1)+parseInt(num2) = 7