學習碎片 2015-3月31日

文件下載

H5中，能夠給a增長了一個download的屬性，就能夠實現點擊連接，瀏覽器對文件源進行下載。並且這個還支持 blob: URLs 和 data: URLs。若是HTTP的Content-Disposition存在值且和a的文件名不同，那麼HTTP頭優先級比a裏的高。

html<a href="public/pdfs/demo.pdf" download="yourname.pdf">
    下載文件
</a>

惋惜，瀏覽器支持度不夠：
chrome 14 以上支持
firefox 20.0 (20.0)
IE Not supported
Opera 15
Safari Not supported
今日複習:

js event

dom event對象有currentTarget、target這兩個屬性。其中currentTarget指示的是處理當前事件所綁定的元素;target表示事件真正的目標，即究竟是在哪一個元素上觸發事件。

好比，咱們對整個文檔body進行了事件click的綁定,當點了body裏面的一個ID叫zBtn的按鈕，那麼

jsvar zBtn = document.getElementById('zBtn');

document.body.addEventListener('click', function(e) {
    console.log(this); //body元素
    console.log(e.target); //返回的zBtn元素
    console.log(e.currentTarget); //返回的是body元素，由於事件是註冊在body上的。
});

在IE中，event對象和DOM中的event不一樣，跟DOM的event相同的一個特色是，不一樣的事件類型的事件對象裏面的屬性是有所不一樣的。IE中的全部的event對象都會有：
1. cancelBubble 值爲boolean，若爲true則取消事件冒泡。
2. returnValue 值爲boolean，若爲false則會取消事件默認行爲.
3. srcElement 等同於DOM event中的target
4. type

HTML事件處理

html<a href="xxxxx" onClick = "youClickMe()" >點我!</a>

DOM0級的事件處理

如下事件綁定形式

jsaEl.onclick = function(){
}

DOM2級事件處理

jszBtn.addEventListener('click', function() {});

---

事件類型

下面介紹一些事件（不包括被廢棄的事件）

UI事件

load

頁面徹底加載完後在window上觸發。
圖片加載完成時觸發。 //Image只要把src屬性設置了，就會開始加載
嵌入內容加載完成時在<object>觸發。

在IE9+ 、firefox 、 opera 、 chrome 、 safari 3+ 上<script>也會觸發load事件。與Image不一樣的是，script要有了src並被添加到文檔裏纔開始加載。

unload

頁面徹底卸載後在window上觸發。
全部框架都卸載後在框架集上觸發。
嵌入內容卸載徹底後在<object>上觸發。

error

js錯誤時在window上觸發。
沒法加載img圖片內容時在img上觸發。
沒法加載嵌入內容時在<object>時，在它上面觸發。
框架沒法加載時。

select

input和textarea中一個或多個字符觸發時。

resize

窗口大小和框架大小變化時，在窗口或者框架上觸發。

scroll

滾動帶有滾動條元素的內容，在該元素上觸發。p.s. body元素中包含加載頁面的滾動條。