在jQuery的html（val）语句中访问当前选定元素的内容？

Question

我有几个链接其文本内容我想用基于文本内容的自动生成的图像替换。

所以目前看起来是这样的：

<a href="blabla" class="mLink"> 
<span class="mText">The Text in Question</span> 
</a> 

，我想有两种

<a href="blabla" class="mLink"> 
<img src="/ImageTextHandler.ashx?message=The+Text+in+Question" alt="The Text in Question"/> 
</a> 

或

<a href="blabla" class="mLink"> 
<span class="mText"> 
    <img src="/ImageTextHandler.ashx?message=The+Text+in+Question" alt="The Text in Question"/> 
</span> 
</a> 

如何访问元素在问题里面.replaceWith或.html，以便我可以获取文本内容？

Answer 1

试试这个

$(".mLink").each(function (i) { 

    var thisText = $(this).find(".mText").text(); 
    $(this).html("<img src='/ImageTextHandler.ashx? 
     message=" + thisText + "' alt='" + thisText + "'/>"); 

}); 

Answer 2

使用本地化的选择

$(".mLink").each(function() { 
    var text = $("span", this).text(); 
    $("span", this).replaceWith("<img src='/ImageTextHandler.ashx?message="+ 
            text+"' alt='"+text+"' />"); 
}); 

Answer 3

$(function() {  
    var mySpan = $('a.mLink span.mText'); 
    var text = mySpan.text(); 
    var link = text.split(' ').join('+'); 

    mySpan.replaceWith($("<img src='/ImageTextHandler.ashx?message=" + link + "' alt='" + text + "'/>")); 
}); 

Working Demo here

代码从演示

$(function() { 

    $('#button').click(function() { 

     $('a.mLink span.mText').each(function() {  
     var text = $(this).text(); 
     var link = text.split(' ').join('+'); 
     $(this).replaceWith($("<img src='/ImageTextHandler.ashx?message=" + link + "' alt='" + text + "'/>")); 
     }); 

    }); 
}); 

Answer 4

尝试这样的事情......

$(".mText").each(function(){ 
    var url = "/ImageTextHandler.ashx?message=" + escape($(this).text()); 
    var image = $("<img>"); 
    image.attr("src") = url; 
    image.attr("alt") = $(this).text(); 
    $(this).text(""); 
    $(this).append(image); 
});