2012-04-25 147 views
7

我目前正在一個項目,需要我有計算風格發送到瀏覽器通過JSDOM。我目前正在尋找一種方法來在JSDOM中注入一些基本的CSS,以便它能夠計算出正確的內聯樣式(是的,我知道這很糟糕)。你怎麼樣式JSDOM

從我發現我可以使用JSDOM 2級,但是從那裏我無法找到如何注入樣式 任何文件,這是我迄今爲止

var document = jsdom.jsdom('<!DOCTYPE html><html><head></head><body id="abody" ></body></html>', jsdom.level(2, 'style'), { 
     features : { 
      FetchExternalResources : ['script', 'css'], 
      QuerySelector : true 
     } 
    }); 

我有一直插入到頭標籤的CSS,但無濟於事。而且我知道我也可以做上面的代碼錯誤。

任何幫助將是偉大的。

+0

你見過這個** https://github.com/yonran/jsdom/blob/style/lib/jsdom/level2/style.js** – 2012-04-25 15:15:48

+0

我已經看到它,但我無法找出一種方法調用這些函數。 – Paul 2012-04-25 15:27:31

回答

11

那麼,這是怎麼回事聽起來有點愚蠢的,但這個是我做過什麼:

var path = require('path'); 
    var fs = require('fs'); 
    var mainCss = fs.readFileSync(path.normalize(__dirname + "web_main.css"), 'utf8'); 
    var document = jsdom.jsdom('<!DOCTYPE html><html><meta http-equiv="content-type" content="text/html; charset=utf-8"><head></head><body id="abody" ></body></html>', jsdom.level(3, 'index'), { 
     features : { 
      FetchExternalResources : ['script', 'css'], 
      QuerySelector : true 
     } 
    });  
    var window = document.createWindow(); 
    var head = document.getElementsByTagName('head')[0]; 
    style = document.createElement("style"); 
    style.type = 'text/css'; 
    style.innerHTML = mainCss; 
    head.appendChild(style); 

因此,基本上所有我改變了直接運動水平,以3指標,而不是讓它在開始的HTML ,之後我添加了它。

它很簡單,我希望它可以幫助別人。