ホームページ >ウェブフロントエンド >jsチュートリアル >Javascript は CSS_javascript スキルの動的ロードを実装します

Javascript は CSS_javascript スキルの動的ロードを実装します

WBOY
WBOYオリジナル
2016-05-16 16:18:041056ブラウズ

コードをコピーします コードは次のとおりです:

<スクリプトタイプ="text/javascript">
function addStyle(stylePath) {
var コンテナ = document.getElementsByTagName("head")[0];
var addStyle = document.createElement("link");
addStyle.rel = "スタイルシート";
addStyle.type = "text/css";
addStyle.media = "画面";
addStyle.href = stylePath;
Container.appendChild(addStyle);
}
addStyle('http://www.xxx.com/wintys/dynamic.css');

JS ファイルの動的ロードを制御するために JS で書かれた関数が使用されます。つまり、JS ファイルは必要な場合にのみロードされ、CSS ファイルもロードできるため、Web ページのスキンを変更できると思います。よく書かれていますが、真剣に見てみると、改善したにもかかわらず、まだかなり優れていることがわかります。

コードをコピーします コードは次のとおりです:

function $import(path,type,title){
var s,i; if(!type) type=path.substr(path.lastIndexOf(".") 1); if(type=="js"){
var ss=document.getElementsByTagName("スクリプト"); for(i=0;i If(ss[i].src && ss[i].src.indexOf(path)!=​​-1 || ss[i].title==title)return
; }
s=document.createElement("スクリプト"); s.type="text/javascript"; s.src=パス; If(タイトル) s.title=タイトル
}
else if(type=="css"){
var ls=document.getElementsByTagName("リンク"); for(i=0;i If(ls[i].href && ls[i].href.indexOf(path)!=​​-1 || ls[i].title==title)return ls[i]; }
s=document.createElement("リンク"); s.rel="スタイルシート"; s.type="テキスト/css"; s.href=パス; If(タイトル) s.title=タイトル
s.disabled=false;
}
それ以外の場合は
を返します。 var head=document.getElementsByTagName("head")[0]; head.appendChild(s);
を返します。 }


声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。