Including CSS if it's not already included

[csdude55]

I have a stylesheet that I include in my header file, using <link rel="stylesheet" href="..."> whenever a certain variable is defined, if there's an ID param in the query string, or if the file name is post.php.

Later on post.php, I include another PHP script via Ajax that uses the same stylesheet that should have been included in the header. But I'd like to double check it, just to be 100% safe.

Is there a way to see if a stylesheet has already been included? I'm open to PHP, CSS, JavaScript, or jQuery options.

The only method I can think of is to create a hidden DIV with an ID in the header file, then use the stylesheet to change the display style. Then I could use JavaScript to test for "display", send the result in the Ajax call, then test for it in the included script; eg:

// style.css
#tester { display: block }

// header.php
if (isset($css) ||
 isset($_GET['id']) ||
 substr($_SERVER['SCRIPT_NAME'], -8) === 'post.php')
  echo <<<EOF
<link rel="stylesheet" href="https://www.example.com/style.css">
<div id="tester" hidden></div>

EOF;

// JavaScript (I already use jQuery, so it's not being imported just for this
if ((val = $('#richhtml')).length) {
 var tester = 'tester=' + $('#tester').css('display');
 val.ajax('/example.php?' + tester);
}

// example.php, loaded via Ajax
if ($_GET['tester'] !== 'block')
  echo <<<EOF
<link rel="stylesheet" href="https://www.example.com/style.css">

EOF;

Is there a better / faster method that already exists?

[lucy24]

I wish you wouldn't say "include", since that sounds like, well, include (as opposed to include_once, but I guess that only applies within the same script).

I kinda suspect this is a non-problem, because so what if the HTML invokes the same css twice? The browser should have the sense to say “Oh, wait, I've already got this file”, just as it does if you use the same image multiple times in the same document--or, come to think of it, if two different pages call for the same stylesheet. And even if it doesn't, sending the css out twice is probably less work for the server than any added code would be.

[csdude55]

I wish you wouldn't say "include", since that sounds like, well, include (as opposed to include_once, but I guess that only applies within the same script).

Hahaha, you have no idea how many times I changed it before posting, trying to figure out the right way to say it! LOL At first I used "import", but that has it's own CSS meaning. "Link" is probably the most accurate, but calls to mind an <a href=...> tag. I'm honestly not sure that there IS a good way to reference it!

But anyway. You're probably right, I'm mainly just trying to remove unnecessary code to shave microseconds here and there. Maybe I'll just leave it alone, I dunno.

[tangor]

If the browser already has it, wouldn't it be ignored anyway as regards to load time?

[csdude55]

I honestly don't know, @tangor. Does it still make the HTTP connection?

[lucy24]

Look at your logs. If two pages use the same supporting file, the second time around it won't even be requested. (This is my single most common reason for false-positives on robots: someone visits a page, and a day or two later they visit a different page in the same directory. On that repeat visit, they don’t request any stylesheets.)

So what we're generally talking about is the extra work for your server of sending out something under 100 bytes--the line referencing the stylesheet--versus the extra work for your server of running the code to decide whether to include (haha) that 100-byte line. I tend to think the first option, with possible redundancy, comes out to much less work.