划时代的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，因此需要对浏览器的能力进行检测，以防万一。 与浏览器能力检测相配套的技术方案是：优雅降级。在浏览器能力不足的时候，需要有备选的可靠方案，向用户传递正确的、最低技术环境限度下的展示。