一個簡單的函數(shù)可實現(xiàn)變長效果：
function setWidth() {
var box = document.getElementById("box");
box.style.width = "400px";
}
看起來變色變高只需把上述代碼重復(fù)一遍诚撵，稍加改動就可以了。但是為了代碼的高效和簡潔澈驼，要盡量避免重復(fù)筛武。
function setStyle(x, y) {
var box = document.getElementById("box");
box.style.height = x + "px";
box.style.background = y;
}
上面的函數(shù)分別用兩個形參x和y代表高和背景色，解決了代碼重復(fù)的問題榴都。實際上可以把三個效果分別用三個形參表示漠其，一個函數(shù)解決所有問題。
補充：
1.頁面從上而下的解讀代碼和屎，未解讀的部分直接調(diào)用會沒有效果拴驮，實際上大部分的bug考慮到這點都是能避免的。
2.js中所有用.的部分柴信，都可以用[""]代替套啤。一般來說用.方便，有些時候不能用點的地方就只能用[""]随常。
3.js中用“”包裹起來的是字符串纲岭，一句語句里不能定下來的會變化的東西用變量表示，能定的不會變化的用字符串即常量表示线罕。
4.通過style添加或讀取是針對的行間樣式止潮。 因為行間樣式的優(yōu)先級最高钞楼，通過className（類）加的效果會不起作用喇闸，所以對于同一個元素始終使用行間或className二者中任意一種而不是混著來是非常有必要的，一般使用className（類）而不是行間樣式询件。
while循環(huán)：
var i=1; 初始化
while(i<5){ 條件
alert(i); 語句
i++ 自增
}
for循環(huán)寫法更加簡單：
for(var i=1;i<5;i++){ 初始化+條件+自增
alert(i); 語句
}
全選不選及反選燃乍，復(fù)選框：
window.onload = function () {
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");
var btn3 = document.getElementById("btn3");
var div1 = document.getElementById("div1");
var ckd = div1.getElementsByTagName("input"); 注意：這里從div1中提取TagName。
btn1.onclick = function () {
for (i = 0; i < ckd.length; i++) {
ckd[i].checked = true;
}
}
btn2.onclick = function () {
for (i = 0; i < ckd.length; i++) {
ckd[i].checked = false;
}
}
btn3.onclick = function () {
for (i = 0; i < ckd.length; i++) {
// 注意：這里要用==號宛琅。
if(ckd[i].checked == true){ 前面用=是將值賦給checked屬性刻蟹，這里做判斷用==判斷checked的值是否為true。
ckd[i].checked = false;
}else{
ckd[i].checked = true;
}
}
}
}
this的使用：this可指代當(dāng)前事件的按鈕（事件的載體 一般為標(biāo)簽）嘿辟。
索引值：需要確定“第幾個”的時候舆瘪，是玩家自己創(chuàng)建的對象。使用html添加會被瀏覽器過濾红伦，使用js添加則不會英古。
innerHTML：js添加某標(biāo)簽的內(nèi)容，可識別html結(jié)構(gòu)昙读。
選項卡的實現(xiàn)：
核心思路：
按鈕：先清空所有按鈕召调，再選中當(dāng)前按鈕。
內(nèi)容：先隱藏所有div，再顯示當(dāng)前div唠叛。
window.onload = function () {
var div1 = document.getElementById("div1");
var btn = div1.getElementsByTagName("input");
var div = div1.getElementsByTagName("div");
這里用循環(huán)減少重復(fù)代碼 ：
for (i = 0; i < btn.length; i++) {
這里用js給input標(biāo)簽添加index屬性（index是玩家自創(chuàng)的）只嚣，目的是給這幾個標(biāo)簽排號方便操作。
btn[i].index = i;
btn[i].onclick = function () {
for (i = 0; i < btn.length; i++) { 循環(huán)都是為了減少代碼量艺沼，這里也是精簡重復(fù)的代碼介牙。
btn[i].className = ""; 清空所有按鈕的class
div[i].style.display="none"; 隱藏所有div
}
this.className = "active"; 選中當(dāng)前按鈕
div[this.index].style.display = "block"; 顯示當(dāng)前div
}
}
}
簡易日歷實現(xiàn)：
思路：日歷按鈕原理與選項卡一致，內(nèi)容部分采用innerHTML添加標(biāo)簽的內(nèi)容澳厢。
typeof：判斷目標(biāo)的數(shù)據(jù)類型。
==：雙等號先將等式兩邊數(shù)據(jù)轉(zhuǎn)換為同一類型再比較囚似。
===：全等號不轉(zhuǎn)換直接比較剩拢。
數(shù)據(jù)顯式類型轉(zhuǎn)換（強制類型轉(zhuǎn)換）：
parseInt:將字符串轉(zhuǎn)為數(shù)字（整數(shù)），原理為從左到右讀取字符串饶唤，遇到第一個非數(shù)字字符串就跳出去返回結(jié)果徐伐。
parseFloat：將字符串轉(zhuǎn)為數(shù)字（小數(shù)），原理同上募狂。
隱式類型轉(zhuǎn)換：
無具體代碼指示办素，在需要的時候計算機自動判斷轉(zhuǎn)換數(shù)據(jù)類型。
變量必須用var聲明祸穷，在函數(shù)內(nèi)部var聲明屬于局部變量性穿，在函數(shù)外部var聲明 屬于全局變量。
閉包：子函數(shù)可以使用父函數(shù)的局部變量雷滚。
變量命名遵循匈牙利命名法：
類型前綴：數(shù)組a 需曾、布爾值b、 浮點數(shù)f 祈远、 函數(shù)fn 呆万、整數(shù)i 、對象o 车份、 正則表達(dá)式re 谋减、字符串s 、變體變量v扫沼、
駝峰命名：單詞的首字母大寫出爹。
取模：%（取余）。
+=：例：i=i+1缎除，i+=1以政，i++都是一樣的意思。其中i++只能加1伴找，若想i=i+4 則只有i+=4這兩種寫法盈蛮。
if用于范圍判斷，switch用于精確判斷：
switch（變量）{
case 值1：
語句一技矮；
break抖誉； 跳出/中斷 （整個循環(huán)） 相應(yīng)的continue殊轴；跳出/繼續(xù)（跳出本次但繼續(xù)）
case 值2：
語句二；
break袒炉；
......
default:
語句n旁理；
break；
}
判斷語句也可以用三元運算符簡寫：條件我磁？條件成立語句：條件不成立語句孽文；
數(shù)據(jù)的真假：所有非零非空的“有東西”的數(shù)據(jù)為真，反之為假夺艰。
當(dāng)下十分流行的json格式：
json和數(shù)組很像芋哭，舉個例子
var json={a:12,b:3,c:6};
var arr=[12,3,6];
alert( json.a ) ; 等效于alert（json["a"]）; 等效于 alert( arr[0] ) ;
很相似，但是json的下標(biāo)是字符串郁副，數(shù)組的下標(biāo)是數(shù)字减牺。
json是很簡單的數(shù)據(jù)，定義了什么 就有什么 沒定義的就沒有存谎。比如數(shù)組有l(wèi)ength拔疚，json就沒有。
數(shù)組和json主要用于循環(huán)：
for（var i=1;i<arr.length;i++）{
alert("haha");
}
但json沒有l(wèi)ength既荚，所以他使用另一種for in循環(huán)稚失。
for（var i in json）{
alert（“哈哈哈”）；
}
數(shù)組也可以用for in：
for（var i in arr）{
alert（“哈哈”）恰聘；
}
但是for in循環(huán)最好還是用在json上墩虹，數(shù)組還是用for循環(huán)不容易出錯。
json可以直接像變量一樣操作：json.a++
簡單的求和函數(shù)：
function sum() {
var result = 0;
for (i = 0; i < arguments.length; i++) {
result += arguments[i];
}
return result;
}
alert(sum(3,15,26));
其中arguments是函數(shù)的可變參（不定參）憨琳，不定參是個數(shù)組诫钓，意味著函數(shù)的參數(shù)個數(shù)可能是無限的。
兼容IE和W3C標(biāo)準(zhǔn)瀏覽器的獲取非行內(nèi)樣式函數(shù)：
function getStyle(obj,name){
if(obj.currentStyle){
return obj.currentStyle.name;
}else{
return obj.getComputedStyle(obj,false).name;
}
}
push（元素）:數(shù)組從尾部添加篙螟。
pop（）：數(shù)組從尾部刪除菌湃。
unshift（元素）：從頭部添加。
shift（）：從頭部刪除遍略。
splice（起點惧所，長度，元素）绪杏，其中包含起點下愈，長度指幾個。
可實現(xiàn)添加（起點蕾久，0势似，元素），刪除（起點，長度）履因，替換（先刪除再添加）障簿。
var a=[1,2,3];
var b=[4,5,6];
連接數(shù)組：a.concat(b); (就變成1，2栅迄，3站故，4，5毅舆，6)
連接符：a.join(0.0); （就變成10.0西篓，20.0，3）
數(shù)組排序：a.sort（）憋活；用來排字符串岂津，原理為按首字母順序排。
數(shù)字排序：因為sort只能識別字符串余掖，所以這里用一個“比較函數(shù)”幫助sort排序數(shù)字。
a.sort（function（n1礁鲁，n2）{
return n1-n2; 數(shù)字從小到大排序盐欺。
}）;
定時器：setInterval（函數(shù)，毫秒（不帶單位））仅醇；每隔一段時間執(zhí)行一次
setTimeout（函數(shù)冗美，毫秒）；隔一段時間執(zhí)行函數(shù)析二。
清理定時器：clearInterval（定時器）粉洼；
簡單的例子：
<style>
div {
float: left;
margin: 10px;
}
#div1 {
width: 100px;
height: 50px;
background: red;
}
#div2 {
width: 400px;
height: 200px;
background: gray;
}
</style>
<script>
window.onload = function () {
var oDiv1 = document.getElementById("div1");
var oDiv2 = document.getElementById("div2");
var timer = null; //變量先聲明，否則下面用就undefinded叶摄；
oDiv2.onmouseover = oDiv1.onmouseover = function () {
clearTimeout(timer); //每次先清理定時器属韧，以免定時器疊加；
oDiv2.style.display = "block";
}
oDiv2.onmouseout = oDiv1.onmouseout = function () {
timer = setTimeout(function () {
oDiv2.style.display = "none";
}, 500);
}
}
</script>
</head>
<body>
<div id="div1"></div>
<div id="div2"></div>
</body>
