Extract href from string with regex

Question

What would be the easiest way with regex to extract the href string containing a stylesheet link and save it to a variable in JavaScript?

The stylesheet is a string and not a real stylesheet link. It's intended to be inserted with Javascript after the page loads.

EDIT:

    <script>
        // Loading stylesheet just before body closes
        $(function() {
            var stylesheet = '<link href="/Static/css/compiled/styles.css" rel="stylesheet"/>';
            var stylesheetHref = ""; // WANT TO SET THIS!!

            if (document.createStyleSheet) {
                document.createStyleSheet(stylesheetHref);
            } else {
                $("head").append(stylesheet));
            }
        });
    </script>

Oooh, so it's a string an not a real stylesheet, makes sense no, but how should we know what that even looks like, or how to get it ? — adeneo
– adeneo, Commented May 8, 2014 at 14:28

tenub · Accepted Answer · 2014-05-08 14:44:51Z

4

Why not create elements the proper way and just start out with the href in a variable ?

$(function () {
    var href = '/Static/css/compiled/styles.css';
    var stylesheet = $('<link />', {rel: 'stylesheet', href: href});

    $("head").append(stylesheet);
});

edited May 8, 2014 at 14:44

tenub

3,4561 gold badge18 silver badges26 bronze badges

answered May 8, 2014 at 14:40

adeneo

319k29 gold badges410 silver badges392 bronze badges

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

1 Comment

adeneo Over a year ago

@Archer - Yes I did, got the tags a little mixed up.

Reinstate Monica Cellio · Accepted Answer · 2014-05-08 14:32:13Z

3

If you have a stylesheet link in string format then this will get you the href value, very easily without regex...

var link = '<link rel="stylesheet" type="text/css" href="//cdn.sstatic.net/stackoverflow/all.css" />';
var href = $(link).attr("href");

answered May 8, 2014 at 14:32

Reinstate Monica Cellio

26.2k6 gold badges54 silver badges67 bronze badges

Comments

Pedro Lobito · Accepted Answer · 2014-05-08 14:34:30Z

1

Try this:

<script>
    // Loading stylesheet just before body closes
    $(function() {
        var stylesheet = '<link href="/Static/css/compiled/styles.css" rel="stylesheet"/>';
        var stylesheetHref = stylesheet.replace(/.*href="(.*?)".*/i, "$1");


        if (document.createStyleSheet) {
            document.createStyleSheet(stylesheetHref);
        } else {
            $("head").append(stylesheet));
        }
    });
</script>

answered May 8, 2014 at 14:34

Pedro Lobito

99.8k36 gold badges274 silver badges278 bronze badges

5 Comments

Pedro Lobito Over a year ago

@ejay, and why is that ?

Pedro Lobito Over a year ago

@Ejay Time is your most precious asset, don't waste it!

Ejaz Over a year ago

Is it me or your comment is quite ironic?

Pedro Lobito Over a year ago

@ejay, I was serious and ironic in a positive way! Enjoy your day;)

Ejaz Over a year ago

you too man. Chill out :) This comment/edit timing thing happens all the time :)

Collectives™ on Stack Overflow

Extract href from string with regex

3 Answers 3

1 Comment

Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related