Wednesday, April 6, 2011

Jquery: Doing some operations on strings

I have a string like this:

Heading
Some interesting text here
HeadingSome interesting text hereHeading
Some interesting text here
Heading
Some interesting text here

What I want to do, is to add another heading under the third heading so it would end up looking like this:

Heading
Some interesting text here
HeadingSome interesting text hereHeadingHeading
Some interesting text here
Heading
Some interesting text here

I'm looking for a generalized method to select any heading and append stuff to it.

Here's a second and third example:

I have a string. Let's not use any DOM terms because they cause confusion.

My name is Mark. My name is Mark. My name is Mark. My name is Mark.

I want to add the string 'and my car is red" to the third repeat of 'My name is Mark.'

My name is Mark. My name is Mark. My name is Mark and my car is red. My name is Mark.

Here's another example:

My car is red. My car is red. My car is red. My car is red.

On the fourth repeat I want to change the text to 'My car is blue.'

My car is red. My car is red. My car is red. My car is blue.

Thanks!

I asked a potentially related question that I wasn't able to find an answer for. But everyone there says it's easy to do with regex: http://stackoverflow.com/questions/1146027/javascript-string-library

Edit: Added regex to tags.

I am so confused. Apparently people have take some issue with the question. If you think the question is missing some information, please ask, I'll do my best to create a sensible question.

Edit: Added more examples.

Thanks!

From stackoverflow
  • For selecting a specific item, you can look at the index filters (eq = equals, lt = less than, etc), such as: $('h2').eq(3).append(...)

    EDIT

    Seeing as your request is with regards to working as strings, the above could still be applied, if you wrap it like this:

    var snippet = $('<div>'+stringToManipulate+'</div>');
    snippet.find('h2').eq(3).html(snippet.find('h2').eq(3).html()+'more text...');
    stringToManipulate = snippet.html();
    

    Granted, that is specific code, but it is just to show off the general idea. I hope that helps.

    Mark : Thanks, but I don't think that would work. .find('h2') looks for an element, not a piece of string as the question asks.
    David Hedlund : No, the first line of code is the key here, wrapping it in the $ function, provided that the code is valid html, will return a jQuery-wrapped piece of dom, rather than a string, to the variable 'snippet', which you will then be able to run jQuery functions such as 'find' at. Try it out for yourself
    IonuČ› G. Stan : @d., he has no H2 tags inside that piece of string. He wants basic string manipulation.
  • This seems to work...

    // headingIndex starts at 1...
    function appendTo(currentText, headingIndex, newText) {
        var arr = currentText.split('Heading');
        arr[headingIndex] += newText;
        return arr.join('Heading');
    }
    

    It will split the entire string by the text "Heading" so you basically have a 1-based-index array of the "Heading" subsections, which then can easily be appended to then joined back together again. You could change this to replace the text completely if that's what you want to do.

    Boldewyn : +1 for using split and join.
    Mark : Thank you so much. Can you help me out with trying to make the example work? http://jsbin.com/ufoqo Thanks a lot, this is quite like how I imagined it would work.
    John Rasch : Interesting, never used jsbin before... neat. I think I edited it to what you wanted...
    Mark : @John Rasch, when you save in jsbin it doesn't overwrite the previous file, it gives you a new url to paste here. Thanks again!
    John Rasch : Whoops.. here it is: http://jsbin.com/uloma
    Mark : Thanks a lot! :)

0 comments:

Post a Comment