Summary of dynamic loading of css using javascript

Customer home (www.bkjia.com)1. load required files in external CSS files

@ Importurl(style.css );

// It can only be used in CSS files or style labels

2. Simply load an external CSS file in the page

Document. createStyleSheet (cssFile );

2. Use the createElement method to create the CSS Link tag

Varhead = document. getElementsByTagName ('head'). item (0 );

Varstyle = document. createElement ('link ');

Style.hrefw.'style.css ';

Style. rel = 'stylesheet ';

Style. type = 'text/css ';

Head. appendChild (style );

The following are two frequently used functions.

FunctionloadJs (file ){ VarscriptTag = document. getElementById ('loadscript '); Varhead = document. getElementsByTagName ('head'). item (0 ); If (scriptTag) head. removeChild (scriptTag ); Script = document. createElement ('script '); Script. src = "../js/mi _" + file + ". js "; Script. type = 'text/javascript '; Script. id = 'loadscript '; Head. appendChild (script ); } FunctionloadCss (file ){ VarcssTag = document. getElementById ('loadcss '); Varhead = document. getElementsByTagName ('head'). item (0 ); If (cssTag) head. removeChild (cssTag ); Css = document. createElement ('link '); Css. href = "../css/mi _" + file + ". css "; Css. rel = 'stylesheet '; Css. type = 'text/css '; Css. id = 'loadcss '; Head. appendChild (css ); } Copy code