将图标包含在可点击文本的目标区域中的最佳方法是什么？

Question

我目前正在使用以下javascript来创建扩展菜单：

http://demo.raibledesigns.com/struts-menu/scripts/menuExpandable.js.src

目前，只有超链接文本可以点击。让文本旁边的图标响应点击的最佳方法是什么？

Answer 1

图标应为：

• 锚标记中的内联元素
• 锚标记的背景图片

你可以在CSS和/或标记中完成所有这些工作，保持javascript的简洁。

第三种方法是将icon元素绑定到超链接的事件处理程序方法，但最终结果不太理想，并且需要最多的工作。

Answer 2

HTML

<a id="icon" href="blah">blah</a>

CSS

#icon {
    background: transparent url(img.gif) no-repeat right center;
    padding-right: 10px;
}