Javascript Yardımıyla Harici Css İçeriğini Sayfaya Dahil Etmek
Özellikle ajax ile yüklenen sayfalara harici css veya js dosya eklemek için 3 farklı yöntem.
<style type="text/css" >@import url('http://www.deneme.com/style.css');</style>
Yukardaki gibi harici bir CSS dosyasını sayfamıza entegre etmek istersek kullanabileceğimiz java yöntemleri şunlar olabilir.
1. Yöntem
var oLink = document.createElement("link")
oLink.href = "mypath/mycss.css";
oLink.rel = "stylesheet";
oLink.type = "text/css";
document.body.appendChild(oLink);
burada body yerine head kullanmak daha mantıklı olmalıvar headID = document.getElementsByTagName("head")[0];
var cssNode = document.createElement('link');
cssNode.type = 'text/css';
cssNode.rel = 'stylesheet';
cssNode.href = 'FireFox.css';
cssNode.media = 'screen';
headID.appendChild(cssNode);
2. Yöntem
document.styleSheets[0].deleteRule(1); //delete the second rule
document.styleSheets[0].insertRule('html { color: lime; }',0); //add a new rule at the start
var oLength = document.styleSheets[0].cssRules.length;
document.styleSheets[0].insertRule('body { background: #779; }',oLength); //add a new rule at the end
var oRule = document.styleSheets[0].cssRules[oLength]; //reference the new rule we just added
3. Yöntemfunction DosyaUzantı(Dosya){
return Dosya.substring((Dosya.lastIndexOf(".")+1)).toLowerCase();
}
function HariciCssJs(Dosya){
switch(DosyaUzantı(Dosya))
{
case 'css':
var Eklenecek=document.createElement("link");
Eklenecek.setAttribute("rel", "stylesheet");
Eklenecek.setAttribute("type", "text/css");
Eklenecek.setAttribute("href", Dosya);
break;
case 'js':
var Eklenecek=document.createElement('script');
Eklenecek.setAttribute("type","text/javascript");
Eklenecek.setAttribute("src", Dosya);
break;
default:
}
if (typeof Eklenecek!="undefined")
document.getElementsByTagName("head")[0].appendChild(Eklenecek);
}
HariciCssJs('tmp/fotograf.css');
Yorumunuzu Ekleyin