資料型別：1、數值型：包括整數和浮點數。實際上整數在js底層也是用浮點數表示的，只是轉換時用了四捨五入，直譯器隱藏了轉換細節。
    2、文字資料：沒有專門的char型別。用''或者""括起來表示字串。
    3、布林型：取值true或false
申明變數：var varName；變數沒有固定型別，可以改變指向不同型別的資料。
js中的自增自減運算子和C++中相同。
直譯器從做往右解釋程式碼，所以在解釋一串用'+'連線的字元和數字混合的語句時，如果'+'左右都是數字，則先進行加法運算，如果有一個是字串，數字會被當做字串進行拼接。
字串轉數字：parseInt(str, base)，parseFloat(str)，後者會識別字符串中的有效的小數點字元。整數轉換一定要寫基數，因為沒有預設基數。轉換失敗返回NaN。
可以用isNaN(var)檢查是否NaN，isNaN如果傳入不能轉為數字的字串，則一定返回true，反之返回false。但是不能直接和NaN做比較，NaN是not a number的縮寫，所有的值為NaN的物件比較時都返回false，所以
條件語句中返回false的情況：0，""空字元,null值,undefined微電影,[]空陣列,false
typeof：運算子，返回一個值或物件的型別，如果物件未定義或型別未定義，則返回undefined。語法：typeof varObj/value;
陣列：最多可以儲存2e32個元素。和C++不同，定義陣列不需要傳遞陣列長度，而且任何變數都可以指向陣列，陣列本質是一個類。
    建立陣列：var varArray = new Array();更簡單的：var varArray = [];
    可以用索引定位陣列元素。
    js只支援一維陣列，所以如果要多維陣列，需要為每個陣列元素建立一個數組物件，層層巢狀。定位元素時和C++的多維陣列語法相同。
js的邏輯運算子與、或採用短路模式。
switch支援字串作為條件，而C++只支援數字。
for(item in items)是js的foreach語法。
宣告函式：function funcName([varlist]){}
作用域：1、全域性作用域：在網頁上，任何在函式之外宣告的變數，都可用於該頁面的所有指令碼，無論該指令碼在函式內還是函式外。
    2、區域性作用域：在函式內宣告的變數和形參都是區域性變數，函式返回後即釋放。但是，如果函式把某個區域性變數當做返回值來返回，則該區域性變數不會被釋放。
    當命名衝突時，直譯器會從最小作用域開始一層層查詢變數。
    和C++不同，大括號不能定義作用域。
String物件：內建物件。
    String物件和字串比較時，比較的是實際值，但兩個String物件比較時，比較的是物件引用。
    length：屬性，返回字串的長度
    indexOf(str,start),lastIndexOf(str,start):方法，在一個字串中查詢另一個字串。返回子串的位置，如果沒找到返回-1。前者從頭向後查詢，後者從後向前查詢。
    substring(start,stop)：返回字串的start到stop-1的子串，如果沒有stop，就返回start到結尾的子串。
    substr(start, len)：返回字串從start開始的len個字元的子串。
    toLowerCase(),toUpperCase()：轉換大小寫。
    charAt(pos)：返回字串中在pos位置的字元
    charCodeAt(pos):返回字串中在pos位置的字元的在Unicode編碼集的十進位制編號。比如A是65，a是97
        可以用charCode >= "A".charCodeAt(0)來進行單個字元的比較，但更簡單的是C++式的語法：char >= "A"
    fromCharCode():靜態方法，引數是一系列用逗號隔開的數字，每個數字代表一個Unicode字符集中的字元編碼。
    trim(str):去掉字串兩頭的空格。
    split(c/str)：用字元c或字串str分隔本字串，並返回分隔後的陣列
    replace(src, dst):用dst的字串替換本字串中的src子串，並返回替換後的新字串，不改變本字串
    search(str)：在本字串中查詢str子串，找不到返回-1，和indexOf類似，但是str可以是一個正則表示式
    match(str):和search方法類似，但是返回的是每一個匹配的子串組成的陣列
正則表示式：用'/'開始，用'/'結束的字串就是正則表示式，類似於Python的r的功能，可以讓字串中的正則是字面量，而不需要轉義。也可以用new RegExp(regstr)的方式建立正則物件，此時regstr中的正則表示式要注意轉義。
    RegExp的屬性：G：全域性匹配，而不是匹配到一個結果後就停止；I：不區分大小寫；M：多行標誌，可以讓^和$匹配多行的開始和結束。用法：即在//語法的後面加上屬性。
    var myreg = /\w+/gi
Array物件：內建物件
    length：返回陣列中的索引長度，即陣列最大索引等於length-1。比如 var a = [];a[10] = 10;則a.length=11
    push(element):向陣列尾部新增元素，索引增加
    concat(Array):連結兩個陣列，返回新陣列
    slice(start, end)：複製陣列中start開始到end-1索引的子陣列，如果不包含end，則複製start後的所有元素。把返回的子陣列複製到新陣列中。
    join(c)：用字元c把陣列元素連線為一個字串。
    sort()：按升序本排列陣列
    reverse()：反轉本陣列的元素順序
    indexOf和lastIndexOf：和String的作用相同。
    迭代陣列：迭代陣列的方法必須傳入一個使用者定義的函式，該函式原型如下：
        function myDeal(value, index, array){ do something}：value，元素的值，index，元素的索引，array，陣列本身
    every(myDeal):迭代陣列中的每個元素是否通過了函式的測試，自定義函式的返回值會被解釋為布林值，如果沒有返回值，則其實返回undefined，會被轉為false。如果所有元素通過測試，every返回true，否則返回false。
    some(myDeal):和every類似，只是如果有部分元素通過測試，則返回true，沒有元素通過測試才返回false。
    filter(myDeal):返回所有通過測試的元素組成的陣列。
    上面三個函式是迭代測試函式，下面兩個是迭代執行函式，即迭代執行自定義函式，而不進行測試。
    forEach(myDeal):迭代陣列中的每個元素執行myDeal，注意：此處的自定義函式不能有返回值
    map(myDeal)：和foreach類似，但是自定義函式必須返回結果，最終map返回每個元素執行結果組成的陣列，索引序和元素對應
Math：內建物件，其方法都是靜態的，可以不用生成物件，直接用類名.方法名(引數)來使用方法
    abs：求絕對值
    min，max：返回一列數字中的最小、最大值
    ceil：向上取整
    floor：向下取整
    round：四捨五入
    random：返回0-1之間的隨機浮點數
    pow：返回一個數的指定冪，第一個引數是底數，第二個引數是指數
Number：內建物件，值是有效數字的變數都被識別為Number物件
    toFixed(n):四捨五入數值保留n位小數，返回新數值
Date物件：內建物件，建立方式有：
    1、var dt = new Date();建立一個時間物件，時間是執行指令碼的PC機當前時間和日期
    2、var dt = new Date(949278000000):建立物件時指定從GMT的1970.01.01 00:00：00開始算起經過的毫秒數
    3、var dt = new Date("31 Jan 2014"):用可讀字串建立時間物件
    4、var dt = new Date(y,m,d,h,m,s,ms):傳入一列數字代表時間，1-12月用0-11代表，也可以用英文單詞或縮寫
    獲取日期：getDate():返回月份的第幾天
        getDay():返回星期幾，週日是0，週一到週六是1-6
        getMonth():返回月份，0-11代表1月-12月
        getFullYear():返回四位數字的年份
        toDateString():返回當前時區的日期字串
    設定日期：setDate():設定為當月中1號開始往後數的n天
        setMonth():設定為本年1月開始往後數的第n+1月（n從0開始，代表1月）
        setFullYear():設定4位整數的年份
        注意：js無法修改執行指令碼的PC上的日期和時間
        注意：設定日和月，如果超過了範圍，會自動往後滾動增加日期，比如setDate(58),表示1號開始後的第58天，超過了一個月的長度，js會根據本月長度自動往後滾動到下個月的正確天數上，月的滾動與此相同。如果超過了年底，也會滾動到下一年。
        注意：設定也可以是一個負值，表示時間往回計算，滾動原則同上。
    獲取時間：getHours(), getMinutes(), getSeconds(), getMilliseconds(), toTimeString(),和獲取日期類似。
        注意：時間是24小時制
    設定時間：setHours(), setMinutes(), setSeconds(), setMilliseconds(),和設定日期類似。
        注意：設定時間也會有滾動，原則和日期一樣。
定時器：window物件的方法。
    一次性定時器：setTimeout(myFun, delay)，myFun：回撥函式，delay：多少時間後觸發計時器，單位ms，返回值是定時器的ID
    clearTimeout(ID):在計時器觸發前清除計時器。
    迴圈定時器：setInterval(myFun, delay)，這裡的delay是時間間隔，單位ms，其他說明和setTimeout相同。
    clearInterval(ID):清除迴圈定時器。
自定義物件：之前js沒有class，自定義物件可以通過建立object物件或者直接賦值{}來產生，如下：
    var myObj = new Object();
    var myObj = {};    //推薦
    為物件增加屬性：直接為屬性賦值，也可以為屬性賦值為一個函式，如下：
    myObj.size = 1024*768; //為myObj物件增加size屬性，值是1024*768
    但是js並不會檢查屬性名拼寫是否正確，所以如果給屬性賦值時拼寫錯誤，只會產生一個新的屬性而不會報錯。
    可以通過{屬性名:屬性值或匿名函式或函式名[，屬性名：屬性值或匿名函式或函式名]}來建立物件，並分開單獨新增物件的方式更便於閱讀理解。
引用型別：類似於C++中的類。建立自定義物件時雖然有屬性和方法，但是這些屬性方法是物件特有的，不能共享，而且必須產生一個物件才可用。而引用型別是定義一個型別，並不產生物件。定義引用型別，必須定義一個建構函式，建構函式和引用型別名相同，引數可以有多個，語法和普通函式相同，如下：
    function MyObject(size, price){
        this.size = size;
        this.price = price;
    }
    說明：這裡定義了一個引用型別MyObject的建構函式MyObject，this.size和this.price是他的兩個屬性，他們的值在各個型別物件之間不共享。這種語法和Python類似。
    定義方法：
    MyObject.prototype.calcPrice = function(){ return this.size*this.price; }
    說明：引用型別的prototype屬性中新增的屬性是所有物件共享使用的，所以引用型別的方法一般作為其prototype屬性的子屬性。
    使用引用型別：通過new來建立引用型別的物件，如下：
    var myObj = new MyObject(100, 20000);
    注意：如果不使用new，雖然不會報錯，但是實際執行不正確，等於是給全域性window物件添加了一個屬性。
BOM：Browser Object Model，瀏覽器物件模型，由瀏覽器提供一組物件，這些物件有預定義好的方法和屬性，在瀏覽器開啟網頁是被瀏覽器建立，不需要在js中顯式建立。
    常見瀏覽器物件BOM（大部分瀏覽器都具有的物件及相同的方法和屬性）層級關係如下：
    window物件----location物件
                |-history物件
                |-document物件----forms物件
                                |-images物件
                                |-links物件
                |-navigator物件
                |-screen物件            
    1、window物件：代表瀏覽器的框架和視窗，其中包含了網頁（document），某種程度上代表了瀏覽器本身。通過window的屬性，可以確定瀏覽器型別、使用者訪問歷史、瀏覽器視窗大小、使用者螢幕大小等，可以修改瀏覽器狀態列的文字、修改載入的頁面甚至開啟新視窗。
        window物件是全域性物件，在瀏覽器中訪問其屬性和方法時不需要指定屬性名和方法名。實際上，js程式碼中建立的全域性函式和全域性變數在瀏覽器中都被建立為window的屬性和方向。
    2、history物件：該物件是window物件的屬性，用於跟蹤使用者訪問的每個頁面。這個頁面列表通常稱為瀏覽器的歷史棧，使用者點選瀏覽器的前進、回退來重新訪問頁面。
    屬性：length：代表歷史棧的頁面數量
    方法：back()：回退到前一個頁面
        forward():前進到後一個頁面
        go(n):指定回退（負數）多少個頁面或前進（正數）多少個頁面
    3、location物件：該物件是window物件的屬性，包含當前頁面的位置資訊。
    屬性：href：該頁面的URL
        hostname：連線的主機名稱
        port：連線的主機埠
        protocol：和主機互動的協議，如"https"
    修改location.href指向新URL，或者呼叫location.replace(url)方法都可以跳轉到新頁面，區別是前者把新URL加入歷史棧頂部，後者用新URL替換歷史棧中的當前頁。
    4、navigator物件：該物件是window物件的屬性，包含當前瀏覽器和當前電腦作業系統的資訊。
    HTML5為其新增了一個屬性：geolocation，用於獲取使用者電腦的經緯度等資訊，用法：
        navigator.gellocation.getCurrentPosition(cbGetSuccess, cbGetError),兩個函式分別是呼叫成功或失敗的回撥函式。cbGetSucc回撥函式的引數是position物件，包含latitude、longitude、altitude、speed。cbGetError回撥函式的引數是errorObj物件，包含code、message屬性，描述了錯誤碼和錯誤資訊。
    5、screen物件：該物件是window物件的屬性，包含當前螢幕的資訊，屬性包括height、width，單位畫素。屬性colorDepth代表螢幕的色彩位數。
    6、document物件：該物件是window物件的屬性，代表當前頁面。
    方法：write(str):向網頁中輸出str，str可以是普通字串，也可以是可渲染的html程式碼段。
    屬性：bgColor：代表頁面的背景色。
    images集合：document的屬性。頁面的每個img標籤都有一個img物件，img屬性name就是物件的名稱，每個物件都儲存在iamges集合中。
    links集合：document的屬性。頁面上所有連結a標籤的集合。
判斷瀏覽器：特性檢測，即用if語句判斷當前瀏覽器是否定義了某個特性屬性或方法。
    if (typeof 屬性or方法 != "undefined"){ 使用該特性; }
    瀏覽器嗅探：通過navigator.userAgent屬性，該屬性字串中包含了特定瀏覽器的字串，但是這個字串可能變動很大，所以不推薦該方法。
    
DOM:Document Object Model，文字物件模型。注意：和瀏覽器物件模型不同，BOM是由瀏覽器提供的物件，因為會有通用和不通用的物件、屬性、方法，用於指定、修改瀏覽器提供的元素（包括網頁本身和瀏覽器上的功能）而DOM是標準的文件物件模型，提供的也是通用的文件物件，用於設定網頁本身節點樹。
    基本DOM物件：Node：文件中的每個節點都對應一個Node物件；NodeList：Node物件的列表；NamedNodeMap：允許按名稱而不是索引訪問Node物件。
    高階DOM物件：
    Document引用物件及方法：只有Document物件的方法可以在頁面上查詢、建立和刪除元素。
        查詢元素：getElementById(idValue):根據元素的ID屬性返回該元素（節點）的引用，返回節點型別對應的引用物件，如h1型別的元素對應的元素物件型別是HTMLHeadingElement，失敗返回null
            getElementByTagName(tagName):根據標記名稱（即標籤名稱如td）返回一組元素（節點列表）的引用，返回NodeList物件，可以用[]或者item()方法返回具體的列表元素（某個節點物件）
            querySelector(cssSelector):返回與給定的選擇器匹配的第一個元素（節點）
            querySelectorAll(cssSelector):返回與給定的選擇器匹配的所有元素（節點列表）
            注意：querySelector、querySelectorAll也可以在Element物件上使用
        建立元素和文字：createElement(elementName):使用指定的元素型別建立一個節點，返回建立的元素，Element引用型別，Node引用型別
            createTextNode(text):建立並返回包含text的文字節點（即元素的內容），Text引用型別，Node引用型別
        屬性：documentElement，指向一個Element物件，該物件代表了DOM的根節點，一般是<html>元素節點
    Element物件及方法：
        屬性：tagName：儲存元素的型別名
        方法：getAttribute(attrName):獲取元素某個屬性的值，如果屬性不存在則返回null或空字串
            setAttribute(attrName, value):為元素新增或設定某個屬性的值
            removeAttribute(attrName):刪除屬性的值，並用預設值代替
    Node物件：導航DOM
        通用屬性：firstChild 、lastChild：返回元素子節點
            previousSibling、nextSibling：在同級節點中，返回本節點的兄弟節點，文字節點也是兄弟節點，即使文字節點內容是空，所以兩個元素節點之間總是有至少一個文字節點
            ownerDocument：返回包含本節點的文件的根節點
            parentNode：返回本節點的父節點
            nodeName：返回本節點的名稱
            nodeType：返回一個數字，代表本節點的元素型別，1是元素節點，3是文字節點
            nodeValue：用於設定或獲取本節點的內容
        通用方法：可以新增和刪除DOM節點
            appendChild(newNode):將一個Node物件新增到本節點的子節點末尾，返回新新增的Node物件
            cloneNode(cloneCHildren):返回當前節點的一個副本，引數是boolean，如果為True，則拷貝本節點及其所有子節點，如果為False，則只拷貝本節點
            hasChildNodes():是否有子節點
            insertBefore(newNode, referenceNode):在referenceNode前插入一個Node物件，返回新插入的Node節點
            removeChild(childNode):從本節點的子節點列表中刪除一個子節點，並返回刪除的節點物件
    注意：一般獲取的DOM節點物件，都同時具有Element和Node引用物件型別的屬性和方法，而document物件具有Document、Element、Node三種類型的屬性和方法
    操作DOM元素：
        改變外觀：1、訪問物件的style屬性：通過該屬性可以直接訪問修改元素的css屬性，如果css屬性名稱包含’-‘，則把‘-’去掉，其後面的單詞首字母大寫，然後可以訪問css屬性、修改css屬性。該屬性值直接對映HTML中元素的style屬性值，但是不能對映<style></style>或外聯樣式表文件中設定的css樣式。
            2、訪問物件的className屬性，並修改其值為某個CSS類名。該方法可以減少js程式碼量，可以通過class屬性直接引用<style>和外聯檔案中的css樣式，便於引用和修改。
    其他有用的屬性和方法：適用於所有元素物件
        1、offsetTop,offsetLeft:返回元素相對於父元素的上、左偏移量，便於確定當前元素的位置
        
事件：JS可以監聽和響應的事件包括：滑鼠事件；鍵盤事件；進度事件（如網頁載入過程）；表單事件（表單某個內容被改變）；突變事件（DOM節點發生改變）；觸控事件（觸控式螢幕）；錯誤事件（出錯時）。JS的內建物件並沒有事件，事件是由BOM和DOM物件提供的。
    三種把程式碼關聯到事件的方法：
    1、指定HTML屬性；在HTML中為元素新增事件響應屬性，如onclick屬性。可以為事件屬性設定一行JS表示式，或者是“ return fun()"，即設定一個響應函式，某些事件需要通過函式的返回值來判斷是否繼續執行，比如超連結<a>的onclick需要返回值判斷是否要執行跳轉，而有些事件不需要返回值，則可以直接給事件屬性一個響應函式，而不需要return。
    例1：<a href="www.baidu.com" onclick="alert('跳轉到百度')"></a>
    例2：<a href="www.baidu.com" onclick="return myFun()"></a>
        指令碼中：function myFun(){return True;}
    例3：<body onload="myLoad()" onunload="myUnload()"></body>
    響應函式也可以傳入引數，傳入的引數有兩種：this，event，如<a href="www.baidu.com" onclick="return myFun(this)"></a>,如果事件屬性的響應函式字串中寫的是this，那麼響應函式內收到的引數直接指向了元素的物件，如果寫的是event，那麼響應函式內收到的就是一個Event物件，該物件包含了事件型別、發生事件的元素物件。所以一般寫的是event。
    缺點：1）HTML和JS混寫，不易維護；2）不修改HTML就不能修改關聯的響應函式；3）只能為HTML中出現的元素關聯響應函式，對於動態建立的元素無法關聯。
    2、指定物件的特定屬性（如事件屬性）；
    例：document.getElementById("myLink").onclick = directPage;
    function directPage(e){ return e.type);
    即把函式物件賦值給ID是“mylink”的節點的onclick方法屬性。如果onclick=null，則刪除響應函式。
    缺點：屬性只能有一個響應函式，不能新增多個響應函式
    3、標準事件模型：每個DOM元素都有EventTarget物件的屬性，該物件有兩個方法，用於新增和刪除事件監聽器。
    addEventListener:為元素新增響應函式
    例：document.getElementById("myLink").addEventListener("click", function (e){ e.type; e.preventDefault()});
    e.preventDefault()可以阻止執行預設操作。
    該模型可以為同一個元素的同一個事件註冊多個響應函式，函式將按註冊的順序執行。
    removeEventListener:如果註冊時使用的是命名函式，那麼可以用移除這個響應函式。
    Event物件：響應函式的入參，具有如下屬性：
        bubbles：表示是否允許事件冒泡，即事件是否可以沿著DOM上傳
        cancelable：表示是否可以取消事件的預設行為
        currentTarget：事件在DOM中傳遞時，指定事件的當前目標
        defaultPrevented：表示在事件上是否呼叫preventDefault
        eventPhase：表示事件當前處於事件流的哪個階段
        target：表示引發事件的元素（文字節點也可以）
        timestamp：表示事件發生的時間
        type：表示事件的型別
    MouseEvent物件：滑鼠相關的事件，屬性如下：
        altKey：表示事件發生時，是否按下ALT鍵
        button：表示按下滑鼠的哪個鍵
        clientX，clientY：表示事件發生時滑鼠在瀏覽器視窗的水平、垂直座標
        ctrlKey：表示事件發生時，是否按下CTRL鍵
        metaKey：表示事件發生時，是否按下META鍵
        relatedTarget：用於標識第二個事件目標。對於mouseover事件，該屬性表示滑鼠指標退出的元素；對於mouseout事件，該屬性表示滑鼠指標進入的元素
        screenX，screenY：表示事件發生時，滑鼠相對於螢幕的水平、垂直座標
        shiftKey：表示事件發生時，是否按下SHIFT鍵
    如果響應的事件是滑鼠事件，那麼響應函式的入參就可以同時訪問到Event物件和MouseEvent物件的屬性，但如果響應的事件不是滑鼠事件，則響應函式不能訪問到MouseEvent物件的屬性
        可以產生MouseEvent物件的事件有：
            click：當指標位於某個元素或文字上時，單機滑鼠觸發
            mousedown：當指標位於某個元素或文字上時，按下滑鼠觸發
            mouseup：當指標位於某個元素或文字上時，彈起滑鼠觸發
            mouseover：指標移入某個元素或文字時觸發
            mousemove：指標位於某個元素或文字上時觸發
            mouseout：指標從某個元素或文字上移開時觸發
    拖動事件：為元素設定draggable="true"，可以讓元素變成可拖動元素。相關事件如下：
        1、dragstart：開始拖動時在元素上觸發，從本地拖動到瀏覽器不能觸發
        2、drag：拖動過程中一直觸發
        3、dragend：拖動停止時觸發，無論是否釋放了該元素，從本地拖動到瀏覽器不能觸發
        4、dragenter：當拖動本地檔案或網頁元素第一次進入另一個元素時，在另一個元素上觸發，即由另一個元素響應，可以用於拖動任務的結束，即該元素可以接收拖動內容
        5、dragover：當拖動本地檔案或網頁元素時，移動到另一個元素，在另一個元素上觸發
        6、dragleave：當拖動本地檔案或網頁元素時，移除另一個元素，在另一個元素上觸發
        7、drop：釋放滑鼠時，在釋放時滑鼠所在的元素上觸發
        事件（1）（2）（3）是事件源觸發的事件，事件（4）（5）（6）（7）是目的元素觸發的事件。
        注意：dragover在瀏覽器中會有預設行為，導致drop無法觸發，所以如果想響應drop，需要響應dragover，並且e.preventDefault()禁止預設行為。drop在不同瀏覽器中也會有不同的預設行為，也可以通過e.preventDefault()禁止。
        可以通過DataTransfer物件在拖放過程中傳遞資料。DataTransfer物件可以通過event物件的dataTransfer屬性訪問。該物件有兩個方法：
            setData(type, value):設定傳遞的資料，第一個引數是資料型別，IE支援“text”和“html”，其他瀏覽器同時支援MIME型別資料
            getData(type):根據setData時的type來讀取資料。
            setData在dragstart時設定，getData在drop時讀取。

HTML表單：不論頁面有幾個獨立表單，每次只能向向web伺服器提交一個表單的資訊。<form/>標記內的元素就是一個獨立表單區域，可以設定的屬性有：action：表單提交到哪裡；method：如何提交資訊put/post；target：表單的響應載入到哪個框架上。
    <form/>表單對應的元素物件是HTMLFormElement物件，可以用forms集合來引用表單物件，也可以用元素查詢函式來查詢表單，如果表單有name屬性，也可以通過docment.form_name訪問表單物件。表單的其他屬性對對映到了關聯的物件屬性。
    HTMLFormElement物件的elements物件也是集合，儲存了表單內所有互動元素的物件（除了<input type=images/>）,可以用form[n]或form.elements[n]選取元素。elements的length長度和Form物件的length長度相同。
    Form物件有submit()方法和submit事件、事件監聽器，但是，用submit()方法提交表單時，不會觸發submit事件和監聽器。
    Form物件有reset()方法，可以清空表單或還有預設值（如果有）。
    submit事件也支援e.preventDefault來取消預設操作（即向伺服器提交表單），因為可以在事件響應中檢查資料進而決定是否提交到伺服器。
    表單中的互動元素：所有<input/>建立的元素都對應於HTMLInputElement物件
        1、文字元素：<input type="text"/>,普通文字/<input type="password"/>,密碼輸入/<textarea></textarea>,大塊文字顯示/<input type="hidden"/>，隱藏文字框，當需要把多個頁面的資訊提交給伺服器時，可以把前面頁面的資料放到隱藏文字框中，最後統一發送給伺服器。
        2、選擇按鈕：<input type="checkbox"/>複選框/<input type="radio"/>單選按鈕
        3、列表框：<select><option></option></select>下拉列表框（combobox)/<select size="4"><option></option></select>列表顯示框（listview）
        4、按鈕：<input type="button"/>或者<button></button>普通按鈕/<input type="submit"/>提交按鈕/<input type="reset"/>重置按鈕
    表單互動元素物件共有的屬性和方法：
        1、name屬性：提交表單資訊到伺服器時，name會和value一起提交
        2、value屬性：互動元素的值。但是不同元素的value的含義不同，需要區別對待
        3、form屬性：互動元素所屬的表單物件。對於submit元素，可以通過該屬性來檢索表單下的互動元素的值，進行資料檢驗，而無需特別指定表單物件。
        4、type屬性：互動元素的型別
        5、focus()：呼叫該方法使該物件成為焦點物件，呼叫該方法或通過互動獲得焦點，則觸發該物件的focus事件，onfocus事件處理屬性進行響應
        6、blur()：呼叫該方法使該物件失去焦點，呼叫該方法或通過互動獲得焦點，則觸發該物件的blur事件，onblur事件處理屬性進行響應
        注意：如果若干元素在自身的onfocus和onblur中設定了其他元素的focus和blur，則可能引起死迴圈。
        7、readonly屬性:元素只讀。
    互動元素獨有的屬性和方法：
        1、按鈕button：value屬性的含義是在按鈕上顯示的文字。
            特殊事件：mouseup，mousedown，滑鼠在按鈕上按下或回車時觸發
            submit和reset有自己的功能，一般不需要修改。
        2、文字框text：value含義是文字框中的文字，可以讀取和顯示。文字框的值一般都會當做字串，需要數字時可以用Number()或parseInt()、parseFloat()進行轉換
            特殊屬性：size，可以容納的文字字元寬度；maxlength，最長輸入字元長度；readOnly，文字框只讀，防止修改文字框內容。
            特殊方法：select():選擇或加亮文字框中的所有文字
            特殊事件：select：使用者選擇文字框中的文字時觸發
                change：當且僅當文字框失去焦點時的值和獲取焦點的值不同時觸發該事件，即該事件可
                以在文字框的值發生了改變時才進山資料校驗。
                keypress,keydown,keyup：按鍵、按下、彈起時觸發
        3、文字域textarea：元素沒有value屬性，但是對於的HTMLTextareaElement物件有value屬性，含義是<textarea></textarea>標籤之間的文字。元素屬性和text類似，但是沒有maxlength。
            特殊屬性：cols，顯示區每行顯示的文字字元數；rows，顯示區可顯示多少行；wrap，是否啟動自動換行，off是關閉，soft是啟動，向伺服器提交訊息時不帶換行符，hard是啟動，向伺服器提交訊息時每個自動換行的地方都新增作業系統的換行符（Windows是\r\n，Linux是\n）。
            特殊事件：keydown、keyup、keypress、change
        4、單選框radio和複選框checkbox：對應的是HTMLInputElement物件。value是HTML或js預定義的，與使用者互動無關，每次返回相同的值。
            特點：建立radio，一組name相同的radio就是一組單選框，只能為其中一個設定元素屬性：checked="checked"，多個設定則只取最後一個。建立單選框組後，在js中用name引用時就是一組單選框，可以像陣列一樣訪問。
            特殊屬性：checked：檢查按鈕是否被選中，對於radio，需要迴圈變數每個radio找到選中的那個。
        5、下拉列表和列表框：下拉列表其實是列表框的特殊情況。<select>元素對應HTMLSelectElement物件。該物件有一個options屬性，對應<select>元素內部的<option>組。<option>元素對應HTMLOptionElement物件。
            特殊屬性：<select>標籤的size屬性：定義列表框可見行數，如果是1，就是下拉列表框；<option>標籤的selected屬性：定義該項是否被選中，選中值selected
            特殊屬性：HTTPSelectElement：selectIndex，返回索引值表示哪些option被選擇，結合options屬性可以獲取被選擇的HTTPOptionElement；length，返回被選option的數量
            特殊屬性：HTTPOptionElement：index，返回該option在select的options屬性中的索引；text，該元素顯示的文字；value，為option定義的值，提交表單時會發給伺服器
            特殊方法：在指令碼中新增和刪除option選項
                1、建立新的option物件：new Option(text, value);引數1要顯示的文字，引數2繫結的值
                2、新增option物件/元素：theSelectElement.options[n]=newOption;把新option物件賦予select物件的索引n的位置，該位置如果之前有元素，則會被取代
                3、刪除option物件/元素：theSelectElement.options[n]=null;刪除索引位置n的option元素，options會自動重新排列，n之後如果有其他元素，則他們的索引都減1
            標註方法新增新選項：1、建立新的option物件（同上）；2、用Select物件的add(newOpt, pos)插入新option，引數1是新option物件，引數2是插入的option前一個位置的option，如果是null，則放到options末尾，該方法會自動調整options陣列，插入元素不會取代其他元素
            特殊事件：blur，focus，change，當用戶改變選擇觸發change
    HTML5中<input/>新增的屬性：1、autocomplete，控制元件的值可以由瀏覽器自動填充；2、autofocus，頁面載入控制元件時是否有焦點；3、form，相關表單的ID，如果指定則控制元件可以放在原始檔的任意地方，否則只能放在<form/>元素內；4、maxLength，為text、email、search、password、tel、url指定最大輸入字元數；5、pattern，用該正則表示式檢查控制元件輸入的值；6，placeholder，提示字元用於說明控制元件該輸入什麼；7、required，指定在提交表單前使用者必須給控制元件輸入值；8、type="range"，滑塊的特殊屬性：min，滑塊最小值；max，滑塊最大值；step，滑塊步進值
    HTML5中<input/>新增的事件：input，當元素的值發生改變時觸發（change是失去焦點並且值發生變化時觸發）
    HTML5新增的表單控制元件：
        <output/>:用於顯示輸出值，需要個form關聯。屬性：for=""，關聯的顯示其值的元素，與渲染無關，用於語義說明；form="formXXX"，關聯的form表單的id；value，在<output></output>直接顯示的文字。如果用form關聯了表單，就可以通過Form物件按name引用該元素。
        <meter/>:用於圖形化的顯示範圍值。屬性：min,max,最大最小值；optimum，low，high會影響元素的顏色（語義說明）；value，顯示的值。如果不支援該元素，則顯示標籤中間的文字
        <progress/>:表示任務完成的進度。屬性：value，表示控制元件的值；max，控制元件可顯示的最大值。如果不支援該元素，則顯示標籤中間的文字

JSON:js中可以用JSON物件處理js物件的序列化和反序列化。
    序列化：JSON.stringify(js物件);把js物件序列化為json字串
    解析json：JSON.parse(json語句);把json字串解析為js物件
    例：在可拖動元素中，可以通過dataTransfer傳遞資料，但是隻能傳遞字串，不能傳遞js物件，此時可以把js物件序列化為json字串。

Web儲存：Web儲存分為本地儲存(localStorage物件)和會話儲存(sessionStorage物件)
    會話儲存在關閉瀏覽器後就被刪除。
    特點：資料儲存在瀏覽器上，不傳遞給伺服器；儲存空間更大，Chrome和Firefox是5M，IE是10M；本地儲存的資料不會過期，除非開發人員或使用者主動刪除；資料按鍵值對儲存
    方法：setItem(key, value);設定鍵值對，如果key含有空格等特殊字元可以使用
        localStorage.key = value;設定鍵值對
        value = getItem(key);獲取資料
        localStorage.removeItem(key):刪除資料
        localStorage.key = null;刪除資料
        localStorage.clear();刪除所有資料
        使用：本地儲存只能存字串的鍵值對，所以對於js物件，可以用JSON.stringify序列化為字串後儲存，使用的時候JSON.parse解析出來

AJAX：可以通過js直接和伺服器進行HTTP互動，傳送獲取資料，實現網頁的區域性重新整理
    XMLHttpRequest：瀏覽器內建物件，所有瀏覽器都支援，封裝了AJAX功能
        建立：var request = new XMLHttpRequest();
        使用：1、request.open(requestType, url, async);初始化XMLHttpRequest物件。引數1是請求型別字串，可選值"GET"/"POST"；引數2該請求要發往的URL；引數3取true/false，表示是否非同步模式請求，同步模式會阻塞瀏覽器，所以預設是true
            2、request.send(msgbody);open建立了請求的HTTP包，send傳入的是請求包附帶的請求體，如果沒有傳入null
        屬性：status，該屬性表示伺服器返回的狀態碼；readyState，數值，代表當前的請求狀態，用於非同步請求，狀態碼0=已建立物件，未呼叫open，1=已呼叫open，未傳送請求，2=請求已傳送，標題和狀態已接收到並可用，3=接收到伺服器的響應，4=接收完請求資料；responseXML，把接收到的資料載入到XML DOM物件中；responseText，返回純文字
        注意：即使readyState返回了4，但是仍需要檢查status
        事件：readystatechange，處理方法：request.onreadystatechange=cbfun;
    iframe技術：在網頁中內嵌隱藏的iframe用於網頁ajax請求和跳轉，這樣當用戶回退網頁時，其實還在本頁，而且能保留之前的互動資料
    
HTML5多媒體：新增了<video>和<audio>標籤
    <video>：屬性：src="a.mp4"，用於載入伺服器本地視訊檔案；controls，顯示瀏覽器預設的視訊控制控制元件；preload，預先載入視訊檔案可解碼的第一幅圖作為網頁中視訊預覽的畫面；poster="b.jpg"，把preload的畫面換成自定義圖片。
        <source>：子元素，放在<video/>之間，屬性：src="a.mp4"，當服務端有多個格式的視訊檔案時，用多個該元素可以讓瀏覽器選擇載入某個可解碼的視訊；type="video/mp4"，該視訊檔案的格式，也支援MIME字串；codecs=“ssss”，該視訊檔案具體的編碼資訊
    當瀏覽器不支援video屬性時，顯示標籤的文字內容。
    video和audio元素對應HTMLMediaElement物件。
        建立：var obj = document.createElement("video");
        方法：canPlayType(mimeType):支援引數指定的格式的可能性，返回值：probably，可以播放；maybe，不播放視訊無法判斷；""，無法播放。
            load():開始從伺服器上載入視訊
            pause():暫停媒體播放
            play():開始或繼續媒體的回放
        屬性：autoplay,表示獲得足夠顯示的媒體資料後，是否子歐諾個開始播放；controls，對應媒體元素的controls屬性；currentTime，當前播放的時間，修改時間會把媒體設定為新時間；duration，獲取媒體的長度，單位秒，如果沒有可用媒體，返回0，如果無法確定時長，返回NaN；ended，是否要結束播放；loop，對應媒體元素的loop屬性，是否迴圈播放；muted，是否靜音；paused，是否暫停；playbackRate，播放速率，1.0是常速；poster，對應元素的poster屬性；src，對應元素的src屬性；preload，對應元素的preload屬性；volume，音訊音量0.0~1.0
        注意：如果用obj.src="a.mp4"修改了播放的視訊，那麼一定要obj.load();來載入視訊，然後obj.play();，否則直接play無法播放視訊
    常用事件："abort"，中止媒體播放時觸發；"canplay"，媒體資料足夠播放時觸發；"canplaythrough"，整個媒體檔案可以回放；"durationchange"，媒體的時長髮生變化；"ended"，回放完成時觸發；"error"，發生錯誤時觸發；"loadstart"，開始下載媒體檔案；"pause"，暫停時觸發；"playting"，開始播放或繼續播放；"progress"，正在下載媒體檔案;"ratechange"，播放速率發生變化；"seeked"，播放位置偏移時觸發；"seeking"，播放位置開始偏移時觸發；"timeupdate"，修改了currentTime屬性;"volumechange",改變了volume或muted屬性