1

suppose i want to use javascript to add the following css

p:before{content:"Q: "}

how can that be done? I tried the following but they don't work.

myEle.style.:before='content: "Q: "';
myEle.style.content="Q: ";

in general, how do change the value of css pseudo-selectors? such as a:visited, a:link.

Xah Lee
  • 16,755
  • 9
  • 37
  • 43

2 Answers2

-1

The Pseudo-Selectors can't be changed directly and they are not intended to be changed.

If you want to add content before every element of certain kind, you will have to find all of these elements with javascript and insert this content using the dom functions. This requires a lot code, but there are a lot of helping frameworks like jQuery.

With JQuery you can do that by:

$('p').before('Q: ');
Baju
  • 2,616
  • 1
  • 19
  • 29
  • thanks Baju & Thomas. How about this... say when some event happened, i want my js to basically do this css: a:link{text-decoration:none}. Cannot be done? ... can anyone give some reference or blog pointer on this issue? thanks. – Xah Lee Oct 28 '10 at 20:27
  • This is a thing you should do with css since that has a far better performance and functionality. If you really want it: $('a').hover(function(){ $(this).css('text-decoration','underline'); },function(){ $(this).css('text-decoration','none'); }) – Baju Oct 28 '10 at 20:30
-2

I'm not sure why you'd have a need to set an a:visited with javascript, but jQuery will do you worlds of good for easily selecting pretty much anything you need:

http://api.jquery.com/category/selectors/

theflowersoftime
  • 2,546
  • 3
  • 24
  • 32