2015-03-03 18 views
5

यह सिर्फ ठीक काम करता है:डी 3 के साथ छद्म तत्वों को लक्षित करना - क्या यह संभव है?

d3.selectAll('ul li') 
    .style('background', 'red'); 

बहरहाल, यह कुछ भी नहीं करता है:

d3.selectAll('ul li:before') 
    .style('background', 'red'); 

चयन d3.selectAll('ul li:before') द्वारा लौटाए गए खाली है, भले ही :before तत्वों मौजूद हैं, और कुछ मौजूदा राशि सीएसएस स्टाइल।

क्या डी 3 के साथ छद्म तत्वों को लक्षित करना संभव है?

और यह है अगर, एक त्वरित अनुवर्ती प्रश्न: मैं कैसे लक्षित हैं सब :before छद्म तत्वों सीधे पर (यानी, के भीतर नहीं ) एक विशेष चयन?

उदाहरण के लिए:

var listItems = d3.selectAll('ul li'); 
var beforeElements = listItems.selectAll('&:before'); // SASS-style selector obviously won't work here 

उत्तर

4

यह संभव जिस तरह से आप यह करने के लिए कोशिश कर रहे हैं नहीं है।

querySelector methods, जिस पर डी 3 के चयन कार्य आधारित हैं, कभी भी छद्म-तत्व चयनकर्ताओं के लिए परिणाम न लौटाएं।

इसके अलावा, डी 3 style विधि चयनित तत्वों पर इनलाइन शैली विशेषताओं को सेट करके काम करता है। आप छद्म तत्वों के लिए इनलाइन शैलियों को सेट नहीं कर सकते हैं, इसलिए मूल तत्व पर शैली विशेषता सेट करना या तो काम नहीं करेगा।

क्या आप सकता है, माता पिता के तत्वों का चयन कर उन्हें एक वर्ग के नाम दे, और फिर CSS स्टाइलशीट नियमों का उपयोग उस वर्ग की वस्तुओं के लिए :before/:after छद्म तत्वों को लक्षित करने के कर दिया जाए। यदि आपको गतिशील रूप से सीएसएस नियम, see this Q&A बनाने की आवश्यकता होगी।

हालांकि, यह केवल <span> या <div> बच्चे तत्वों को बनाने के लिए सबसे आसान है, और इसके बजाय शैली बनाएं।

+0

धन्यवाद। मैं खाली अवधि विकल्प के साथ चला गया है। –

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