सीएसएस, 132 116 115 बाइट्स
a:not(:last-child):nth-child(n+2):after,a:nth-last-child(n+3):after{content:","}a+:last-child:before{content:"and "
<p>
<a>one</a>
</p>
<p>
<a>one</a>
<a>two</a>
</p>
<p>
<a>one</a>
<a>two</a>
<a>three</a>
</p>
<p>
<a>one</a>
<a>two</a>
<a>three</a>
<a>four</a>
</p>
a:not(:last-child):nth-child(n+2):after,a:nth-last-child(n+3):after{content:","}a+:last-child:before{content:"and "
सीएसएस को अक्सर गोल्फ में नहीं देखा जाता है क्योंकि यह केवल पाठ को प्रारूपित कर सकता है, लेकिन यह वास्तव में इस चुनौती के लिए काम करता है और मुझे लगा कि ऐसा करना मजेदार होगा। ऊपर स्निपेट का उपयोग करके इसे क्रिया में देखें ("कोड स्निपेट दिखाएं" पर क्लिक करें)।
सूची एक लिंक की गई HTML फ़ाइल में होनी चाहिए जो <a>
टैग से घिरे प्रत्येक तत्व के साथ हो और लाइन ब्रेक द्वारा अलग हो। सूची आइटम अपने मूल तत्व में केवल तत्व होने चाहिए, उदाहरण के लिए
<a>one</a>
<a>two</a>
<a>three</a>
व्याख्या
a:not(:last-child):nth-child(n+2)::after,
a:nth-last-child(n+3)::after {
content: ",";
}
a + :last-child::before {
content: "and ";
}
आइए ऊपर दिए गए ungolfed संस्करण पर विचार करें। यदि आप परिचित नहीं हैं कि CSS कैसे काम करता है, तो घुंघराले ब्रेस के बाहर सब कुछ एक चयनकर्ता है जो HTML तत्वों के सेट को निर्धारित करता है जिसमें ब्रेसिज़ के अंदर घोषणाएं लागू होती हैं। प्रत्येक चयनकर्ता-घोषणा जोड़ी को एक नियम कहा जाता है । (यह उससे अधिक जटिल है लेकिन इस स्पष्टीकरण के लिए पर्याप्त होगा।) किसी भी स्टाइल को लागू करने से पहले, सूची केवल रिक्त स्थान द्वारा अलग दिखाई देती है।
हम हर शब्द के बाद अल्पविराम जोड़ना चाहते हैं, सिवाय दो-शब्द सूचियों के, जिन्हें कोई अल्पविराम नहीं मिलता है। पहला चयनकर्ता, a:not(:last-child):nth-child(n+2):after
पहले और अंतिम को छोड़कर सभी तत्वों का चयन करता है। :nth-child(n+2)
कहने का एक छोटा तरीका है :not(:first-child)
, और यह मूल रूप से उन तत्वों का चयन करके काम करता है जिनके सूचकांक (1 से शुरू) 2 से अधिक या बराबर है। (हाँ, यह अभी भी मुझे थोड़ा भ्रमित करता है। एमडीएन डॉक्स मदद कर सकता है।)
अब हमें केवल अल्पविराम प्राप्त करने के लिए पहले तत्व का चयन करने की आवश्यकता है यदि कुल तीन या अधिक तत्व हैं। a:nth-last-child(n+3):after
काम करता है :nth-child
, लेकिन पीछे से गिनती करता है , इसलिए यह अंतिम दो को छोड़कर सभी तत्वों का चयन करता है। अल्पविराम दो सेटों का संघ लेता है, और हम प्रत्येक चयनित तत्व के तुरंत बाद जोड़ने के लिए :after
छद्म तत्व का उपयोग करते हैं content
।
दूसरा नियम आसान है। हमें सूची में अंतिम तत्व से पहले "और" जोड़ने की आवश्यकता है, जब तक कि यह एक एकल तत्व न हो। दूसरे शब्दों में, हमें अंतिम तत्व का चयन करने की आवश्यकता है जो किसी अन्य तत्व से पहले है। +
है आसन्न भाई चयनकर्ता सीएसएस में।