current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

see - > i have the following text in a variable

var s = 

    "<html>
  <head>
    <style type="text/css" >     
      body{
 background:url(/a.png);
          }
    </style>
    <script src="2.js"></script>
    <script src="1.js"></script>
  </head>
  <body >
   {BODYCONTENT}
  </body>


</html>";

Now i want to append some data immediately after closing of <style> tag's > .

Ex : 

var mydata = "/n h1{a:b}/n";

So i want 

<style>/n h1{a:b}/n

it is very easy if there is no other attribute in style tag,but sometime there may be some other attributes like type ,id

ex : 

<style type="text/css" id="default_css_scope">
content
</style>

so that i cant use like this s.replace("<style>","<style>".mydata);

How can i do this with Regular Expression ?

share|improve this question
1  
This doesn't answer your question directly, but you may wish to look at "DocumentFragments" as an alternative to regex. This allows you to use dom functions directly on dettached dom elements developer.mozilla.org/en/DOM/DocumentFragment ejohn.org/blog/dom-documentfragments –  Alex Key Nov 25 '11 at 11:52
    
@AlexKey Actually i am not going to render this at this time,i am making a WYSWYG editor,so its not a good idea to use DOm methods better than string manipulation. –  Red Nov 25 '11 at 11:54
1  
is there any difference put this "/n h1{a:b}/n" after <style> and before </style>. –  erimerturk Nov 25 '11 at 11:57
1  
Cool, that makes sense. Must admit I'm not a Regex guru, but this site provides a nice online editor that's helped me in the past: gskinner.com/RegExr –  Alex Key Nov 25 '11 at 11:59
    
@erimerturk heheh..cool dude...you mad this Question absolutely waste. –  Red Nov 25 '11 at 12:08

5 Answers 5

up vote 1 down vote accepted

Caveat: I do not recommend using regular expressions to work extensively with HTML.

But you might get away with it in this specific case:

str = str.replace(/<style[^>]*>/, function(m) {
    return m + mydata;
});

Live example

share|improve this answer
    
Hai,Is there any other way ? I am making a WYSWYG editor.So i dont want to convert this to DOM,just want to save on DB. –  Red Nov 25 '11 at 11:57
    
@DileepDil: My answer doesn't convert anything to DOM. It does a string replacement on text in a variable. –  T.J. Crowder Nov 25 '11 at 11:58
    
@Crowder i mean the First line of your Answer. –  Red Nov 25 '11 at 12:11
    
@DileepDil: Ah, okay. :-) –  T.J. Crowder Nov 25 '11 at 12:14
up vote 3 down vote

maybe you should try this. i think it will solve your problem.

 str= str.replace("</style>",mydata+"</style>");
share|improve this answer
    
Nice end-run, good to think outside the box like that. It could matter that he add the new stuff at the top rather than bottom of the style block (because of precedence), but if not, it simplifies things for him. –  T.J. Crowder Nov 25 '11 at 12:09
    
Thank you erimerturk,This is a good solution[My logic have some breaks]. –  Red Nov 25 '11 at 12:12
    
maybe but it is useful. :) –  erimerturk Nov 25 '11 at 12:13
    
@Crowder : I will never mind about Precedence [at least this time],anyway both are working well. –  Red Nov 25 '11 at 12:15
up vote 1 down vote

Kindly refer this. A Brilliant post from sometime ago on the use of Regex with HTML.

Two of the most diverse technologies used together.

[See here] RegEx match open tags except XHTML self-contained tags

share|improve this answer
    
XHTML != HTML... –  T.J. Crowder Nov 25 '11 at 12:11
    
I bookmarked [Future reference] –  Red Nov 25 '11 at 12:20
up vote 0 down vote

Something like this

var start = html.indexOf("<script", 0); //find the index of the first script
start = html.indexOf(">", start); //Starting for that script tag, find the next >

var output = [html.slice(0, start), myData, html.slice(start)].join(''); //Add string to at that position.

Thanks to jAndy for his code snippit

Hope this helps.

share|improve this answer
    
Looks like Good one,but a simpler solution taken.. –  Red Nov 25 '11 at 12:46
up vote 0 down vote

You might want to look into the HTML Agility pack (free library):

http://htmlagilitypack.codeplex.com/

share|improve this answer
    
A simple solution is always welcomed.Also No more DOM [This is different case,if i am doing this on a web page then its welcomed] –  Red Nov 25 '11 at 12:18

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.