2013-01-04 33 views
5
रूप

मेरी समस्या है यह इस प्रकार है:जावास्क्रिप्ट डोम style.backgroundColor काम नहीं कर ठीक से

मैं जावास्क्रिप्ट कोड है जो एक 'नई' दस्तावेज़ document.write का उपयोग कर उत्पन्न करता है और पहली बार में मैं वेब पेज के पूरे शीर्षक लिखने का एक टुकड़ा । उस सिर में मेरे पास थोड़ा सी सीएसएस कोड है जो इस तरह दिखता है:

<style type='text/css'> 
.black {background-color: black;} 
.white {background-color: #ffffff;} 
td {width:50px; height:50px;} 
</style> 

और जावास्क्रिप्ट बॉडी सेक्शन में एक टेबल खींचता है। लेखन कोड मूल रूप से दो for लूप है जो शतरंज बोर्ड खींचता है। लेकिन इससे कोई फर्क नहीं पड़ता। प्रत्येक td तत्व कक्षा black या white प्राप्त करता है जिसके द्वारा यह ठीक से रंगीन हो जाता है। और प्रत्येक tdonclick='changeBg(this)' विशेषता प्राप्त करता है।

यहां वह समस्या है जहां समस्या जीवन में आती है। मैं उस तत्व के पृष्ठभूमि रंग तक नहीं पहुंच सकता जो क्लिक हो जाता है। फ़ंक्शन इस तरह दिखता है:

function changeBg(element) 
{ 
    alert(element.style.backgroundColor); 
    element.style.backgroundColor = "red"; 
} 

पहले मैं वर्तमान तत्व का रंग सतर्क करता हूं। यह हमेशा एक खाली अधिसूचना अलर्ट करता है। रंग को लाल रंग में बदलने के बाद और फिर तत्व पर क्लिक करने के बाद यह red अलर्ट करता है। td ब्राउज़र में रंगीन हैं और यदि मैं उन्हें फायरबग के साथ देखता हूं तो background-color: black | white है;

मुझे क्या याद आ रही है और इसे कैसे ठीक किया जाए? मुझे एहसास हुआ है कि अगर style="color: black | white" का उपयोग करते हुए उन्हें td रंग सेट किया गया है; यह काम करता है लेकिन तब मुझे नहीं पता कि वे किस वर्ग से संबंधित हैं।

उत्तर

6

आप वर्तमान में लागू शैली का उपयोग कर प्राप्त कर सकते हैं window.getComputedStyle - Docs

function changeBg(element) { 
    alert(window.getComputedStyle(element).backgroundColor); 
    element.style.backgroundColor = "red"; 
}