I want to know, how to send data to a custom element by jquery. it is possible?.
I have a javascript vanilla code example over here, for understanding my question :
// My custom element class
class MyCustomElementExample extends HTMLElement {
set customData(data) {
this._data = data;
this.render();
}
render() {
this.innerHTML = `<h1>${this._data.name}</h1>`;
}
}
customElements.define('my-custom-element-example', MyCustomElementExample);
// select my custom element and send data to'customData'(setter method)
document.querySelector('my-custom-element-example').customData = {
name: "DERI KURNIAWAN"
};<body>
<my-custom-element-example></my-custom-element-example>
</body>This is my specific javascript vanilla code for sending data to setter method :
document.querySelector('my-custom-element-example').customData = {name: "DERI KURNIAWAN"};
So is there a way to do that? or is there a special way? maybe if I think of the code like this:
$('my-custom-element-example').customData = {name: "DERI KURNIAWAN"};
document.querySelector('my-custom-element-example')
and
$('my-custom-element-example')
Do exactly the same: retrieve a reference to a DOM element
But the jQuery version requires loading a 50KB+ library
jQuery was great in the age when all Browsers behaved different.
.querySelector and .querySelectorAll are the JavaScript standards;
IE9 was the last browser to implement these standards... in 2011