Umgeben Sie einige angegebene Wörter mit span in jQuery?

Question

Ich würde gerne wissen, die bequemste Möglichkeit, bestimmte Wörter mit Span-Tags zu umhüllen.

Beispiel: Ich habe ein Wort, das ist Hund. Hier ist der Originaltext:

I have a dog, do you have a dog? 

Und Ausgabe wie folgt sein sollte:

I have a <span class="highlight">dog</span>, do you have a <span class="highlight">dog</span>? 

Jede Hilfe?

BEARBEITEN: Beachten Sie, dass es auch Wörter einpacken soll, auch wenn sie nicht individuell sind (Peter-Hund). Ich hoffe du hast es verstanden.

Answer 1

Hier ist eine nützliche jQuery plugin.

Es ist wirklich einfach zu bedienen und es funktioniert super.

bearbeiten — das ist eine sehr alte antwort von mir. Ich bedaure, dass ich einfach die Lettering.js-Bibliothek verlinkt habe, ohne ihren Namen anzugeben. Die Bibliothek ist nützlich, obwohl ich hier 7 Jahre später nicht sicher bin, ob Herr Rupert es weiterhin aktiv pflegt.

Die Beschriftung erfolgt durch die Textknoten in einer ausgewählten Region des DOM und umschließt die einzelnen Buchstaben und/oder Wörter (konfigurierbar) in <span> Tags, die dann formatiert werden können. Es ist einfach, aber effektiv. Selbst wenn Sie es nicht verwenden möchten, ist der Code nicht sehr umfangreich und es ist lehrreich.

Answer 2

Sie können die JavaScript replace function verwenden. Hier ist ein einfaches Beispiel:

$('#container').html($('#container').html().replace(/(dog)/g,'<span class="highlight">$1</span>'));