Use data:text/css to add dynamic css style to a document or a page - Javascript String Operation

Javascript examples for String Operation:String URL

  1. HOME
  2. Javascript
  3. String Operation
  4. String URL

Description

Use data:text/css to add dynamic css style to a document or a page

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript">
    window.onload=function(){/*from w ww.  j  a v  a 2  s .c  o m*/
var css = '*{color:red;}';
var link = document.createElement('link');
link.rel = 'stylesheet';
link.href = 'data:text/css;charset=UTF-8,' + encodeURIComponent(css);
document.getElementsByTagName('head')[0].appendChild(link);
    }

      </script> 
   </head> 
   <body> 
      <p>Foo bar baz</p>  
   </body>
</html>

Related Tutorials