劃時代的Web API ?下面我們分別對HTML5提供的主要API進行介紹。 3.3 Drag＆Drop API 曾幾何時，不能判斷拖放行為使得很多人抨擊Web，認為這是Web較之桌面客戶端程序的明 顯弱點之一。實際上，哪怕是IE6如此老舊的瀏覽器，它也是支持拖放行為的，只是缺乏更進一 步的程序方法支持而已，很多Web設計愛好者在吹牛的時候應該注意到這一點。 HTML5為拖放行為提供了Drag&Drop API，Drag代表拖動．Drop代表放下，用于幫助開發 者方便地處理此類事件。今后，濟南網站建設在瀏覽器里處理拖放行為就像處理mouseo’ver、mouseout、 click事件一樣方便。 3.3.1 以前的解決方案 在過去，我們為了在網頁上實現拖放行為往往需要化費較大的力氣，基本原理就是通過判斷 鼠標的點擊事件和移動的位置來判斷。現在，我們向讀者介紹兩個過去常用的方法來解釋拖放行 為的技術方案：一種是基本上依靠JavaScript原生代碼編程實現，另一種是依靠Web2．O時代最鋒 利的前端之刃’iQuery.來實現。 3.3 Drag & Drop API 83 1．基本的JavaScript原生實現 通過原生的JavaScript代碼實現拖放行為非常復雜，需要使用DOMO事件模型里的 mousedown、mousemove和mouseup事件，濟南網站建設還需要不斷獲得鼠標坐標，修改元素的坐標位置， 性能會成為很大問題。另外，實現時還需要考慮瀏覽器兼容性問題，并且不支持瀏覽器頁面以外 的拖放行為。 2．JavaScript庫 iQuery等JavaScript庫提供了封裝好的拖放處理，解決了JavaScript原生實現的復雜性和兼容性 問題。但是這些JavaScript庫為了保證兼容性進行了復雜的計算和處理，使用了大量的代碼，造成庫的體積過大，影響頁面的加載速度，增大了網絡流量。 3.3.2 Drag＆Drop API的優點 使用Drag&Drop API，可以給我們帶來如下好處。 口它通過事件的方式讓瀏覽器原生支持拖放行為，濟南網站建設不再需要編寫復雜的JavaScript代碼， 不再需要考慮千奇百怪的瀏覽器兼容性問題。 口用原生方式取代JavaScript代碼的方式也大大減少了頁面的大小，讓用戶能更快地打開頁 面，減少帶寬請求。 口它提供了dataTransfer摟口來存儲數據，允許我們定義拖放時的效果，此外還支持自定 義拖放操作。 口它支持瀏覽器頁面以外的拖放行為，例如從桌面拖放一個文件到瀏覽器頁面里，這在以 前是不可能實現的。 3.3.3 如何檢測瀏覽器是否支持Drag＆Drop API 按目前HTIVIL5的發展趨勢看，我們實際上可以不寫這節內容，但是考慮到一些從沒有接觸過 Web設計和制作的人可能會拿落后的瀏覽器去做相關的案例，我們依然準備了瀏覽器能力檢測④ 代碼。在其他的范例程序中，我們也會提供類似的能力檢測代碼。 Modemizr是為HTML5而生的開源JavaScript庫，它能檢測瀏覽器是否支持HTML5和CSS3的 每個新特性。在使用它的API前，你必須先下載并在頁面里引用modernizr.js文件，它的網站是 ①DOM（Document Object Model．文檔對象模型）．它可以以一種獨立于平臺和語言的方式訪問和修改一個文檔的 內容和結構。換句話說，這是表示和處理一個HTML或XML文檔的常用方法。有一點很重要．DOM的設計是以 對象管理組織( OMG)的規約為基礎的，因此可以用于任何編程語言。最初人們把它認為是一種讓JavaScript在 瀏覺器間可移植的方法，不過DOM的應用已經遠遠超出這個范圍。DOM技術使得用戶頁面可以動態變化，如可 以動態地顯示或隱藏一個元素，改變它們的屬性，增加一個元素等。DOM技術使得頁面的交互性大大增強。 ⑦瀏覽器能力檢測是近年來流行起來的一種說法，正被廣大開發者普遍接受。具體是指：由于不同的謝覽器會有不 同的表現，有些落后的瀏覽器可能會不支持較新的HTML5 API，因此需要對瀏覽器的能力進行檢測，以防萬一。 與瀏覽器能力檢測相配套的技術方案是：優雅降級。在瀏覽器能力不足的時候，需要有備選的可靠方案，向用戶傳遞正確的、最低技術環境限度下的展示。