Добавить mailto: с помощью jQuery?

Question

<table id="here" border="1">
    <tr><td>London</td><td>london@us.uk</td><td>aaa</td><td>aaa</td></tr>
    <tr><td>Manchester</td><td>manchester@us.uk</td><td>aaa</td><td>aaa</td></tr>
    <tr><td>Liverpool</td><td>liverpool@us.uk</td><td>aaa</td><td>aaa</td></tr>
    <tr><td>Ipswich</td><td>ipswich@us.uk</td><td>aaa</td><td>aaa</td></tr>
</table>

Можно ли добавить ссылку mailto: для вторых столбцов с адресами электронной почты с помощью jQuery (не изменять HTML)? Если да, то как?

http://jsfiddle.net/zwsMD/1/

Answer 1

Вы можете просто заменить содержимое каждой секунды td элементом a на mailto: href: http://jsfiddle.net/zwsMD/5/.

​$("#here td:nth-child(2)").each(function() {
    var email = $(this).text();

    // replace contents
    $(this).html(
        $("<a>").attr("href", "mailto:" + email).text(email)
    );
});​​​​​​​​​​​​​​​​​​​​

Answer 2

Вам нужно будет обойти все строки, найти нужную ячейку и обернуть ссылку вокруг содержимого.Для этого можно использовать wrapInner.

$("#here tr").each(function() {
    var td = $(this).children().eq(1);
    var email = "mailto:" + td.text();
    td.wrapInner($("<a>").prop("href", email));
});​

Живой пример

Answer 3

Предполагая, что это всегда вторая td каждой строки, вы можете перебрать эти элементы и wrap contents в элементе a:

$("#here td:nth-child(2)").each(function() {
    $(this).contents().wrap("<a href='mailto:" + $(this).text() + "'>");
});​

Вот рабочий пример .

Answer 4

Вы можете сделать что-то вроде этого

​$('td:nth-child(2)').each(function(){
   var text = $(this).text();
    var href = "mailto:"+text;
    var $a = $('<a>', { href: href, text: text});
    $(this).text('').append($a);
});​​​​​​​​​​​​​​​​​​​​

скрипку здесь http://jsfiddle.net/zwsMD/6/