How to replace text with Jquery?

Question

Is it possible I can replace my name with "anonymous" via jquery. but still keep my anchor tag with the specific link to a comment. I couldn't figure it out so I tried removing the text and keeping the comment with

$('div.entryFooter').replaceWith($('div.entryFooter a'));

but it showed all the content from all three 'a' elements in all of my divs.

Ideally, I just need the name replaced with "anonymous". My name will always be different so I need a way to find the name after "Posted by"

<div class="entryFooter">Posted by mjroodt at 24/10/2011 11:48<a href="/BlogPage.aspxid=20396&blogid=58906">Comments (1)</a></div>

<div class="entryFooter">Posted by mjroodt at 27/10/2011 13:33<a href="/BlogPage.aspx?id=12396&blogid=58945">Comments (2)</a></div>

<div class="entryFooter">Posted by mjroodt at 27/10/2011 15:59<a href="/BlogPage.aspx?id=14396&blogid=59963">Comments (7)</a></div>

Many thanks

Are you aware of the fact that viewing the original HTML source will still simply reveal the original author? — pimvdb
– pimvdb, Commented Oct 25, 2011 at 16:39
@pimvdb, yes I am aware that the original author will be visible through the original HTML source but unfortunately I only have access to the client side. — mjroodt
– mjroodt, Commented Oct 25, 2011 at 18:28

James Johnson · Accepted Answer · 2011-10-25 17:17:43Z

4

No need for jQuery here. Just use the Javascript replace([substring], [newstring]) function:

var value = $(".div.entryFooter").text().replace("James Johnson", "Anonymous");

Should be noted that this is only for the visual display. If you don't want the names to show at all, you'll need to parse them out at the server or database level.

$(".div.entryFooter").each(function(){
    $(this).text($(this).text().replace("James Johnson", "Anonymous"));
});

edited Oct 25, 2011 at 17:17

answered Oct 25, 2011 at 16:42

James Johnson

46.1k8 gold badges75 silver badges111 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

JCOC611 Over a year ago

Um..that is jQuery. Edit: well, really, jQuery is only used to retrieve the node from the DOM.

James Johnson Over a year ago

The replace function is not.

Justin Carlson Over a year ago

You can do it all in once shot as well. $(".div.entryFooter").text( $(".div.entryFooter").text().replace("James Johnson", "Anonymous") );

pimvdb Over a year ago

@Justin Carlson: That fetches the text of the first element and sets all elements' text to that, so it's probably not what the OP wants.

Anatoly Over a year ago

it the best solution, but only if you know the name

|

Joe · Accepted Answer · 2011-10-25 16:49:42Z

3

This loop will parse out the name, whatever it might be, and replace it with in this case anon:

$('div').each(function () {
   var $this = $(this),
    text = $this.text(),
    name = text.match(/Posted by (.+) at .+/)[1]
   $this.text(text.replace(name, 'anon')) 
});

Example

Using:

edited Oct 25, 2011 at 16:49

answered Oct 25, 2011 at 16:43

Joe

82.9k18 gold badges130 silver badges147 bronze badges

Comments

flynfish · Accepted Answer · 2011-10-25 17:10:25Z

2

You can do this by using a few lines of Jquery below. This solution will keep your anchor tags working as they were and you don't need to know the name you are trying to replace.

$('.entryFooter').each(function(){
    var html_arr = $(this).html().split(' ');
    html_arr[2] = 'anonymous';
    $(this).html(html_arr.join(' '));
});

EXAMPLE

answered Oct 25, 2011 at 17:10

flynfish

5,8673 gold badges28 silver badges33 bronze badges

Comments

Rob W · Accepted Answer · 2011-10-25 16:41:25Z

2

If you want to hide your real name, you have to adjust the server response.
For visual changes only, use the code below:

var name = "mjroodt";
var replaceBy = "anonymous";

//Generate a replace-all pattern
var pattern = new RegExp(name.replace(/([[^$.|?*+(){}])/g, '\\$1'), 'g');

//Loop through each `div.entryFooter` element
$("div.entryFooter").each(function(){
    var $this = $(this);
    var text = $this.text();
    //Check if the name exists. Otherwise, ignore
    if(text.indexOf(name) == -1) return;
    $this.text(text.replace(pattern, replaceBy));
})

answered Oct 25, 2011 at 16:41

Rob W

350k87 gold badges811 silver badges683 bronze badges

Comments

Vivek Viswanathan · Accepted Answer · 2011-10-25 16:44:08Z

1

You could match any name and replace it with "anonymous" using the below code,

text.replace(/by[ ][a-zA-Z0-9]*[ ]at/,"by anonymous at");

The above would replace the content between "by" and "at" in the sentence "posted by xyz at" by "posted by anonymous at".

answered Oct 25, 2011 at 16:44

Vivek Viswanathan

1,96318 silver badges26 bronze badges

1 Comment

pimvdb Over a year ago

I think the character class for just one space is not necessary.

Anatoly · Accepted Answer · 2011-10-25 17:02:13Z

I'd suggest you to wrap text into span and iterate through them to change text() with RegExp:

see the work example for you requirements: http://jsfiddle.net/mikhailov/ypRsP/

HTML

<div class="entryFooter">
    <span>Posted by mjroodt at 24/10/2011 11:48</span>
    <a href="/BlogPage.aspxid=20396&blogid=58906">Comments (1)</a>
</div>

<div class="entryFooter">
    <span>Posted by mjroodt at 27/10/2011 13:33</span>
    <a href="/BlogPage.aspx?id=12396&blogid=58945">Comments (2)</a>
</div>

<div class="entryFooter">
    <span>Posted by mjroodt at 27/10/2011 15:59</span>
    <a href="/BlogPage.aspx?id=14396&blogid=59963">Comments (7)</a>
</div>

JS

$('.entryFooter span').each(function(){
    var that    = $(this);
    var content = that.text();
    var t = content.replace(/^Posted by [A-Za-z]+/, "Posted by Anonymous");
    that.text(t);
});

Collectives™ on Stack Overflow

How to replace text with Jquery?

6 Answers 6

6 Comments

Comments

Comments

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

6 Comments

Comments

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related