Einzelne Zeichen Farbe zuweisen in HTML-Dokument

[Gast] Foren Programmierung/Entwicklung JavaScript Einzelne Zeichen Farbe zuweisen in HTML-Dokument

Programmierung/Entwicklung

Themen

Beiträge

Moderatoren

Letzter Beitrag

JavaScript

1411

5354

Thomas Richard

28. Feb 2024, 15:17

Nic1703

uswd

Beiträge gesamt: 317

19. Dez 2018, 17:26
Beitrag # 1 von 3
Bewertung:
(3467 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

Hallo,

ich habe ein HTML-Dokument, welches mehrere Absätze enthält, in denen bestimmte Zeichen eine andere Farbe zugewiesen werden sollen. Da dies relativ viele sind, würde ich gern vermeiden, diese von Hand in ein

Code

<span class="gf"></span>

Paar zu packen. CSS ist passend definiert.

Ich habe es im Head damit versucht:

Code

window.onload = function() { 
    obj = document.getElementsById('dia').getElementsByTagName('p'); 
    obj.innerHTML = obj.innerHTML.replace(/[\+ztsvwm]/g,'<span  
    class="gf">$1</span>'); 
}

HTML könnte z. B. so aussehen:

Code

<body> 
<div> 
  <p id="dia"> XIIIIIIIIY<br> 
    9rsnlwq-trk+0<br> 
    9zpp+-zppvlp0<br> 
    9-+-zp-snp+0<br> 
    9+-zp-+-+-0<br> 
    9-+PzPP+-+0<br> 
    9+-sN-vLP+-0<br> 
    9PzP-+-+PzP0<br> 
    9tR-+QmKLsNR0<br> 
    xiiiiiiiiy </p> 
</div> 
</body>

Alle Zeichen der Menge [\+ztsvwm] sollen eingefärbt werden. Das klappt aber mit meinem Anfänger-Code leider nicht.

Kann mir jemand auf die Sprünge helfen?

Danke im Voraus.

Ulrich

Einzelne Zeichen Farbe zuweisen in HTML-Dokument

olaflist

Beiträge gesamt: 1400

19. Dez 2018, 21:30
Beitrag # 2 von 3
Beitrag ID: #568132
Bewertung:
(3453 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

getElementsByTagName gibt Dir ein array zurück, oder? Ein array hat aber kein innerHTML. Mit

Code

obj = document.getElementsById('dia').getElementsByTagName('p')[0];

müsstest Du weiter kommen... (in der Annahme, es ist immer das erste und einzige <p>).

Olaf

als Antwort auf: [#568128]

Einzelne Zeichen Farbe zuweisen in HTML-Dokument

uswd

Beiträge gesamt: 317

20. Dez 2018, 08:35
Beitrag # 3 von 3
Beitrag ID: #568136
Bewertung:
(3435 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

Hab ich probiert, zeigt aber keine "Wirkung". Und es sollte alle Absätze des HTML-Dokuments erfassen, die die "id='dia'" besitzen.
Na ja, wenn ich's nicht hinbekomme, muss ich halt die "häßliche" Lösung mittels Suchen-und-Ersetzen nehmen. Die macht dann das HTML sehr unleserlich mit den vielen <span></span>-Konstrukten.
Danke jedenfalls für die Hilfe.

Ulrich

als Antwort auf: [#568132]

Aktuell

PDF / Print

drupa: callas software rückt pdfToolbox 15 in den Mittelpunkt seines Messeauftritts

| 06.05.2024

Veranstaltungskalender

Hier können Sie Ihre Anlässe eintragen, welche einen Zusammenhang mit den Angeboten von HilfDirSelbst.ch wie z.B. Adobe InDesign, Photoshop, Illustrator, PDF, Pitstop, Affinity, Marketing, SEO, Büro- und Rechtsthemen etc. haben. Die Einträge werden moderiert freigeschaltet. Dies wird werktags üblicherweise innert 24 Stunden erfolgen.

Hier eine kleine Anleitung hinsichtlich Bedeutung der auszufüllenden Formularfelder.

Veranstaltungen

18.06.2024

So optimieren Sie Ihren LFP-Workflow

Online
Dienstag, 18. Juni 2024, 10.00 - 10.30 Uhr

Webinar

In diesen beiden kostenlose Webinaren erfahren Sie, wie Sie mit Hilfe von Enfocus Griffin und dem Impressed Workflow Server Ihren LFP-Workflows optimieren können. 18.06.2024: So optimieren Sie Ihre Prozesse mit Enfocus Griffin 02.07.2024: So sparen Sie Zeit und Geld mit Impressed Workflow Server in der LFP-Edition Griffin: Griffin ist das leistungsstarke Kraftpaket fuÌˆr das automatische Nesting im Großformatdruck. Dank eines ausgekluÌˆgelten, KI-basierten Nesting-Algorithmus können Sie mit Griffin Vorlagen schnell und effizient vernutzen – und das klappt auch mit unregelmäßigen Formen perfekt. Das spart Ihnen unzählige Stunden, die Sie bisher mit dem manuellen Nesting und Ausschießen verbracht haben. Einige wichtige Funktionen ≡ Anlage von Beschnittzugaben ≡ Automatische Erzeugung der Schnittkontur ≡ Erstellung von Strichcodes, Textmarkierungen und Registrierungen IWS LFP Edition: Komplizierte, kleinteilige Aufträge; alles sehr speziell; seit Jahren bewährte Prozesse – da können wir nichts standardisieren und automatisieren! Das sagen viele Großformatdrucker – aber stimmt das wirklich, ist dem tatsächlich so? Mit dem IWS LFP Edition automatisieren Sie Ihre Produktion von der Übernahme der Daten aus dem ERP-System bis zur Erzeugung der verschachtelten Druckform und der Übergabe an den RIP. Phoenix Core ist eine hochentwickelte KI-Technologie fuÌˆr die Planung und das Nesting von Druckerzeugnissen. Anders als herkömmliche Ausschießlösungen arbeitet Phoenix nicht auf Basis von Vorlagen, sondern erzeugt entsprechend der Maschinen- und Produktionsanforderungen druckfertige Layouts „on-the-fly“.

kostenlos

Organisator: Impressed GmbH

https://www.impressed.de/schulung.php?c=sDetail&sid=328