Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    WA
    WA is offline
    Administrator
    Join Date
    Mar 2002
    Posts
    2,596
    Thanks
    2
    Thanked 19 Times in 18 Posts

    Regular expressions- search and replace within specific blocks of text

    Hi guys:
    Just looking for some help on how best to tackle the following. I have multiple blocks of repeating HTML stored inside a variable that I need to do some search/replace with:
    Code:
    var sometext = '<span class="title">Hello</span> <span class="date">Date</span> <span class="description">Some description</span>'
    
    + '<span class="title">Hello 2</span> <span class="date">Date 2</span> <span class="description">Some description 2</span>'
    
    + '<span class="title">Hello 3</span> <span class="date">Date 3</span> <span class="description">Some description 3</span>'
    
    + '<span class="title">Hello 4</span> <span class="date">Date 4</span> <span class="description">Some description 4</span>'
    Each block consists of 3 SPAN fields ("title", "date", and "description"), with the number of blocks being arbitrary. Is there a quick way to easily confine a search and replace to just specific blocks of text, say, inside all "description" fields only? So in other words, I want the s&r to only occur inside the <span class="description"> tags, and not touching the tags themselves:

    Code:
    <span class="description">Some description 4</span>
    Pseudo code wise it'd look something like:

    Code:
    sometext.filter('span.description').replace(/re/, 'new text')
    I know there's "look-aheads" in Regexp, but it still seems very cumbersome to so something like the above. Any insight welcome!
    - George
    - JavaScript Kit- JavaScript tutorials and 400+ scripts!
    - JavaScript Reference- JavaScript reference you can relate to.

  • #2
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,461
    Thanks
    11
    Thanked 600 Times in 580 Posts
    functional regexp's are what you need.

    live demo/sandbox

    Code:
    var sometext = '<span class="title">Hello</span> <span class="date">Date</span> <span class="description">Some description</span>'
    + '<span class="title">Hello 2</span> <span class="date">Date 2</span> <span class="description">Some description 2</span>'
    + '<span class="title">Hello 3</span> <span class="date">Date 3</span> <span class="description">Some description 3</span>'
    + '<span class="title">Hello 4</span> <span class="date">Date 4</span> <span class="description">Some description 4</span>'
    
    
    var newText=sometext.replace(/(<span class=")([\w]+)(">)([\w\W]+?)(<\/span>)/g, 
      function(all,open,className,mid,body,close){
    
      var buff=body;
    
      switch(className){
        case "description": buff=buff.bold(); break;
        case "title": buff=buff.big(); break;
        case "date": buff=buff.fixed(); break;
      }
    
      return  "\n"+open+className+mid+buff+close;
    
    });

    which gives:


    Code:
    <span class="title"><big>Hello</big></span> 
    <span class="date"><tt>Date</tt></span> 
    <span class="description"><b>Some description</b></span>
    <span class="title"><big>Hello 2</big></span> 
    <span class="date"><tt>Date 2</tt></span> 
    <span class="description"><b>Some description 2</b></span>
    <span class="title"><big>Hello 3</big></span> 
    <span class="date"><tt>Date 3</tt></span> 
    <span class="description"><b>Some description 3</b></span>
    <span class="title"><big>Hello 4</big></span> 
    <span class="date"><tt>Date 4</tt></span> 
    <span class="description"><b>Some description 4</b></span>
    Last edited by rnd me; 09-12-2012 at 01:10 AM.
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%

  • #3
    WA
    WA is offline
    Administrator
    Join Date
    Mar 2002
    Posts
    2,596
    Thanks
    2
    Thanked 19 Times in 18 Posts
    Interesting, thanks for the code. Just wondering, where are the values for the parameters inside the below coming from:

    Code:
    function(all,open,className,mid,body,close)
    In other words, all, open etc. I thought the callback function of the replace() function is only implicitly passed one parameter that is the matched text.

    Thanks,
    - George
    - JavaScript Kit- JavaScript tutorials and 400+ scripts!
    - JavaScript Reference- JavaScript reference you can relate to.

  • #4
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,461
    Thanks
    11
    Thanked 600 Times in 580 Posts
    Quote Originally Posted by WA View Post
    Interesting, thanks for the code. Just wondering, where are the values for the parameters inside the below coming from:
    from the parens. as in the string "$1, $2, $3", etc, the function's formal parameters are filled exactly the same; arguments[n]==$n, since arguments[0] is the whole match...
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •