HTMLSelectElement बढ़ाएँ
Sep 02 2020
हाल ही में, मैंने शब्दार्थ और पहुंच के कारणों के लिए एक नया तत्व बनाने के बजाय एक HTMLSelectElement का विस्तार करने की कोशिश की, अर्थात:
let customSelect = function () {
customElements.define(
"custom-select",
class CustomSelect extends HTMLSelectElement {
connectedCallback() {
this.attachShadow({ mode: "open" });
this.shadowRoot.innerHTML = `
test
`;
}
},
{ extends: "select" }
);
};
export default customSelect;
इसने निम्न त्रुटि लौटा दी: custom-select.js: 6 अनकैप्ड DOMException: 'एलीमेंटशेडो' को 'एलीमेंट' पर अमल करने में विफल: यह तत्व अटैचमेंट का समर्थन नहीं करता है।
ठीक है, यह अनुमानित था।
चूंकि मैं छाया-डोम के साथ काम नहीं कर सकता, मेरा सवाल यह है कि वहाँ से सबसे अच्छा समाधान क्या है?
अब तक, मैं कल्पना कर सकता हूं:
- इस घटक के आंतरिक HTML के साथ सीधे कार्य करना।
- छाया डोम के साथ काम करने के लिए उस नए तत्व को बनाना।
- मौजूदा छाया को ओवरराइट करना? (यदि ऐसी विधि संभवतः मौजूद हो सकती है)।
तो आपके दिमाग में सबसे सरल और 'एसईओ के अनुकूल' समाधान क्या है?
nb: समाधान कस्टम-तत्व-आधारित होना चाहिए
जवाब
Supersharp Sep 03 2020 at 17:42
इस घटक के आंतरिक HTML के साथ सीधे कार्य करना।
यह "सबसे सरल और 'एसईओ के अनुकूल' समाधान है।"
छाया डोम के साथ काम करने के लिए उस नए तत्व को बनाना।
सबसे अधिक उपयोगकर्ता के अनुकूल संभावित रूप से आप एक उन्नत UI को परिभाषित कर सकते हैं।
मौजूदा छाया को ओवरराइट करना?
संभव नहीं। यह केवल पढ़ने के लिए है।
।