जावास्क्रिप्ट

के माध्यम से बॉडी टैग शैली बदलना मैं उपयोगकर्ता की क्लाइंट चौड़ाई पर विचार करते हुए पृष्ठ की चौड़ाई बदलने के लिए एक स्क्रिप्ट लिखने की कोशिश कर रहा हूं। वह कुछ इस तरह है:जावास्क्रिप्ट

function adjustWidth() { 
    width = 0; 
    if (window.innerHeight) { 
     width = window.innerWidth; 
    } else if (document.documentElement && document.documentElement.clientHeight) { 
     width = document.documentElement.clientWidth; 
    } else if (document.body) { 
     width = document.body.clientWidth; 
    } 
    if (width < 1152) { 
     document.getElementsByTagName("body").style.width="950px"; 
    } 
    if (width >= 1152) { 
     document.getElementsByTagName("body").style.width="1075px"; 
    } 
} 
window.onresize = function() { 
    adjustWidth(); 
}; 
window.onload = function() { 
    adjustWidth(); 
};

इस स्क्रिप्ट मैं Firebug से कोई त्रुटि मिलती है:

document.getElementsByTagName("body").style is undefined

अब मेरे सवाल का, मैं कैसे शरीर की शैली का उपयोग कर सकते है? क्योंकि सीएसएस शीट में इसके चयनकर्ता और चौड़ाई की संपत्ति परिभाषित की जाती है।

स्रोत

2012-07-30 Nojan

कोशिश ** 'getComputedStyle (तत्व) [शैली]' ** और उदाहरण ** 'window.getComputedStyle (document.body) .width' ** .. http://javascript.info/tutorial/styles-and-classes-getcomputedstyle – KingRider

वह फ़ंक्शन नोड्स की एक सूची देता है, भले ही केवल <body> है।

document.getElementsByTagName("body")[0].style = ...

अब, ने कहा कि, आप जावास्क्रिप्ट के बजाय सीएसएस के साथ ऐसा करने पर गौर कर सकते हैं।

@media screen and (max-width: 1151px) { 
    body { width: 950px; } 
} 
@media screen and (min-width: 1152px) { 
    body { width: 1075px; } 
}

मीडिया प्रश्नों अन्य सभी आधुनिक ब्राउज़रों IE9 में और काफी काम: CSS मीडिया क्वेरी के साथ, आप इस तरह के समायोजन करें। आईई 8 के लिए आप जावास्क्रिप्ट पर वापस आ सकते हैं या बस शरीर को व्यूपोर्ट चौड़ाई या कुछ 100% होने दें।

स्रोत

2012-07-30 12:25:33 Pointy

बहुत बहुत धन्यवाद। मीडिया प्रश्नों के साथ, क्या मुझे क्रॉसब्रोसर मुद्दों के बारे में चिंतित होना चाहिए? – Nojan

@NOjAN अच्छी तरह से IE8 और इससे पहले मीडिया प्रश्नों का समर्थन नहीं करते हैं। अन्यथा वे आईओएस और एंड्रॉइड इत्यादि पर भी बहुत अच्छी तरह से समर्थित हैं। – Pointy

की आवश्यकता नहीं है ** getElementsByTagName ** मौजूद है अन्य ब्राउज़र बग, ** 'document.body' ** – KingRider

getElementsByTagName नोड्स की एक सरणी देता है ताकि आपको तत्वों तक पहुंचने के लिए [] का उपयोग करना पड़े।

document.getElementsByTagName("body")[0].style

स्रोत

2012-07-30 12:25:44

document.getElementsByTagName("body")[0].style

स्रोत

2012-07-30 12:27:22 voodoo417

हमेशा 'document.getElementsByTagName (" body ") के बजाय' document.body' का उपयोग करें [0] ' –

मेरा मानना है कि क्या आप से document.getElementsByTagName("body")HTMLCollection है वापस पाने की कोशिश करो। आप जो चाहते हैं उसे प्राप्त करने के लिए आपको document.getElementsByTagName("body")[0].style का उपयोग करने में सक्षम होना चाहिए।

स्रोत

2012-07-30 12:31:53

document.getElementsByTagName('body')[0].style = 'your code';

उदाहरण:।

document.getElementsByTagName('body')[0].style = 'margin-top: -70px';

स्रोत

2017-09-19 04:39:16

उत्तर

संबंधित मुद्दे