ersetzt Bild in einem Link mit JQuery

Question

den folgenden Code unter Berücksichtigung

<a href="tutu"> 
    <img src="ver.gif" class="logo" id="header-logo" title="Coco"> 
</a> 

und Skript:

$('a[href$="tutu"]').each(function() { 
    $(this).text($(this).prop('title')); 
}) 

Ich versuche, das Bild mit dem Titel Text zu ersetzen, so zeigt es coco statt des Bildes.

Können Sie mir helfen?

Answer 1

Der Fehler ist, dass this hier
<a href="tutu"><img src="ver.gif" class="logo" id="header-logo" title="Coco"></a>

ist und sie ihr Kind keine Eigenschaft Titel, hat also etwas zu tun wie:

$('a[href$="tutu"]').each(function() { 
    $(this).text($(this).children().prop('title')); 
}); 

Hoffe das löst Ihr Problem.

Answer 2

Versuchen Sie den Code unten

JS mit:

$('a[href$="tutu"]').each(function() { 
    $(this).html($(this).prop('title')); 
}) 

Answer 3

Das img Element ist ein Kind des a Tag, so dass Sie Ihren gewünschten img finden zuerst unter einem Tag, dann das Bild Titel erhalten Attribut und den Inhalt von a Tag auf diesen Wert gesetzt:

$('a[href="tutu"]').each(function() { 
 
    var title=$(this).find('img').attr('title'); 
 
    $(this).html(title); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
 
<a href="tutu"> 
 
    <img src="ver.gif" class="logo" id="header-logo" title="Coco"> 
 
</a>

Answer 4

würde ich .replaceWith() verwenden:

$('a[href$="tutu"]').each(function() { 
 
    $(this).find('img').replaceWith($(this).find('img').prop('title')); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="tutu"> 
 
    <img src="ver.gif" class="logo" id="header-logo" title="Coco"> 
 
</a> 
 
<a href="tutu"> 
 
    <img src="ver.gif" class="logo" id="header-logo" title="Loco"> 
 
</a> 
 
<a href="tutu"> 
 
    <img src="ver.gif" class="logo" id="header-logo" title="Zoco"> 
 
</a>

hier