jquery: Ersetzen Sie Element a mit span

Question

für Informationen: Es ist ein mobiles (Off-Canvas) Menü und es ist nicht in der Seitenquelle sichtbar. es ist nur mit "Code-Inspektor" in der mobilen Ansicht sichtbar usw. the page i'm talking about

mein Code:

$('.mm-listview li:(:nth-child(2)) .mm-next+a').replace('span');​ 

mein html:

<ul class="mm-listview"> 
<li><a class="mm-next" href="#mm-2" data-target="#mm-2"></a> 
<a href="http://piirissaareturism.ee/avasta-piirissaar/">Avasta Piirissaar</a> 
</li> 
<li><a class="mm-next" href="#mm-3" data-target="#mm-3"></a> 
<a href="http://piirissaareturism.ee/kasulik-info/">Kasulik info</a> 
</li> 

es zur Zeit nicht ersetzen . Ich weiß, es sollte etwas einfach sein ...

Answer 1

Verwenden replaceWith() mit Rückruf dann erzeugen Spanne mit dem Inhalt und zu aktualisieren. Auch Ihr Selektor ist ungültig, also ändern Sie li:(:nth-child(2)) zu li:nth-child(2), um es gültig zu machen.

$('.mm-listview li:nth-child(2) .mm-next+a').replaceWith(function() { 
 
    return '<span>' + $(this).text() + '</span>' 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
my html: 
 

 
<ul class="mm-listview"> 
 
    <li> 
 
    <a class="mm-next" href="#mm-2" data-target="#mm-2"></a> 
 
    <a href="http://piirissaareturism.ee/avasta-piirissaar/">Avasta Piirissaar</a> 
 
    </li> 
 
    <li> 
 
    <a class="mm-next" href="#mm-3" data-target="#mm-3"></a> 
 
    <a href="http://piirissaareturism.ee/kasulik-info/">Kasulik info</a> 
 
    </li> 
 
</ul>

---

Oder können Sie unwrap() und wrap() Methoden.

$('.mm-listview li:nth-child(2) .mm-next+a').contents().unwrap().wrap('<span/>');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
my html: 
 

 
<ul class="mm-listview"> 
 
    <li> 
 
    <a class="mm-next" href="#mm-2" data-target="#mm-2"></a> 
 
    <a href="http://piirissaareturism.ee/avasta-piirissaar/">Avasta Piirissaar</a> 
 
    </li> 
 
    <li> 
 
    <a class="mm-next" href="#mm-3" data-target="#mm-3"></a> 
 
    <a href="http://piirissaareturism.ee/kasulik-info/">Kasulik info</a> 
 
    </li> 
 
</ul>

---

Wenn Sie nicht wollen, das Element Inhalt dann replaceWith() mit dem neuen Inhalt verwenden zu halten.

$('.mm-listview li:nth-child(2) .mm-next+a').replaceWith('<span/>');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
my html: 
 

 
<ul class="mm-listview"> 
 
    <li> 
 
    <a class="mm-next" href="#mm-2" data-target="#mm-2"></a> 
 
    <a href="http://piirissaareturism.ee/avasta-piirissaar/">Avasta Piirissaar</a> 
 
    </li> 
 
    <li> 
 
    <a class="mm-next" href="#mm-3" data-target="#mm-3"></a> 
 
    <a href="http://piirissaareturism.ee/kasulik-info/">Kasulik info</a> 
 
    </li> 
 
</ul>

---

UPDATE: Es gibt ein zusätzliches Zeichen, nachdem der Code nur it.Check Konsole entfernen können Sie den Fehler sehen.

Uncaught SyntaxError: Invalid or unexpected token

Sie können es in der unteren Abbildung am Ende als rote Markierung sehen.

Answer 2

Diese den Trick tun soll:

$('.mm-listview li:nth-child(2) .mm-next+a').replaceWith('<span></span>');​ 

Answer 3

DEMO LINK

HTML-Code

<ul class="mm-listview"> 
<li><a class="mm-next" href="#mm-2" data-target="#mm-2">1</a> 
<a href="http://piirissaareturism.ee/avasta-piirissaar/">Avasta Piirissaar</a> 
</li> 
<li> 
<a class="mm-next" href="#mm-3" data-target="#mm-3">2</a> 
<a href="http://piirissaareturism.ee/kasulik-info/">Kasulik info</a> 
</li> 

js Code

$('.mm-listview li:nth-child(2) mm-next+a').replaceWith($('<span />').text('123')); 

• Verwendung replaceWith
• Verwendung gültigen Selektor li:nth-child(2)