How can I strip out a the base URL using JavaScript? - Stack Overflow

admin管理员组

文章数量:1391964

I have this function from a previous problem, and it works great however I just realized my collection of links need to have the base URL stripped out.

These are the parts which I thought would strip out the baseURL:

baseUrlPattern = /^https?:\/\/[a-z\:0-9.]+/; // create the regexp

link.href.replace(baseUrlPattern ,""); // then use replace to strip it out of the URL

UPDATE

I should have mentioned:

The function already can discover the link and apply the attribute, but doesn't strip out the base URL.

This:

<a href="">link1</a>

Should look like this in the DOM afterwards:

<a href="/xxx/xxx/xxx" target="_blank">link1</a>

JS:

var URLChecker = (function iffe() {
    var publicAPI = {
        getURL: function() {
            for (var i = 0; i < arguments.length; i++) {
                return {
                  'smo': '',
                  'smodev': '',
                  'url1_sans_3w': '',
                  'url2': '',
                  'url3': ''
                }[arguments[i]];
            }
        },
        searchURL: function() {
            var link, url, baseUrlPattern = /^https?:\/\/[a-z\:0-9.]+/;
            for (var i = 0, len = arguments.length; i < len; i++) {
                url = this.getURL(arguments[i]);
                for (var j = 0, jlen = document.links.length; j < jlen; j++) {
                        link = document.links[j];
                    if (link.href.indexOf(url) !== -1) {
                        link.setAttribute("target", "_blank");
                        link.href.replace(baseUrlPattern ,"");

                    }
                }
            }
        }
    };
    return publicAPI;
})();

HTML:

<a href="">link1</a>
<br>
<a href="">link2</a>
<br>
<a href="">link3</a>
<br>
<a href="">link4</a>
<br>
<a href="">link5</a>

I have this function from a previous problem, and it works great however I just realized my collection of links need to have the base URL stripped out.

These are the parts which I thought would strip out the baseURL:

baseUrlPattern = /^https?:\/\/[a-z\:0-9.]+/; // create the regexp

link.href.replace(baseUrlPattern ,""); // then use replace to strip it out of the URL

UPDATE

I should have mentioned:

The function already can discover the link and apply the attribute, but doesn't strip out the base URL.

This:

<a href="http://url.nyc./xxx/xxx/xxx">link1</a>

Should look like this in the DOM afterwards:

<a href="/xxx/xxx/xxx" target="_blank">link1</a>

JS:

var URLChecker = (function iffe() {
    var publicAPI = {
        getURL: function() {
            for (var i = 0; i < arguments.length; i++) {
                return {
                  'smo': 'http://url.nyc.',
                  'smodev': 'http://smodev.rye.foo.',
                  'url1_sans_3w': 'http://url1.',
                  'url2': 'http://www.url2.',
                  'url3': 'http://www2.url3.'
                }[arguments[i]];
            }
        },
        searchURL: function() {
            var link, url, baseUrlPattern = /^https?:\/\/[a-z\:0-9.]+/;
            for (var i = 0, len = arguments.length; i < len; i++) {
                url = this.getURL(arguments[i]);
                for (var j = 0, jlen = document.links.length; j < jlen; j++) {
                        link = document.links[j];
                    if (link.href.indexOf(url) !== -1) {
                        link.setAttribute("target", "_blank");
                        link.href.replace(baseUrlPattern ,"");

                    }
                }
            }
        }
    };
    return publicAPI;
})();

HTML:

<a href="http://url.nyc./xxx/xxx/xxx">link1</a>
<br>
<a href="http://smodev.rye.foo./xxx/xxx/xxx">link2</a>
<br>
<a href="http://url1./xxx/xxx/xxx">link3</a>
<br>
<a href="http://www.url2./xxx/xxx/xxx">link4</a>
<br>
<a href="http://www.url3./xxx/xxx/xxx">link5</a>

• javascript

Share Improve this question Follow edited May 23, 2017 at 10:34 CommunityBot 111 silver badge asked Jun 23, 2016 at 21:39 Antonio Pavicevac-OrtizAntonio Pavicevac-Ortiz 7,7972020 gold badges7676 silver badges158158 bronze badges 5

• Can you give example of stripping base url - url.nyc.? – Naga Sai A Commented Jun 23, 2016 at 21:46
• taking url.nyc. as example, it should be displayed on the page as url.nyc right, – Naga Sai A Commented Jun 23, 2016 at 21:47
• Hi Naga, I have added a bit more of a explanation. – Antonio Pavicevac-Ortiz Commented Jun 23, 2016 at 23:02
• 2 The URL object does what you want, if the browser support is right. new URL("http://www.url2./xxx/xxx/xxx").pathname === "/xxx/xxx/xxx" – Noah Freitas Commented Jun 23, 2016 at 23:19
• Thanks Noah! Unfortunately, I need something with a lot of support. – Antonio Pavicevac-Ortiz Commented Jun 23, 2016 at 23:22

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

Using native methods:

var url = 'http://url.nyc./x/xx/xxx';
var strippedUrl =  new URL(url); // url.pathname == '/x/xx/xxx/'

Note: this may not work in Chrome; but browser wasn't specified

There's different ways you can go about this, here's one of them:

See ments below

searchURL: function() {
    var link, url, parser; //added parser
    for (var i = 0, len = arguments.length; i < len; i++) {
        url = this.getURL(arguments[i]);
        for (var j = 0, jlen = document.links.length; j < jlen; j++) {
                link = document.links[j];
            if (link.href.indexOf(url) !== -1) {
                // create a dummy link just to get the pathname of the actual link
                parser = document.createElement('a');
                parser.href = link.href;

                link.setAttribute("target", "_blank");
                link.href = parser.pathname;
            }
        }
    }
}

Should you need anything else, remember the parser just an anchor so you have the following

var href = "http://url.nyc./xxx/xxx/xxx"; 
parser = document.createElement('a'); 
parser.href = href; 

console.dir(parser);

parser.protocol; // => "http:"
parser.hostname; // => "url.nyc."
parser.port;     // => ""
parser.pathname; // => "/xxx/xxx/xxx"
parser.search;   // => ""
parser.hash;     // => ""
parser.host;     // => "url.nyc."

Maybe it's late but if you want

This:

<a href="http://url.nyc./xxx/xxx/xxx">link1</a>

Should look like this in the DOM afterwards:

<a href="/xxx/xxx/xxx" target="_blank">link1</a>

you can do this way

var x = 'http://url.nyc./xxx/xxx/xxx';
var y = x.split('/').slice(3).join('/');
console.log(y);

本文标签： How can I strip out a the base URL using JavaScriptStack Overflow