HTML5中没有关于链接的API，所以我们只有自己来实现了。

首先，我们来想一下，链接有什么特点。第一个想到的估计就是它能跳转，这是链接最显著的特点，当然这也是废话，要不怎么能叫链接？第二个想到的可能就是文字下方的下划线；第三可能就是当鼠标盘旋在它上空时，鼠标要变成一只手。这些都不难实现，因为跳转可以用window.open()来实现，下划线用html5 canvas API就能实现，更改鼠标的样式用css改就OK。接下来就来讲一下如何实现这些。

本次开发依然用到了开源引擎lufylegend，引擎的一些信息如下：

引擎官方网站：

http://lufylegend.com/lufylegend

引擎API文档：

http://lufylegend.com/lufylegend/api

?

一，LLink类

?

首先我们来创建一个LLink类。代码如下:

?

function LLink(url,text,type,color,font,size){
	var self = this;
	base(self,LSprite,[]);
	
	self.type = "LLink";
	self.url = url;
	self.openType = type || "blank";
	
	self.x = 0;
	self.y = 0;
}

这只是一个很基本的类，有6个参数，分别是打开【链接的地址】，【显示文字】，【链接打开的类型】，【链接颜色】，【链接字体】，【链接尺寸】。由于这个类是继承自LSprite，所以它享有LSprite的一切属性和函数，比如x，y，addChild()等。（注：在lufylegend中base()函数可用于继承，用法可参照API文档。LSprite的用法亦可以参照API文档上的说明）

?

接着我们更改它的type属性，以便和其他类进行区分。然后用url属性保存链接，用openType保存链接打开的类型。如果链接类型没有设置，就默认为"blank"，表示在新的标签页打开。至于xxx || yyy的用法以前也讲过，意思是如果xxx的值为null之类的，就将值设置为yyy。

由于是继承自LSprite，所以不能直接显示文字。因此要加入一个属性text，这个属性是一个LTextField（用法见API文档）对象，用于显示文字，具体代码如下：

?

self.text.color = color || "blue";
self.text.font = font || "urf-8";
self.text.size = size || 12;
self.text.x = 0;
self.text.y = 0;
self.text.text = text || url;
self.addChild(self.text);

从上面的代码可以看出，如果不设置链接的显示文字，显示文字就为网址。不设置颜色就自动设置为蓝色

为了方便加一个下划线，我们建立一个名为underLine的LSprite对象，然后通过LSprite实现画线，具体代码如下：

?

?

self.underLine = new LSprite();
self.underLine.graphics.drawRect(0,self.text.color,[0,0,self.text.getWidth(),Math.floor(self.text.size * 0.1)],true,self.text.color);
self.underLine.x = 0;
self.underLine.y = parseInt(self.text.getHeight()) + Math.floor(self.text.size * 0.3);
self.addChild(self.underLine);

由于LTextField类没有鼠标事件，所以我们没法判断链接文字是否被点击，为了实现点击事件，我特地问了lufy，lufy给我提了一个dirty way（虽说是一个dirty way，不过还真的好使 ^_^）：在文本上方画一个与文本大小一样的透明矩形，由于LSprite是可以加入事件的，而且矩形是可以响应事件的，所以就给自身加一个鼠标事件，如果点到文字上，相当于点到透明矩形上，然后就触发事件。于是我们加一个LSprite：

?

?

self.back = new LSprite();
self.back.graphics.drawRect(0,"trans