В настоящее время я работаю над утилитой HTML. Я хочу извлечь семейство шрифтов, используемое в коде HTML, используя Javascript. Я нашел этот фрагмент Регулярного выражения, который может найти только нормальные шрифты:

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

Т.е. семейство шрифтов: Arial, Helvetica, без засечек

Я не могу сопоставить семейства шрифтов, такие как:

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

Существуют ли какие-либо методы для извлечения шрифтов / семейств шрифтов?

1
chethan 25 Янв 2013 в 07:19

4 ответа

Лучший ответ

Наконец-то я разобрался ...

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;

}

1
chethan 27 Янв 2013 в 22:07

Если вы используете 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)

Это самый простой RegExp, но он будет работать как положено.

3
Gabriel Gartz 25 Янв 2013 в 03:39

Вы можете просто получить семейство шрифтов с помощью этого простого скрипта.

alert(document.getElementById("*** id name of your field******").style.fontFamily);
0
Taryn 28 Май 2013 в 11:30

Решение не jQuery:

var element = document.getElementById('elementId'),
    style = window.getComputedStyle(element),
    top = style.getPropertyValue('font-family');
3
jasonmit 25 Янв 2013 в 03:27