How to unload a css file using only its filename?

Question

I have a css file in my <head> tag, defined as follows:

<link href="foo/bar/baz.css" rel="stylesheet" class="lazyload" type="text/css">

I want to be able to remove this css file dynamically, from the javascript. However, at runtime, I won't have the full href available, only the baz.css part (That's because the file is hosted at a CDN, and the url can be dynamically generated / different each time, so it can't be hard-coded).

The css file will always have the class lazyload.

How can I remove this?

What do you mean, "remove"? Once the CSS has been loaded, the browser's not going to forget about it. (At least I don't think it will.) — Pointy, Mar 28 '14 at 22:42
@adeneo how can you do that? Well, I can imagine doing it if I've got control of the CSS rules themselves of course, but does messing with a `` affect the rules it imported? — Pointy, Mar 28 '14 at 22:44
@Pointy - searched and found -> http://stackoverflow.com/questions/3182840/removing-or-replacing-a-stylesheet-a-link-with-javascript-jquery — adeneo, Mar 28 '14 at 22:47

score 5 · Accepted Answer · answered Mar 28 '14 at 22:48

5

$("link[href*='baz']").prop('disabled', true);
$("link[href*='baz']").remove();

answered Mar 28 '14 at 22:48

Marjan Nikolovski

848
8
22

How to unload a css file using only its filename?

1 Answers1