8.1.2　确定链接的目标

在选择了一个或多个链接之后，我们可能会对它们链接到哪里感兴趣。例如，在7.4节构建的一个幻灯片中，每个链接都指向一个较大的图像。通过获取路径，我们可以使用JavaScript来显示较大的图像。换句话说，我们提取了链接的href值并且使用该路径在页面上创建一个新的＜img＞标签。同样，可以获取链接到另一个Web页面的href值，并且可以真正地在当前页面上显示新的Web页面，而不是当单击链接的时候去往该页面（具体步骤参见8.4节）。

在每种情况中，我们都需要访问href属性，这是使用jQuery的attr（）函数的一个轻松过程（参见4.9节）。例如，假设对回到站点主页的链接应用了一个ID。可以像下面这样获取该链接的路径：

var homePath=$（'#homeLink'）.attr（'href'）；

我们会在很多示例中使用这个信息。例如，假设想要紧挨着链接文本本身添加指向站点外的一个链接的完整的URL。换句话说，假设有一个带有文本“Learn more about bark beetles”的链接，而这个链接指向http：//www.barkbeetles.org/。现在，假设想要把页面上的文本改为“Learn more about bark beetles（www.barkbeetles.org）”（那么当人们打印该页面的时候，将知道该链接指向何处）。

使用如下的JavaScript代码，可以很容易地做到这点：

1$（'a[href^="http：//"]'）.each（function（）{

2 var href=$（this）.attr（'href'）；

3 href=href.replace（'http：//’，’'）；

4$（this）.after（'（'+href+'）'）；

5}）；

注意：左边的行号不是代码的一部分，因此，不要录入它们。它们只是为了方便我们一行行地查看代码。

第1行选择了所有的外部链接（参见4.9节），然后运行each（）函数（参见4.10节），它只是遍历每个链接并对其应用一个函数（也就是说，它遍历了链接的列表）。在这个例子中，第2行到第4行组成了函数的正文。第2行获取了该链接的href（例如，http：//www.barkbeetles.org）。第3行是可选的，它只是通过删除http：//简化了URL以便于显示，因此，href变量现在保存了像www.barkbeetles.org这样的一些内容（关于JavaScript的replace（）函数参见14.2.6节）。最后，第4行在链接的后面添加了herf的内容（括号包围的部分）：（www.barkbeetles.org），第5行结束了函数。

我们甚至可以更进一步地使用这些基本过程，用来在页面的底部创建一个参考文献，列文章中提到的所有的链接。我们在页面底部的一个单独的div中列出每个Web地址，而不是在每个链接的后面添加一个Web地址。