0

我有一个大表，其中一列包含电子邮件地址（+/- 60），有人告诉我在每个地址后添加一个电子邮件图标。我一直在尝试使用anchors,.href并.indexof选择电子邮件链接，但没有得到任何地方（因此没有代码）。

<img src="/a/path/email.jpg" alt="e-mail" />如果链接href包含mailto使用vanilla JavaScript而非 jQuery，我能否获得有关如何添加的帮助。

4

3 回答 3

2

这是您可以使用的功能：

(function(allLinks)
{
    var i, imgHTML = '<img src="mail.png" alt="mail" />';
    for (i = 0; i < allLinks.length; i++)
    {
        if (allLinks[i].getAttribute('href').indexOf('mailto') > -1)
        {//or allLinks.item(i).getAttribute('href').indexOf('mailto')
         //calling the item method is said to be faster, on most browsers
            allLinks[i].innerHTML += imgHTML;
        }
    }
}(document.getElementsByTagName('a')));

你当然可以把这个 IIFE 变成一个常规函数，在加载事件或其他东西上被调用......
分叉@adardesign 的小提琴，这里是

于 2013-02-04T15:25:26.250 回答
2

HTML

<table id="table">
    <tr>
        <td><a href="mailto:yankel@frieman.com">yankel@frieman.com</a></td>
    </tr>
</table>

javascript

var table = document.getElementById("table"),
    links = table.getElementsByTagName("a"),
    linksLength = links.length,
    i = 0,
    link,
    href,
    text;

   for(; i>linksLength; i++){
      link = links[i];
      href=link.href,
      text = link.childNodes[0].nodeValue;

      if(href.indexOf("mailto:")){
         link.childNodes[0].nodeValue += text+ "<img src='path/to/email.png'>";
      }
 }

见http://jsfiddle.net/adardesign/jJZCd/

于 2013-02-04T15:22:24.900 回答
0

你可以使用 CSS 来解决这个问题

CSS

a[href^="mailto:"]:after{
    content:url("path/to/email.png")
}

见http://jsfiddle.net/adardesign/QWsVM/

于 2013-02-04T15:35:33.927 回答