Javascript - wrap link in quotes regex

Question

I'm wrapping all urls with <a> tag, but because I develop app style website, I need to replace all internal urls with a specific attribute.

So this:

href="http://domain.com/page/details"

should become

data-bind="page: '/page/details'"

the problem is, that it is not enough to just replace beginning because link itself should be wrapped in quotes for later javascript processing. Also I would like to cover situations like www.domain.com with domain.com

UPDATE

It's as simple as it can get. I'm not asking for a url detection regex, I have all of that covered.

All I need is to change front part of href with url that matches current domain like I showed in example and then wrap rest of the url with single quotes.

I know how to simply change replace front part href="http://domain.com into data-bind="page:, but how can I wrap the rest remaining url /page/details or in other words, all text up until first double quote, with a single quotes.

Using regex with URLs would be a mistake - a blackhole where others [have been sucked in](http://geekswithblogs.net/casualjim/archive/2005/12/01/61722.aspx) and have gone where no developer has gone before - still missing. You can try some of these [attempts](http://stackoverflow.com/questions/3809401/what-is-a-good-regular-expression-to-match-a-url). — Kash, Jun 27 '13 at 19:56
You need to provide specific details of what you want, not just one example and vague wording over "situations like". You also should show what you've tried, we're not here to write code for you, we're here to help you fix your code. — Barmar, Jun 27 '13 at 19:59

score 2 · Accepted Answer · answered Jun 27 '13 at 20:25

2

How about something like this:

var newString = string.replace(/href="http:\/\/domain\.com(\/[^"]*)"/g, "data-bind=\"page: '$1'\"");

answered Jun 27 '13 at 20:25

David Knipe

3,417
1
19
19

score 1 · Answer 2 · answered Jun 27 '13 at 20:18

1

Rather than changing your links, make your link-handler smarter.

Keep your links:

<a href="http://example.com/path/to/thing">what</a>

But change their click handlers:

$('a').click(function() {
    url = $(this).get(0).pathname;
    console.log(url); // outputs "/path/to/thing"
    if (on the app page) {
        // do stuff
        return false;
    }
    else {
        // on the browser page
    }
});

This has an added benefit of gracefully falling back if javascript is disabled.

answered Jun 27 '13 at 20:18

000

26,951
10
71
101

I don't know how else I can call an app style website, maybe comparison with ember.js could help? The idea behind is that there are no use of that website without javascript, also catching clicks on links is a solution I'm using now, but it requires to use `$('body').on('click','a')` because almost all parts of html keeps changing when browsing. – Giedrius Jun 27 '13 at 20:24

Javascript - wrap link in quotes regex

2 Answers2