2010-07-21 14 views
7

क्या आपका अपना HTML तत्व बनाने का कोई तरीका है? मैं एक विशेष रूप से डिज़ाइन किया गया चेक बॉक्स बनाना चाहता हूं।क्या आपका अपना HTML तत्व बनाने का कोई तरीका है?

मुझे लगता है कि ऐसी चीज जावास्क्रिप्ट में की जाएगी। document.createHTMLElement के समान कुछ लेकिन आपके स्वयं के तत्व (और टैग) को डिज़ाइन करने की क्षमता।

उत्तर

3

हां, आप अपना खुद का टैग बना सकते हैं। आपको स्कीमा बनाना होगा और इसे अपने पृष्ठ पर आयात करना होगा, और अपने नए टैग को मौजूदा HTML टैग में बदलने के लिए एक जावास्क्रिप्ट परत लिखें।

एक उदाहरण fbml (Facebook Markup Language) है, जिसमें एक स्कीमा और एक जावास्क्रिप्ट परत शामिल है जिसे फेसबुक ने लिखा था। इसे देखें: Open Graph protocol

तुम सच में आसानी से एक की तरह बटन बना सकते हैं यह का उपयोग करना:

<fb:like href="http://developers.facebook.com/" width="450" height="80"/> 
+1

वास्तव में बहुत अच्छा धन्यवाद धन्यवाद। – Alan

+6

क्या? हो सकता है कि मैंने इस सवाल को गलत समझा है, लेकिन फेसबुक मार्कअप भाषा में HTML के साथ बहुत कुछ नहीं है। इसका वेब ब्राउजर द्वारा व्याख्या नहीं किया गया है। फेसबुक इसे पढ़ता है, और इससे मानक HTML टैग आउटपुट करता है। –

+0

और स्कीमास? नहीं नहीं नहीं। अपने स्वयं के एक्सएमएल दस्तावेजों के लिए, हाँ। लेकिन वेब पर, वेब पृष्ठों के लिए जो आप इंटरनेट पर लोगों को उनके वेब ब्राउज़र में देखने के लिए सेवा करते हैं, नहीं। –

12

नहीं, ऐसा नहीं है।

HTML तत्व सीमित हैं जो ब्राउज़र को संभालेगा। ऐसा कहने के लिए, यदि आपने एक कस्टम फ़ायरफ़ॉक्स प्लगइन बनाया है, और फिर यह आपके विशेष टैग को संभाला है, तो आप इसे "कर" की विभिन्न व्याख्याओं के लिए "कर सकते हैं"। एचटीएमएल के किसी विशेष संस्करण के लिए सभी तत्वों की एक सूची यहां पाई जा सकती है:

शायद, वास्तव में, आप वास्तव में नहीं चाहते हैं। यदि आप कई मौजूदा तत्वों को एक जैसे तरीके से "गठबंधन" करना चाहते हैं, तो आप वह जावास्क्रिप्ट कर सकते हैं। उदाहरण के लिए, यदि आप क्लिक करते समय चेकबॉक्स चाहते हैं, तो कहीं भी एक ड्रॉपडाउन सूची दिखाएं, विभिन्न चीजों के साथ आबादी, आप ऐसा कर सकते हैं।

शायद आप जो वास्तव में हासिल करना चाहते हैं उस पर विस्तृत जानकारी देना चाहें, और हम आगे की मदद कर सकते हैं।

+0

मैं (दोनों के लिए कस्टम पृष्ठभूमि छवियों के साथ एक चेक बॉक्स बनाना चाहते:

एक्स टैग एक उपयोगी चीनी पुस्तकालय, मोज़िला द्वारा विकसित, तो यह और भी वेब घटकों के साथ काम करने को आसान बनाता है कि, है एक नज़र है चेक और अनचेक)। मैं उन कोडों की मात्रा को कम करना चाहता हूं जिन्हें उनमें से कई बनाते समय संभाला जाना चाहिए। – Alan

+2

आह। खैर, उस स्थिति में आप या तो सर्वर कोड-पुन: उपयोग पैटर्न (आपकी भाषा पर निर्भर करता है) या एक जावास्क्रिप्ट एक के साथ दोहराव को संभालने के लिए होते हैं। आप जो चाहते हैं वह बहुत आसानी से किया जा सकता है, लेकिन चेकबॉक्स पर ऑन चेंजेड इवेंट (या इसी तरह की घटना, मैं भूल जाता हूं कि कौन सा सबसे अच्छा है), और उसके बाद जावास्क्रिप्ट के साथ इसके कंटेनर की पृष्ठभूमि बदलें। यह कैसे करना है यह खोजना बहुत आसान होगा। फिर से पूछें कि क्या आपको उस पर विशिष्ट मदद की ज़रूरत है। –

+3

किस चंप ने इसे कम किया? यह सही जवाब है। अरे। –

2

जेक्वायरी (या डोजो, म्यूटूल, एक चुनने) में प्लगइन लिखने का सबसे आसान तरीका संभवतः होगा। jQuery के मामले में आप http://plugins.jquery.com/ पर कुछ प्लगइन्स पा सकते हैं और उन्हें नमूना के रूप में उपयोग कर सकते हैं।

1

नहीं, नहीं है। इसके अलावा एचटीएमएल 5 में इसकी अनुमति नहीं है।

Ample SDK जावास्क्रिप्ट जीयूआई लाइब्रेरी पर एक नज़र डालें जो एचटीएमएल 5 के नियमों के बिना हस्तक्षेप किए बिना किसी भी कस्टम तत्व या घटना नामस्थान क्लाइंट-साइड (इस तरह एक्सयूएल उदाहरण के लिए लागू किया गया था) को सक्षम बनाता है।

के लिए उदाहरण में एक देखो कैसे XUL पैमाने तत्व कार्यान्वित लें: http://github.com/clientside/amplesdk/blob/master/ample/languages/xul/elements/scale.js और उसके डिफ़ॉल्ट स्टाइलशीट: http://github.com/clientside/amplesdk/blob/master/ample/languages/xul/themes/default/input.css

+0

वेब घटक और उसके कस्टम तत्वों के उद्भव के उद्भव के साथ, अपने स्वयं के उपयोगकर्ता परिभाषित कस्टम तत्वों को बनाना संभव है (और भयानक): https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/ कस्टम/index.html - सभी नवीनतम ब्राउज़रों के लिए पॉलीफिल हैं, और इसे सक्रिय रूप से फ़ायरफ़ॉक्स और क्रोम में कार्यान्वित किया जा रहा है। – csuwldcat

1

यह एक वैध सवाल है, लेकिन मुझे लगता है कि यूआई की ओर से खेल के नाम प्रगतिशील मार्कअप है। मान्य w3 अनुपालन टैग बनाएं और फिर उन्हें जावास्क्रिप्ट (मेरे मामले में Jquery या Dojo) और सीएसएस के साथ उचित रूप से शैली दें। सीएसएस का एक अच्छी तरह से लिखित ब्लॉक का पुन: उपयोग किया जा सकता है (मेरा पसंदीदा मामला उनके साथ जेक्री यूआई है) और वर्ग घोषणा के लिए केवल एक या दो शब्द के अतिरिक्त पृष्ठ पर किसी भी तत्व को शैलीबद्ध करता है।http://wiki.jqueryui.com/Checkbox

:

http://www.filamentgroup.com/examples/customInput/ http://aaronweyenberg.com/90/pretty-checkboxes-with-jquery http://www.protofunc.com/scripts/jquery/checkbox-radiobutton/

यहाँ प्रपत्र तत्वों के लिए आगामी (और होनहार) jQueryUI अद्यतन के लिए कल्पना है:

यहाँ कुछ अच्छा Jquery/जावास्क्रिप्ट/सीएसएस समाधान है कि अपेक्षाकृत आसान है है

यदि आपको इनपुट सत्यापित करने की आवश्यकता है, तो यह एक वर्ग या आईडी टैग के साथ इनलाइन सत्यापन प्राप्त करने का एक आसान तरीका है: http://www.position-absolute.com/articles/jquery-form-validator-because-form-validation-is-a-mess/

ठीक है, तो मेरा समाधान 10 वर्ण, एक लाइन समाधान नहीं है। हालांकि, jQuery कोड तरफ, हर एक टैग नहीं होगा ज्यादा से ज्यादा:

<input type="checkbox" id="theid"> 

तो, जबकि वहाँ Jquery कोड का एक माध्यम हिस्सा हो सकता है, अलग-अलग तत्वों बहुत छोटा हो सकता है, जो यदि आप के लिए महत्वपूर्ण है मेरी आखिरी परियोजना के रूप में इसे 250 बार (प्रोग्रामेटिक रूप से) दोहराया जा रहा है। कोड को आसान बनाना, अच्छी तरह से गिरावट, अच्छी तरह से मान्य है, और क्योंकि उपयोगकर्ता के अंत में प्रगतिशील मार्कअप होगा, सर्वर के अंत में लगभग कोई कीमत नहीं है।

मेरा वर्तमान प्रोजेक्ट सिम्फनी में है - मेरी पसंद नहीं - जो जटिल तत्वों को प्रस्तुत करने के लिए जटिल, भारी सर्वर-साइड टैग का उपयोग करता है, सत्यापित करता है, जावास्क्रिप्ट ऑनक्लिक, स्टाइल इत्यादि करता है। ऐसा लगता है कि आप किस पर पूछ रहे थे पहले .... और मुझे आपको बताने दो, यह क्लंकी है। एक लिंक कॉल करने के लिए एक टैग कोड की 10 लाइनें लंबी हो सकती है! ऐसा करने के लिए मजबूर होने के बाद, मैं एक प्रशंसक नहीं हूं।

0

हम्म। पहला विचार यह है कि आप अपना स्वयं का तत्व बना सकते हैं और एक्सएसएलटी के साथ वैध एचटीएमएल में परिवर्तन कर सकते हैं।

0

उभरते हुए डब्ल्यू 3 वेब घटक मानक, विशेष रूप से Custom Elements spec के उद्भव के साथ, अब आप अपने स्वयं के कस्टम HTML तत्व बना सकते हैं और उन्हें document.register() DOM विधि के साथ पार्सर के साथ पंजीकृत कर सकते हैं। X-Tags.org

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