[JS] JavaScript由淺入深(1) 基本特性

標籤：

1.全域變數的特性：

　　在函數體內直接寫的變數（未用var標誌）自動升級為全域變數。

        (function func() {            i = 100;        }());        alert(i);

　　非常不建議不寫var.

        var num = 1;        (function func() {            i = 100;        }());        delete i;        delete num;        if (typeof i != "undefined") alert(i);        if (typeof num != "undefined") alert(num);

　　

 

2.DOM操作

　　a.什麼是DOM(Document Object Model)，文件物件模型。包括元素節點，文本節點，屬性節點和注釋節點。

　　b.DOM操作：

　　　　　　　　HTML:write(),innerHTML,innerText,getElementById()

　　　　　　　　CSS:

    <div>text</div>    <script>        var e = document.getElementsByTagName(‘div‘)[0];        e.style.background = ‘blue‘;    </script>

　　　　　　　　Event:事件有4種添加方式。

　　　　　　　　所有事件：事件

 

3.異常：

try {     throw ‘exception happend‘;} catch (e) {      alert(e);} 

　　

4.類型：

　　JS中5種基本類型：string number boolean undefined null　　和一個複雜類型：object

　　注意:

　　　　typeof null 是object。

　　　　因為null類型只有一個值null，null即代表一個類型，又代表一個Null 物件的指標。

　　　　因為undefined類型只有一個值undefined，undefined代表一個類型，又代表一個未定義的變數.

　　

　　　　typeof Object 是function

　　　　Object Function String都是建構函式。（推薦以後建構函式名Pascal命名，方法Camel命名）

 

5.內建對象

　　JS中有7個Number String Date Array Boolean Math RegExp預設建構函式。通過new關鍵字，可以定義對應的對象。

 　  注意：

　　　　prototype是用來向對象添加屬性和方法。

　　　　constructor是指向函數本身的指標。

 

6.事件

事件流：

　　事件流是指在頁面中接受事件的順序。

　　事件冒泡指從最具體的節點到最不具體的節點,事件捕獲和事件冒泡完全相反。

事件對象：

　　觸發DOM事件時，會產生事件對象。

　　type：事件類型　　　　　　target：相當於sender　　　　　　stopPropagation()：阻止事件冒泡　　　　preventDefault():阻止事件預設行為（如：a標籤預設點擊跳轉事件）

添加事件：

　　addEventListener(事件名，函數，是否冒泡)

　　attachEvent(on事件名，函數)

　　on事件 = 函數

a.直接在html上

　　　　<div onclick="func()">text</div>　　　　<script>        　　function func() {            //todo        　　}　　　　</script>

b.DOM0級處理

    <div >text</div>    <script>        var e = document.getElementsByTagName(‘div‘)[0];        e.onclick = func;        function func() {            //todo        }    </script>

c.DOM2級處理

    <div >text</div>    <script>        var e = document.getElementsByTagName(‘div‘)[0];        e.addEventListener(‘click‘, func);        function func() {            //todo        }    </script>

d.IE8以下

    <div >text</div>    <script>        var e = document.getElementsByTagName(‘div‘)[0];        a.attachEvent(‘onclick‘, func);        function func() {            //todo        }    </script>

　　

 

7.BOM

　　BOM(BrowserObjectModel)瀏覽器物件模型。

　　包括：window，timing，history，location，screen

window：

　　window對象代表瀏覽器視窗。DOM節點屬於window對象的一個屬性。所有的全域變數自動成為window對象的一個屬性。

timing：

    <div>text</div>    <div>text</div>    <script>        setInterval(function () {            var e = getDivs()[0];            e.innerHTML = new Date().toLocaleString();        }, 500);        setTimeout(function() {            var e = getDivs()[1];            e.innerHTML = new Date().toLocaleString();        }, 500);        function getDivs() {            return document.getElementsByTagName(‘div‘);        }    </script>

 

8.DOM控制HTML：

　　增：document.createElement(tagName);

　　刪：element.removeChild(element);

　　改：element.setAttribute(attrName, attrValue);

　　查：

　　　　document.getElementById(elementId); 　　　　element.parentNode;　　　　element.childNodes;

　　　　document.getAttribute(attrName);

 

9.prototype（原型）

 　　除了基本類型外，都有prototype屬性。

 　　prototype（包括原型鏈）中的屬性會直接繼承到對象上。

　　

10.call和apply

　　當用call和apply調用方法時，方法中的this可以由我們指定。

        function func(a, b) {            this.sum = a + b;            return this;        }        var o1 = {};        var o2 = {};        func.call(o1, 3, 5);        func.apply(o2, [3, 4]);        alert(o1.sum);        alert(o2.sum);

 

時間：

　　GMT（Greenwich Mean Time）——格林尼治標準時間，世界基準時間

　　UTC 這幾個字母是英文Coordinated Universal Time 和法語Temp UniverselleCoordinee 的混合體。世界時。原子時。

 

[JS] JavaScript由淺入深(1) 基本特性