Wie kann ich jQuery verwenden, um alle Instanzen eines bestimmten Worts zu stylen / Teile /?

8

Ungewöhnliche Situation. Ich habe einen Kunden, nennen wir sie "BuyNow". Sie möchten, dass jede Instanz ihres Namens in der Kopie ihrer Website wie "Buy Now " stilisiert wird, wobei die zweite Hälfte ihres Namens fett gedruckt ist.

Ich würde es wirklich hassen, einen Tag damit zu verbringen, & lt; strong & gt; Tags für alle Kopien. Gibt es eine gute Möglichkeit, dies mit jQuery zu tun?

Ich habe das Highlight-Plugin für jQuery gesehen und es ist sehr nah dran, aber ich muss nur die zweite Hälfte dieses Wortes fett machen.

    
Ben Dyer 30.09.2009, 22:36
quelle

5 Antworten

12

Um dies zuverlässig zu tun, müssten Sie jedes Element im Dokument durchlaufen, um nach Textknoten zu suchen, und nach Text in diesen suchen. (Dies ist, was das Plugin in der Frage bemerkt.)

Hier ist ein einfaches JavaScript / DOM-Modul, das die Übereinstimmung eines RegExp-Musters ermöglicht. jQuery gibt Ihnen hier nicht wirklich viel Hilfe, da Selektoren nur Elemente auswählen können und der ': contains' Selektor rekursiv ist, also nicht zu nützlich für uns.

%Vor%     
bobince 30.09.2009, 23:36
quelle
4

Reguläre Ausdrücke und replace() fallen mir ein. Etwas wie

%Vor%

Vorsicht bei der Verwendung von html() , um dies zu tun. Erstens besteht die Möglichkeit, übereinstimmende Zeichenfolgen in href -Attributen von <a> -Elementen und anderen Attributen zu ersetzen, die dazu führen können, dass die Seite dann falsch funktioniert. Es könnte möglich sein, einen besseren regulären Ausdruck zu schreiben, um einige der möglichen Probleme zu überwinden, aber die Leistung könnte leiden (Ich bin kein regulärer Ausdruck Guru). Zweitens führt die Verwendung von html() zum Ersetzen von Inhalt dazu, dass nicht serialisierbare Daten wie Ereignishandler, die an zu ersetzende Elementmarkierungen, Formulardaten usw. gebunden sind, verloren gehen. Das Schreiben einer Funktion, die nur Textknoten anvisiert, kann die bessere / sicherere Option sein, es hängt nur davon ab, wie komplex die Seiten sind.

Wenn Sie Zugriff auf die HMTL-Dateien haben, ist es wahrscheinlich besser, die Wörter zu suchen und zu ersetzen, deren Aussehen in den Dateien geändert werden soll, wenn der Inhalt statisch ist. NotePad ++ ist In Dateien suchen -Option in den meisten Fällen für diesen Job performant.

Der Vorschlag von SingleShot und die Verwendung von <span> mit einer CSS-Klasse bieten mehr Flexibilität als die Verwendung eines Elements <strong> .

    
Russ Cam 30.09.2009 22:39
quelle
1

Ich habe ein kleines Plugin geschrieben, um genau das zu tun. Schauen Sie sich meine Antwort zu einer ähnlichen Frage an.

>

Anstatt das Plugin herunterzuladen, das in der angenommenen Antwort vorgeschlagen wird, empfehle ich dringend, dass Sie das Plugin verwenden, das ich geschrieben habe - es ist viel schneller.

    
roosteronacid 30.09.2009 23:10
quelle
0
%Vor%     
kennebec 01.10.2009 00:05
quelle
0

Dies ist kein jQuery-Skript, sondern reines javaScript, ich glaube, es kann etwas geändert werden. Link .

    
Samuel 22.02.2011 07:53
quelle

Tags und Links