देखने के अलावा, वहाँ किसी भी तरह से पता करने के लिए जो फॉन्ट वर्तमान में एक HTML तत्व

Question

पर विचार करें कि मैं एक लंगर टैग के लिए इस सीएसएस नियम है पर लागू किया जाता है ब्राउज़र, मैं यह तय कर सकता हूं कि वर्तमान एंकर तत्व के पाठ को प्रारूपित करने के लिए इनमें से कौन से फोंट का उपयोग पहले से ही किया जा चुका है (लागू)।

हालांकि, मुझे यह जानने की ज़रूरत है कि वर्तमान में जावास्क्रिप्ट के माध्यम से कौन सा फ़ॉन्ट उपयोग में है (उदाहरण के लिए jQuery)। क्योंकि यह रिटर्न 'Helvetica, Verdana, Calibri, Arial, sans-serif;'

$('#anchor-id').css('font-family'); 

: यह jQuery कोड मेरी मदद नहीं करता है। क्या यह जानने का कोई तरीका है कि कौन सा फ़ॉन्ट अब कार्रवाई में है?

अद्यतन: @MC उत्तर के आधार पर, मैंने यह fiddle बनाया और आप यह जांच सकते हैं कि यह केवल अच्छा और काफी काम कर रहा है।

Answer 1

सबसे पहले, आपको यह जांचने की आवश्यकता है कि कोई फ़ॉन्ट इंस्टॉल किया गया है या नहीं। मैंने इंटरनेट पर कुछ स्क्रिप्ट का उपयोग किया है जो परीक्षण करेगा कि कोई फ़ॉन्ट स्थापित है या नहीं।

var Font = { 

    isInstalled : function (name) { 
     name = name.replace(/['"<>]/g,''); 

     var body = document.body; 
     var test = document.createElement('div'); 
     var installed = false; 
     var teststring = "mmmmmmmmwwwwwwww"; 
     var template = '<b style="display:inline !important; width:auto !important; font:normal 10px/1 \'X\',sans-serif !important">' + teststring + '</b><b style="display:inline !important; width:auto !important; font:normal 10px/1 \'X\',monospace !important">' + teststring + '</b>'; 
     var ab; 

     if (name) { 
      test.innerHTML = template.replace(/X/g, name); 
      test.style.cssText = 'position: absolute; visibility: hidden; display: block !important'; 
      body.insertBefore(test, body.firstChild); 
      ab = test.getElementsByTagName('b'); 
      installed = ab[0].offsetWidth === ab[1].offsetWidth; 
      body.removeChild(test); 
     } 
     return installed; 
    } 
} 

इसके अलावा, निम्नलिखित स्निपेट का उपयोग करें (मुझे लगता है कि अपने आप को लिखा था) font-family मूल्य और विभाजन के बाद से भागों में मूल्य प्राप्त करने के लिए:

इस somewere कोड का स्निपेट (लुकास स्मिथ के लिए धन्यवाद) शामिल करें।

function workingFont(element) { 
    var fontString = $(element).css('font-family'); 
    var fonts = fontString.split(","); 
    for (var f in fonts) { 
     if (Font.isInstalled(fonts[f])) { 
      return fonts[f]; 
     } 
    } 
} 

आप देख सकते हैं, पहली बार स्थापित फ़ॉन्ट लौटा दी जाएगी: के रूप में वे सीएसएस कोड (जैसे font-family: "Nimbus", "Courier New";) में एक अल्पविराम के द्वारा अलग कर रहे हैं प्रत्येक भाग, एक फ़ॉन्ट है।

workingFont(element) का उपयोग करें, जहां तत्व तत्व आईडी, कक्षा या टैगनाम है। यह jQuery API का हिस्सा है। ध्यान दें कि उपर्युक्त स्क्रिप्ट काम करने के लिए आपको jQuery शामिल होना चाहिए।

अद्यतन: मैंने इसे जांचने के लिए यह jsfiddle बनाया है।