क्या मैं jQuery.css ("backgroundColor") को हेक्साडेसिमल प्रारूप पर लौटा सकता हूं?

Question

मेरे पास इस तरह का तत्व है:

<p>My text with a <strong class="highlighted">sample highlight</strong>.<p> 

और इस तरह की सीएसएस क्लास:

.highlighted { 
    background: #f0ff05; 
    font-weight: normal; 
} 

लेकिन जब मैं इस तरह एक jQuery का उपयोग करता हूं:

$(".highlighted").css("backgroundColor"); 

यह rgb(240, 255, 5) देता है। मैं rgb से हेक्स में कनवर्ट करने के लिए कुछ फ़ंक्शन लिख सकता हूं, लेकिन मैं जानना चाहता हूं कि jQuery के लिए कुछ तरीका है हेक्साडेसिमल प्रारूप पर पहले से ही मान को वापस कर देता है।

Answer 1

रंग हमेशा rgb के रूप में (IE6 जो पहले से ही हेक्स में देता छोड़कर) लौटा दिए जाते हैं, तो हम मूल रूप से किसी अन्य स्वरूप में वापस नहीं लौट सकते।

जैसा कि आपने कहा था, आप पर एक फ़ंक्शन लिख सकते हैं हेक्स को आरजीबी में कनवर्ट करें। इस फ़ंक्शन को लिखने के कई उदाहरणों के साथ यहां एक विषय दिया गया है: How to get hex color value rather than RGB value?।

लेकिन आप आश्चर्य है कि अगर वहाँ एक रास्ता सीधे पहले से ही jQuery वापस जाने के लिए हेक्स में है: जवाब है हां, इस jQuery 1.4.3 के बाद से CSS Hooks का उपयोग कर संभव है।

कोड होना चाहिए:

$.cssHooks.backgroundColor = { 
    get: function(elem) { 
     if (elem.currentStyle) 
      var bg = elem.currentStyle["backgroundColor"]; 
     else if (window.getComputedStyle) 
      var bg = document.defaultView.getComputedStyle(elem, 
       null).getPropertyValue("background-color"); 
     if (bg.search("rgb") == -1) 
      return bg; 
     else { 
      bg = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/); 
      function hex(x) { 
       return ("0" + parseInt(x).toString(16)).slice(-2); 
      } 
      return "#" + hex(bg[1]) + hex(bg[2]) + hex(bg[3]); 
     } 
    } 
} 

और जब आप $(".highlighted").css("backgroundColor") फोन, वापसी #f0ff05 हो जाएगा। यह देखने के लिए यहां एक working sample है।

Answer 2

यह एरिक पेट्रुसेलि के उत्तर का थोड़ा समायोजित संस्करण है। ऐसा लगता है कि आरजीबीए को संभाला जा रहा है।

  $.cssHooks.backgroundColor = { 
      get: function (elem) { 
       if (elem.currentStyle) 
        var bg = elem.currentStyle["backgroundColor"]; 
       else if (window.getComputedStyle) 
        var bg = document.defaultView.getComputedStyle(elem, 
         null).getPropertyValue("background-color"); 
       if (bg.search('rgba') > -1) { 
        return '#00ffffff'; 
       } else { 
        if (bg.search('rgb') == -1) { 
         return bg; 
        } else { 
         bg = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/); 
         function hex(x) { 
          return ("0" + parseInt(x).toString(16)).slice(-2); 
         } 
         return "#" + hex(bg[1]) + hex(bg[2]) + hex(bg[3]); 
        } 
       } 
      } 
     };