How to convert span tags in a String?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • mangal
    New Member
    • Dec 2006
    • 9

    How to convert span tags in a String?

    Hi,

    I need of assistance to convert spans having style related bold, ital and underline & color into html bold, underline and/or italicize tags.

    Sample Input String:
    Code:
    <p>In <span style="font-family:'serif', 'Caslon'; font-size:11pt; font-style:italic; color:#221E1F">The Crack in the Cosmic Egg</span> I recounted 
    how, at a gathering of dor mitory mates around a table, <span style="font-family:'serif', 'Caslon'; font-size:11pt; font-style:italic; color:#221E1F">I demonstrated that fire didn’t have to burn me</span>. We all smoked back then and I used up a full pack of Pall Mall <span style="font-family:'serif', 'Caslon'; font-size:11pt; font-weight:bold; color:#221E1F">cigarettes</span> (long unfiltered furnaces) to demonstrate my assertion.</p>
    OUTPUT
    Code:
    <p>In <i>The Crack in the Cosmic Egg</i> I recounted 
    how, at a gathering of dor mitory mates around a table, <i>I demonstrated that fire didn’t have to burn me</i>. We all smoked 
    back then and I used up a full pack of Pall Mall <b>cigarettes</b> (long unfiltered furnaces) to demonstrate my assertion.</p>
    Thanks in advance:

    Regards,

    Mangal
  • mangal
    New Member
    • Dec 2006
    • 9

    #2
    Hi, anybody know the regular expression for the post, please post, it will help me lot

    Megards,

    Mangal

    Comment

    • kovik
      Recognized Expert Top Contributor
      • Jun 2007
      • 1044

      #3
      You could do this in JavaScript or PHP. But, since you asked in PHP, I'll help you with that. Just use regex to find these and replace them. Note that this will NOT work if you have nested <span> tags. Dealing with nesting is a whole different monster.

      To make the regex, you are looking for a <span> tag with a style attribute containing a "font-style" CSS rule.

      Code:
      <span[^>]+?style="[^"]*font-style:\s?style-goes-here[^"]*"[^>]*>(.*?)</span>
      In this regex, "style-goes-here" would be replaced by the style that you are after. \1 in this regex will be the contents of the <span> tag. You can use preg_replace() to do the replacements.

      Code:
      $content = 'whatever HTML content you are altering';
      $styles = array(
          'italic' => 'i',
          'bold' => 'b',
      );
      
      foreach ($styles as $font_style => $desired_tag) {
          $regex = '~<span[^>]+?style="[^"]*font-style:\s?' . $font_style . '[^"]*"[^>]*>(.*?)</span>~';
          $content = preg_replace($regex, "<$desired_tag>$1</$desired_tag>", $content);
      }
      
      echo $content;

      Comment

      • mangal
        New Member
        • Dec 2006
        • 9

        #4
        Thanks Kovik,

        You really saved my lot of time, i already tried different regular expression but could not make correct one; as i was including nested <span> logic, may be that was the reason;

        kovik as you were saying that nested span case is different approach; if you have the logic of nested span then please post that also;

        Very-2 thank for your kind help;

        Regards,

        Mangal Kumar

        Comment

        • mangal
          New Member
          • Dec 2006
          • 9

          #5
          kovik,

          It is not working in case of font-weight:bold. I have added one more foreach to handle this;

          can be make it one for each by adding one more condition in regular expression:

          Code:
          $content = '<body><p><span style="font-size:11pt; font-style:italic; color:#221E1F">Mangal.</span></p>
          <p><span style="font-size:11pt; font-weight:bold; color:#221E1F">Pankaj.</span></p>
          <p><span style="font-size:11pt; color:#221E1F">Gaurav.</span></p>
          <p><span style="font-size:11pt; font-style:italic; color:#221E1F">Manish.</span></p></body>';
          
          $styles = array(
            'italic' => 'i',
            'bold' => 'b',
          );
           
          foreach ($styles as $font_style => $desired_tag) {
              $regex = '~<span[^>]+?style="[^"]*font-style:\s?' . $font_style . '[^"]*"[^>]*>(.*?)</span>~';
               $content = preg_replace($regex, "<$desired_tag>$1</$desired_tag>", $content);
          }
          
          foreach ($styles as $font_style => $desired_tag) {
              $regex = '~<span[^>]+?style="[^"]*font-weight:\s?' . $font_style . '[^"]*"[^>]*>(.*?)</span>~';
              $content = preg_replace($regex, "<$desired_tag>$1</$desired_tag>", $content);
          }
            
          echo $content;
          If possible then suggest me how to add more conditions in the regular exp;

          With Regards;

          Mangal

          Comment

          • kovik
            Recognized Expert Top Contributor
            • Jun 2007
            • 1044

            #6
            Oh. For some reason, my mind was thinking that bold was a font-style, not a font-weight. We'd just change it to this:
            Code:
            $styles = array(
              'font-style:\s?italic' => 'i',
              'font-weight:\s?bold' => 'b',
            );
             
            foreach ($styles as $css_rule => $desired_tag) {
                $regex = '~<span[^>]+?style="[^"]*' . $css_rule . '[^"]*"[^>]*>(.*?)</span>~';
                 $content = preg_replace($regex, "<$desired_tag>$1</$desired_tag>", $content);
            }
             
            echo $content;
            You need to keep the "\s?" because it allows for there to be a space. Technically, it should be "\s*?" since CSS ignores whitespace, but but there's no need to go there.

            In order to deal with nesting, I'd recommend tokenization. Do some research on it, as it can be a fairly broad topic.

            Comment

            • mangal
              New Member
              • Dec 2006
              • 9

              #7
              Thank you kovik,

              I will do more research and update you

              Regards,

              Mangal Kumar

              Comment

              Working...