Fatal编程技术网

Javascript 在链接后插入图像

javascript

Javascript 在链接后插入图像,javascript,Javascript,我有一个很大的表，其中一列包含电子邮件地址（+/-60），我被告知在每个地址后添加一个电子邮件图标。我一直试图使用锚定、.href和.indexof来选择电子邮件链接，但没有找到任何位置（因此没有代码） 如果链接的href包含mailto使用普通JavaScript，无jQuery，我可以获得有关如何添加的帮助吗。HTML javascript var table=document.getElementById（“表”）， links=table.getElementsByTagName（“

我有一个很大的表，其中一列包含电子邮件地址（+/-60），我被告知在每个地址后添加一个电子邮件图标。我一直试图使用
锚定
、
.href
和
.indexof
来选择电子邮件链接，但没有找到任何位置（因此没有代码）

如果链接的
href
包含
mailto
使用普通JavaScript，无jQuery，我可以获得有关如何添加
的帮助吗。

HTML
javascript 
var table=document.getElementById（“表”），
links=table.getElementsByTagName（“a”），
linksLength=links.length，
i=0，
链接
href，
文本；
对于（；i>linksLength；i++）{
链接=链接[i]；
href=link.href，
text=link.childNodes[0].nodeValue；
if（href.indexOf（“mailto:”）{
link.childNodes[0].nodeValue+=text+“”；
}
}
请参阅HTML
javascript 
var table=document.getElementById（“表”），
links=table.getElementsByTagName（“a”），
linksLength=links.length，
i=0，
链接
href，
文本；
对于（；i>linksLength；i++）{
链接=链接[i]；
href=link.href，
text=link.childNodes[0].nodeValue；
if（href.indexOf（“mailto:”）{
link.childNodes[0].nodeValue+=text+“”；
}
}
请参见这里有一个您可以使用的函数：

(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')));

（函数（所有链接）
{
变量i，imgHTML=''；
对于（i=0；i-1）
{//或allLinks.item（i）.getAttribute（'href'）.indexOf（'mailto'））
//在大多数浏览器上，调用item方法据说更快
allLinks[i].innerHTML+=imgHTML；
}
}
}（document.getElementsByTagName（'a'））；
当然，您可以将此iLife转换为常规函数，在加载事件或其他情况下调用…
Forked@adardesign's fiddle，

您可以使用以下函数：

(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')));

（函数（所有链接）
{
变量i，imgHTML=''；
对于（i=0；i-1）
{//或allLinks.item（i）.getAttribute（'href'）.indexOf（'mailto'））
//在大多数浏览器上，调用item方法据说更快
allLinks[i].innerHTML+=imgHTML；
}
}
}（document.getElementsByTagName（'a'））；
当然，您可以将此iLife转换为常规函数，在加载事件或其他情况下调用…
Forked@adardesign's fiddle，

您可以使用CSS解决此问题

CSS
请参见您可以使用CSS来解决此问题

CSS
看到图像应该在第二列了吗？@adardesign no.该列当前为
Name
，我需要将其设置为
Name
FYI，
archors
集合包含所有锚元素，即
a
元素，具有
Name
或/和
id
属性，但不包含
href
。如果要使用
href
获取
a
s，可以使用
链接
集合。@RyanB，不必通过javascript完成。。查看CSS解决方案图像应位于第二列？@adardesign no。该列当前为
Name
，我需要将其设置为
Name
FYI，
anchors
集合包含所有锚元素，即
a
元素，具有
Name
或
id
属性，但不包含
href
。如果要使用
href
获取
a
s，可以使用
链接
集合。@RyanB，不必通过javascript完成。。看到CSS解决方案了吗？我会尝试几次，但后面的分号是（在for-a-typo循环中？我正在缓存变量以避免污染全局空间@adardesign？？你的小提琴上到处都是全局变量…我使用的是iLife，因此没有创建任何全局变量。此外，这里不需要三个以上的变量。最后：你的代码有缺陷：
if（href.indexOf（'mailto:'））如果href值以
mailto
=>索引0开头，则
将为false。如果没有
mailto
，则
indexOf
返回-1，这是一个真实值value@EliasVanOotegem，你完全正确，我忘了用IIFEI包装，我过几天再试试，但后面的分号是不是（在for-a-typo循环中？我正在缓存变量以避免污染全局空间@adardesign？？你的小提琴上到处都是全局变量…我使用的是iLife，因此没有创建任何全局变量。此外，这里不需要三个以上的变量。最后：你的代码有缺陷：
if（href.indexOf（'mailto:'））如果href值以
mailto
=>索引0开头，则
将为false。如果没有
mailto
，则
indexOf
返回-1，这是一个真实值value@EliasVanOotegem，你完全正确，我忘了在开场白时用IIFEI包装（
需要吗？我看不出你在哪里关闭它。@RyanB：最后一个括号将其关闭。开头的
（
可以替换为按位的NOT:
~
或bang
！
。这将函数定义转换为表达式。谷歌更多关于iLife的信息（立即调用的函数表达式），他们很有趣！顺便说一句，我很抱歉，但是被接受的答案中有一个错误，请检查我在那里的最后评论。看到它，你添加了（）取消了）退出，但我看到你调整了它。JSFIDLE今天对我不起作用。@RyanB:对我来说也很慢，但它起作用了。我提供的小提琴显示了链接，还有一个img not found图标，所以代码本身就起作用了。顺便说一句，请确保在加载链接之前没有运行此代码（将其用作
窗口。onload
处理程序，或将此代码移到身体底部，您就没事了）是否需要打开
（
我看不出您在哪里关闭它。@RyanB:最后一个括号将其关闭

(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')));



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