0

I want to detect and style a special letter . for example something like this :

body["p"] / body["2"]

how can I do this? thanks

user1599537
  • 1,269
  • 3
  • 10
  • 10

2 Answers2

2

You could do this on a node-by-node basis with a fairly simple replace, but it wouldn't scale very well.

Given the markup:

<p>Peter Rabbit ate all of Potter's pickling cukes.</p>

If you wanted to add a style to all of the letters p in this text, you could select the paragraph node and add spans around any p (assuming a single paragraph):

var graf = document.getElementsByTagName('p')[0];
graf.innerHTML = graf.innerText.replace(/(p)/gi,'<span class="fancy">$1</span>');

That said, this would only work on plain text nodes; if you had, for example, a span tag already in the p tag, it'd get mucked up by the replace.

Evan Davis
  • 35,493
  • 6
  • 50
  • 57
1

You cannot with CSS. The only non-element (css-created) pseudo-elements are ::first-line and ::first-letter.

However, you could search with JS through the DOM and create tags around the letters to be highlighted. Check highlight words in html using regex & javascript - almost there for how to do that.

Community
  • 1
  • 1
Bergi
  • 630,263
  • 148
  • 957
  • 1,375
  • thanks, what is the problem with this tiny code? ' var a=getElementById("b") if a!=NaN {style.color="blue"}' – user1599537 Feb 09 '13 at 15:54
  • @user1599537 the problem with that code is that it 1) doesn't work and 2) is riddled with errors. – Evan Davis Feb 09 '13 at 15:56
  • @user1599537: What is it supposed to do? Your current snippet looks up an element with the id "b", compares it against `NaN` (which it oviously is not equal to) and then sets a property on a variable named `style`. – Bergi Feb 09 '13 at 16:07