विधि width

विधि width तत्वों की चौड़ाई प्राप्त करने और बदलने की अनुमति देती है। यह याद रखना महत्वपूर्ण है कि हम चौड़ाई का 'गणना किया गया मान' प्राप्त करेंगे (computed width)। विधि css('width') के विपरीत, यह एक आयामहीन मात्रा लौटाती है (उदाहरण के लिए 400) और गणितीय गणनाओं के लिए सुविधाजनक है। विधि तत्व की सामग्री की चौड़ाई प्राप्त करती है, चाहे CSS गुण box-sizing निर्दिष्ट किया गया हो या नहीं। इससे जुड़ी असुविधाओं से बचने के लिए, css('width') का उपयोग करने की सिफारिश की जाती है। गणना में त्रुटियाँ तब भी हो सकती हैं जब उपयोगकर्ता पृष्ठ का आकार बदलता है, या यदि तत्व या उसके मूल तत्व छिपे हुए हैं। चौड़ाई का मान पैडिंग और बॉर्डर के मानों को ध्यान में नहीं रखता है।

वाक्य रचना

तत्व की चौड़ाई प्राप्त करना। कुछ मामलों में प्राप्त मान भिन्नात्मक हो सकते हैं:

$(चयनकर्ता).width();

तत्व की चौड़ाई बदलने के लिए - बस एक संख्या पास की जा सकती है (उदाहरण के लिए 400), तो माप की इकाई पिक्सेल होगी, या एक स्ट्रिंग, जिसमें माप की इकाई निर्दिष्ट हो (उदाहरण के लिए '10em'):

$(चयनकर्ता).width(नया मान);

हम सेट में प्रत्येक तत्व पर एक निर्दिष्ट फ़ंक्शन भी लागू कर सकते हैं। इस मामले में, फ़ंक्शन को पहले पैरामीटर के रूप में सेट में तत्व की अनुक्रमणिका प्राप्त होगी, और दूसरे पैरामीटर के रूप में - उस विशेष तत्व के लिए चौड़ाई का वर्तमान मान। फ़ंक्शन के अंदर this का मान वर्तमान तत्व की ओर इशारा करेगा। तत्व की चौड़ाई का मान उस मान पर बदल जाएगा, जो फ़ंक्शन द्वारा लौटाया जाता है:

$(चयनकर्ता).width(function(सेट में अनुक्रमणिका, चौड़ाई का वर्तमान मान));

उदाहरण

आइए div पर क्लिक करने पर इसकी चौड़ाई 40px के मान पर बदल दें, विधि width का उपयोग करके, और साथ ही css का उपयोग करके इसकी पृष्ठभूमि को हरे रंग में बदल दें:

<div id="test"></div>

#test {
	width: 90px; 
	height: 80px;
	background: red; 
	color: white;
	margin-top: 10px; 
	cursor: pointer;
}

$('#test').one('click', function() {
	$(this).width(40).css({
		cursor: 'auto',
		backgroundColor: 'green'
	});
});

यह भी देखें

विधि height,
जो तत्व की ऊंचाई प्राप्त करने और बदलने की अनुमति देती है
विधि innerWidth,
जो तत्व की चौड़ाई प्राप्त करने और बदलने की अनुमति देती है, इसके आंतरिक पैडिंग को ध्यान में रखते हुए
विधि outerWidth,
जो तत्व की चौड़ाई प्राप्त करने और बदलने की अनुमति देती है, इसके पैडिंग और बॉर्डर को ध्यान में रखते हुए
विधि css,
जो तत्व की CSS शैलियाँ प्राप्त करने और बदलने की अनुमति देती है