js注入css（js注入網頁文本）

• 1、如何在css中 加入js呢
• 2、javascript如何添加css類
• 3、在JS文件中調用外部CSS文件

css是樣式表，js是事件效果，這兩個根本就不是一個東西，style是添加樣式的，script是添加js的，只能說你的想法很奇葩，那樣實現不了。js裡面可以添加css，但是反過來的我還沒見過，貌似看到過在css裡面引入js文件的，但是直接寫代碼的是沒有。

JavaScript動態建立或增加CSS樣式表，參考如下：

1、簡單的方法：

document.createStyleSheet().cssText = ‘標籤{color:red;’ +  

    // 這個注釋只在當前JS中幫助理解，並不會寫入CSS中  

    ‘width:300px;height:150px}’ +  

    ‘.類名{……}’ +  

    ‘#ID們{……}’

2、比較完美的方法，防止重複添加，通過添加樣式表ID並對其判斷來實現：

if (!document.styleSheets[‘要建立的樣式表ID如theforever’]) { //先檢查要建立的樣式表ID是否存在，防止重複添加  

 var ss = document.createStyleSheet();  

 ss.owningElement.id = ‘要建立的樣式表ID如theforever’;  

 ss.cssText = ‘標籤{display:inline-block;overflow:hidden;’ +  

  // 這個注釋只在當前JS中幫助理解，並不會寫入CSS中  

  ‘text-align:left;width:300px;height:150px}’ +  

  ‘.類名{……}’ +  

  ‘#ID們{……}’  

 ;  

}

JS文件中動態調用外部css, 文件方法如下:

function loadExtentFile(filePath, fileType){

if(fileType == “js”){

var oJs = document.create_rElement(‘script’);

oJs.setAttribute(“type”,”text/javascript”);

oJs.setAttribute(“src”, filename);//文件的地址 ,可為絕對及相對路徑

document.getElementsByTagName_r(“head”)[0].appendChild(oJs);//綁定

}else if(fileType == “css”){

var oCss = document.create_rElement(“link”);

oCss.setAttribute(“rel”, “stylesheet”);

oCss.setAttribute(“type”, “text/css”);

oCss.setAttribute(“href”, filename);

document.getElementsByTagName_r(“head”)[0].appendChild(oCss);//綁定

}

}

loadExtentFile(“js/func.js”, “js”);

loadExtentFile(“default.css”, “css”);

清空:

var lists = document.getElementsByTagName_r(“link”);

for ( var i = 0; i lists.length; i++) {

if (lists[i].getAttribute(“href”).indexOf(“.css”) != -1) == -1) {

lists[i].parentNode.removeChild(lists[i]);

}

}

上面的判斷語句中可以加入自己的判斷。