如何提取HTML代碼中的字體家族？

我目前在HTML utility上工作。我想使用Javascript提取HTML代碼中使用的字體系列。我發現了這片正則表達式，可以發現只有正常字體：如何提取HTML代碼中的字體家族？

font-family\s*?:.*?(;|(?=""|'|;))

即FONT-FAMILY：宋體，黑體，無襯線

我不能匹配，如字體家庭：

font-family: 'Lucida Sans', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;

是否有可供提取的字體/字體家族的任何方法？

來源

2013-01-25 chethan

最後我把它整理出來..

function demo(input,output) { 
var div = document.createElement("div"); 
try { 
    div.innerHTML = input; 
} catch (e) { 
    alert(e.message); 
    return; 
} 
// images 
var images = div.getElementsByTagName("IMG"); 
//console.log(images); 

// font-family 
var fontfamily = []; 
var ffstack = [div]; 
while (ffstack.length) { 
    var ff = ffstack.pop(); 
    if (ff.style && ff.style.fontFamily) { 
      fontfamily.push(ff.style.fontFamily); 
    } 
    if (ff.childNodes) { 
     for (var i = 0; i < ff.childNodes.length; i++) { 
      ffstack.push(ff.childNodes[i]); 
     } 
    } 
} 
//console.log(fontfamily); 
document.getElementById("resultBlock").style.display = "block"; 
var vArray = Duplicates(fontfamily); 
var fontss = vArray.join("\n\n"); 
output.value =fontss;

}

function Duplicates(arr) { 
var i, 
lenn = arr.length, 
    out = [], 
    obj = {}; 

for (i = 0; i < lenn; i++) { 
    obj[arr[i]] = 0; 
} 
for (i in obj) { 
    out.push(i); 
} 
return out;

}

來源

2013-01-27 22:07:13 chethan

如果您正在使用jQuery你可以：

$('#myElement').css('fontFamily');

版或WebKit的解決方案：

var el = document.querySelector('#myElement'); 
window.getComputedStyle(el).fontFamily;

如果你還打算從類似的CSS /樣式定義的文本匹配：

"font-family: Arial, 'Liberation Sans', 'DejaVu Sans', sans-serif;".match(/font-family\s*?\:(.*)(?=;)/gi)

這是一個最簡單的正則表達式，但預期會工作。

來源

2013-01-25 03:22:35

非jQuery的解決方案：

var element = document.getElementById('elementId'), 
    style = window.getComputedStyle(element), 
    top = style.getPropertyValue('font-family');

來源

2013-01-25 03:27:32 jasonmit

你能夠通過這個簡單的腳本中獲取字體系列。

alert(document.getElementById("*** id name of your field******").style.fontFamily);

來源

2013-01-25 05:53:19 Sekhar

如何提取HTML代碼中的字體家族？

回答

相關問題