My css won't work within a script

Question

In the html file:

<html>
  <head>
     <script type="text/javascript" src="/images/files/js/callback.js"></script>
  </head>
</html>

in the callback.js file:

$(document).ready(function() {
document.write('<script type="text/javascript" src="/images/files/css/style.css" ></script>');
document.write('<link src="/images/files/js/core.js">');
}

About some reason it will add al the text of the callback.js file into my page but won't load the style.css and the core.js, So when I visit the page the elements of callback.js will be in the head element but they don't work on the page, so I have a page without css and js

second thing I want to achieve is that if it has load all the content of the callback.js it will remove the link to callback.js so that file isn't visible anymore

The reason I want to do this is in javascript/jquery is because I hate php and I've a lot of pages with exactly the same links in it.

you cannot use document.write on ready event, you need to dinamycally append into the header. And why are you using a script tag to load a css file? — Fabrizio Calderan loves trees, Apr 08 '14 at 14:03
To add to what @FabrizioCalderan said, you can't use `` for a script file. Also, it's `href` instead of `src` when including css files. — xec, Apr 08 '14 at 14:06
That wont work in any ways. As you dont have refernced jquery first. — Jai, Apr 08 '14 at 14:16

Fabrizio Calderan loves trees · Answer 1 · 2014-04-08T14:15:04.870

1

$(document).ready(function() {

   /* creating script and link elements */

   var style = $('<link />', {
       'href': '/images/files/css/style.css',
       'rel': 'stylesheet'
   });
   var core  = $('<script />', { 
       'src': '/images/files/js/core.js'
   });


   /* append style and core */

   var head  = $('head');
   style.appendTo(head);
   core.appendTo(head);

});

edited Apr 08 '14 at 14:15

answered Apr 08 '14 at 14:08

Fabrizio Calderan loves trees

109,094
24
154
160

score 0 · Answer 2 · answered Apr 08 '14 at 14:02

0

Change

document.write('<script type="text/javascript" src="/images/files/css/style.css" ></script>');

to,

document.write('<link rel="stylesheet" type="text/css" href="/images/files/css/style.css" >');

answered Apr 08 '14 at 14:02

Sarvap Praharanayuthan

3,673
6
43
65

-1 document.write() is a bad idea. See my comments on @Ani's answer. – xec Apr 08 '14 at 14:16
@xec: Agreed. But I just wanted to correct the OP's mistake in the logic. That's it. – Sarvap Praharanayuthan Apr 08 '14 at 14:18

score 0 · Answer 3 · answered Apr 08 '14 at 14:04

You write :

document.write('<script type="text/javascript" src="/images/files/css/style.css" ></script>');

You are trying to include a CSS file in a script tag. Use instead :

document.write('<link rel="stylesheet" href="/images/files/css/style.css"/>');

My css won't work within a script

3 Answers3