भविष्य के बनाए गए तत्वों के लिए jQuery के माध्यम से सीएसएस नियम जोड़ें

Question

मेरे पास कुछ असामान्य समस्या है। मैं इस में कई बार की तरह कुछ किया है:

$('#selector').css('color','#00f'); 

मेरे समस्या यह है कि मैं एक <div id="selector"> बनाने है, और मैं उपरोक्त आदेश फोन है और यह ठीक काम करता है।

अब, एक और घटना पर, बाद में, मैं उस तत्व को DOM से हटा देता हूं और बाद में उसी आईडी के साथ इसे फिर से जोड़ता हूं। इस तत्व में अब color:#00f नहीं है।

क्या कोई तरीका है कि मैं सीएसएस में एक नियम जोड़ सकता हूं, जिससे भविष्य में बनाई गई वस्तुओं को उसी id/class के साथ प्रभावित किया जाएगा? मुझे jQuery पसंद है, लेकिन सादे जावास्क्रिप्ट के साथ कुछ भी ठीक होगा।

इसे गतिशील होना है, और मुझे सीएसएस फ़ाइल में रखने के लिए कक्षाएं नहीं पता हैं। इसके अलावा, मैं आवेदन के दौरान कुछ अलग-अलग गुणों को बदलने के लिए योजना बना रहा हूं। उदाहरण के लिए, color से black पर blue पर red पर और black पर सेट करें।

---

मैं @lucassp से जवाब के साथ चला गया, और यह है कि क्या मैं के साथ समाप्त हो गया है:

function toggleIcon(elem, classname) 
{ 
    if($(elem).attr('src')=='img/checkbox_checked.gif') 
    { 
     $(elem).attr('src', 'img/checkbox_unchecked.gif') 
     //$('.'+classname).hide();//this was the old line that I removed 
     $('html > head').append($('<style>.'+classname+' { display:none; }</style>')); 
    } 
    else 
    { 
     $(elem).attr('src', 'img/checkbox_checked.gif') 
     //$('.'+classname).show();//this was the old line that I removed 
     $('html > head').append($('<style>.'+classname+' { display:block; }</style>')); 
    } 
} 

मैं भी कहना है कि @Nelson है चाहता हूँ शायद सबसे अधिक "सही", हालांकि इसे एप्लिकेशन कोड में जाने के लिए और अधिक काम की आवश्यकता होगी जो हमेशा ठीक काम करता है, और यह प्रयास नहीं है कि मैं इस समय खर्च करना चाहता हूं।

अगर मुझे भविष्य में इसे फिर से लिखना था (या कुछ समान लिखना), तो मैं detach() पर देखता हूं।

Answer 1

यह काम करना चाहिए:

var style = $('<style>.class { background-color: blue; }</style>'); 
$('html > head').append(style); 

Answer 2

सबसे अच्छा विकल्प एक वर्ग को जोड़ने के लिए होगा:

.selected { 
    color : #00f ; 
} 

$('#elemId').addClass('selected') 

Answer 3

जब आप उन्हें बाद में फिर से डालने के लिए डोम से तत्वों को निकालने की योजना है, तो .detach() बजाय .remove() का उपयोग करें।

.detach() का उपयोग करके बाद में पुनः डालने पर आपके सीएसएस को सुरक्षित रखेगा। प्रलेखन से:

.detach() विधि,() हटाया तत्वों के साथ जुड़े सभी jQuery डेटा रखता .remove() के रूप में ही है कि .detach को छोड़कर। यह विधि उपयोगी है जब हटाए गए तत्वों को बाद में DOM में पुन: सम्मिलित किया जाना है।

Answer 4

आप livequery plugin उपयोग कर सकते हैं।

$('#selector').livequery(function() { $(this).css('color', '#00f'); });