第06章 链接

第6章链接1第6章链接第6章链接2链接(又称超级链接或超链接)是Web应用系统的一个主要特征，每个网站都有很多网页组成，链接可以使站点内的网页成为有机的整体，还能够的在不同站点之间建立联系。本章主要介绍怎样在Dreamweaver中对文字、图像等对象创建链接，以及如何对链接进行管理和设置。第6章链接36.1.1链接的基本概念链接是在页面之间进行切换和指导用户进入一些未知页面的主要手段，它由两部分组成：链接载体(源端点)和链接目标(目标端点)。许多页面元素可以作为链接载体，如：文本、图像、图像热区、轮替图像、动画等。而链接目标可以是任意网络资源，如：页面、图像、声音、程序、其他网站、Email甚至是页面中的某个位置——锚点。当浏览者单击已经设置链接的链接载体后，链接目标将显示在浏览器上或根据目标的类型来打开或运行。第6章链接46.1.2超文本链接标记在HTML语言中，超文本链接标记通过锚标记a和/a来实现。此标记需成对出现，以a属性定义开始，/a结束。常用的属性有：–href：定义链接目标。–title：定义当鼠标移动到链接上时出现的提示文字。–target：设定链接目标显示的窗口，如target=_bank表示在新窗口中打开目标。例如：ahref==_bank搜狐主页/a这段代码表示当单击“搜狐主页”这几个文字时，将在新的浏览器窗口中打开“”网站主页。第6章链接56.1.3链接目标的位置和路径1．绝对路径绝对路径提供了所链接网页的完整URL，而且包括所使用的协议(对于Web页，通常使用http://)。例如：第6章链接66.1.3链接目标的位置和路径1．相对路径相对路径的基本思想是省略掉对于当前网页和所链接的网页都相同的绝对URL部分，而只提供不同的路径部分。对于大多数Web站点的本地链接来说，相对路径是最适合使用的路径。相对路径又可分为“文档相对路径”和“根目录相对路径”两种。第6章链接76.1.3链接目标的位置和路径1．相对路径(1)文档相对路径在当前网页与所链接的网页处于同一文件夹内，而且可能一直保持这种状态的情况下，文档相对路径特别有用。文档相对路径也可用来链接到其它文件夹中的文档，方法是利用文件夹层次结构，指定从当前网页到所链接网页的路径。文档相对路径有以下三种形式：①链接目标与当前网页在同一文件夹中时，只需提供被链接网页的文件名即可。②链接目标位于当前网页所在文件夹的子文件夹中时，需要提供子文件夹名和文件名，中间用正斜杠(/)分隔。如：“dreamweaver/main.html”。③链接目标位于当前网页所在文件夹的父文件夹中时，要在文件名前加上“../”(“..”表示上级文件夹)。第6章链接86.1.3链接目标的位置和路径1．相对路径(2)根目录相对路径根目录相对路径提供从站点的根目录到文档的路径。站点根目录相对路径以一个正斜杠开始，该正斜杠表示站点根文件夹。例如：/support/tips.html第6章链接96.2创建链接6.2.1在文档窗口创建链接–_blank：在新的浏览器窗口打开链接文档。–_parent：在该链接所在框架(框架的概念参见第七章)的父框架或父窗口中打开链接文档。如果包含链接的框架不是嵌套框架，则在整个浏览器窗口中打开所链接的文档。–_self：在和链接所在的同一框架或窗口中打开链接文档，此选项为是默认选项。–_top：用整个浏览器窗口打开链接文档。第6章链接106.2.2使用指向文件图标第6章链接116.2.3命名锚记有时候一个网页内容很多、很长，浏览者靠拖动滚动条寻找感兴趣内容很不方便，这时可以根据网页的内容，将其分为若干个主题，每个主题设置一个“命名锚记”，创建到这些命名锚记的链接，可以使用户快捷定位到自己感兴趣的主题上。创建到命名锚记的链接首先需要创建命名锚记，然后再创建到该命名锚记的链接。第6章链接126.2.4插入文本链接第6章链接136.2.5链接到电子邮件第6章链接146.2.6图像地图图像地图指已被分为多个热点的图像，每个热点均可定义相应的链接，点击图像地图的不同热点可以链接到不同的文档或执行相应操作。1．创建图像地图2．修改图像地图第6章链接156.2.7脚本链接脚本链接通过执行JavaScript代码或调用JavaScript函数，能够在不离开当前网页的情况下为访问者提供有关某项的附加信息。脚本链接还可用于在访问者单击特定项时，执行计算、表单验证和其它处理任务。例如，在【链接】文本框中键入“javascript:alert(‘该链接指向主文件’)”可生成这样一个链接：单击该链接时，会显示一个含有“该链接指向主文件”消息的JavaScript警告框。第6章链接166.3链接的管理一个网站往往包含大量的文档，文档之间可能存在着复杂的链接关系，当移动或重命名某个文档时，会造成其它文档中以此文档为链接目标的链接失效，这种失效的链接称为断链接。为避免站点中出现断链接，可以使用Dreamweaver的链接管理功能，在移动或重命名文档后自动更新相关链接。Dreamweaver的链接管理同时提供了使用站点地图的方式来修改链接，Dreamweaver还提供了通过一次手动更改将所有链接更新指向其它位置的功能。第6章链接176.3.1启动链接管理启用链接管理后，由于Dreamweaver会自动更新链接，当整个站点(或其中完全独立的一个部分)存储在本地硬盘上时，使用此功能可保证不会出现断链接现象。注意：Dreamweaver只更改本地站点文件，不更改远端站点文件。第6章链接186.3.2设置站点缓存为了加快链接的更新操作，可以使用站点缓存。站点缓存是由Dreamweaver创建的缓存文件，用以存储有关本地文件夹中所有链接的信息。在添加、更改或删除指向本地站点上的文件的链接时，该缓存文件可以加快更新操作。第6章链接196.3.3链接的维护1．一次性更改多个链接2．通过地图视图维护链接第6章链接206.3.4测试链接设计一个站点时，链接数量一般非常多，在上传到服务器之前，应先测试站点内所有的链接。链接测试可分为三个方面。首先，测试所有链接是否按预定的那样确实链接到了应链接的页面；其次，测试所链接的页面是否存在；最后，保证Web应用系统上没有孤立的页面，所谓孤立页面是指没有链接指向该页面，只有知道正确的URL地址才能访问的页面。第6章链接216.4一个链接实例本节以一个实例来介绍各种链接的创建和图像地图的应用。第6章链接22本章小结链接是网页之间以及网页和其它文件之间联系的纽带。本章介绍了链接的概念、链接的创建与管理，并以一个实例演示了网页中链接的应用。通过本章的学习，读者应熟练掌握在网页中创建文本、图像、邮件链接的方法，掌握创建图像地图的方法，理解如何使用Dreamweaver提供的链接管理功能管理网站的链接。