NO_MODIFICATION_ALLOWED_ERR के साथ क्रोम त्रुटि DOM अपवाद 7

Question

मेरे पास डीओएम में एक शैली डालने के लिए कोड से नीचे है (डीओएम में इंजेक्शन शैली के लिए एक उपयोग केस है इसलिए कृपया पूछें कि सीएसएस को .css फ़ाइल में क्यों लोड करना है या नहीं)।

<script type="text/javascript"> 
window.onload = function() 
{ 
    var bmstyle = document.createElement('style'); 
    bmstyle.setAttribute('type', 'text/css'); 
    var styleStr = "#test-div {background:#FFF;border:2px solid #315300;"; 
    bmstyle.innerHTML = styleStr; 
    document.body.appendChild(bmstyle); 
} 

</script> 

यदि मैं फ़ायरफ़ॉक्स में चलाता हूं, तो यह ठीक काम करता है। लेकिन मुझे यह त्रुटि Google क्रोम में मिली:

Line bmstyle.innerHTML = styleStr; 
Uncaught Error: NO_MODIFICATION_ALLOWED_ERR: DOM Exception 7 

क्या किसी के पास कोई फिक्स है? धन्यवाद

Answer 1

मुझे लगता है कि ऐसा इसलिए है क्योंकि आप innerHTML का उपयोग कर रहे हैं जब हर जगह आप एक्सएमएल सिंटैक्स का उपयोग कर रहे हैं। प्रयास करें:

bmstyle.nodeValue = styleStr; 

सुझाव 2:

यह भी हो सकता है क्योंकि आप HTML डोम में एक एक तत्व के innerHTML स्थापित करने के लिए अभी तक नहीं कर रहे हैं। अगर ऐसी बात है, मेरा पहला सुझाव अभी भी धारण करना चाहिए, या आप के साथ जा सकते हैं:

document.body.appendChild(bmstyle); 
bmstyle.innerHTML = styleStr; 

मैं या यदि आप तत्व को पुनः प्राप्त करने inbetween एक लाइन आवश्यकता होगी यकीन नहीं है अगर bmstyle अभी भी बात करेंगे इसके लिए

Answer 2

यह हो सकता है क्योंकि यह शरीर के अंदर <style> तत्वों डाल करने के लिए अवैध है, लेकिन ईमानदारी से मैं

Answer 3

मुझे भी आश्चर्य होगा कि मैं इस समस्या थी, कोशिश यह एक:

bmstyle.value = styleStr; 

Answer 4

उपयोग करके देखें:

<f:view xmlns:f="http://java.sun.com/jsf/core" contentType="text/html" /> 

Answer 5

उपयोग innerText/textContent। या शैलियों के साथ एक टेक्स्ट नोड बनाएं, और इसे स्टाइल टैग में जोड़ें। ऐसा इसलिए नहीं है क्योंकि शैली शरीर में है, साथ ही आप इसे हमेशा सिर में जोड़ सकते हैं, जो समस्या का समाधान नहीं करता है।

Answer 6

भविष्य के संदर्भ के लिए बस एक नोट ... मैं सीएसएस शैलियों को गतिशील रूप से बनाने के लिए निम्न फ़ंक्शन का उपयोग कर रहा हूं। मैंने पाया कि टेक्स्टकंटेंट का उपयोग करके सबसे अच्छा काम किया।

यह सफारी

पर टूट जाता है

el.innerHTML = css.join('\n'); 

यह फ़ायर्फ़ॉक्स

el.innerText = css.join('\n'); 

पर टूट जाता है निम्नलिखित मेरा अंतिम कोड है कि दोनों ब्राउज़र पर कार्य करता है। आईई परीक्षण नहीं ...

/** 
* Write out stylesheets to the page. 
* 
* @param {array} css 
*/ 
function print_css(css) { 
    var headTag = document.getElementsByTagName('head')[0], 
     el = document.createElement('style'); 

    el.type = 'text/css'; 
    el.textContent = css.join('\n'); 
    headTag.appendChild(el); 
}