Puis-je ajouter des propriétés arbitraires aux objets DOM ?

Question

Puis-je ajouter des propriétés arbitraires aux objets JavaScript DOM, telles que <INPUT> o <SELECT> éléments ? Ou, si je ne peux pas le faire, existe-t-il un moyen d'associer mes propres objets à des éléments de page via une propriété de référence ?

Answer 1

Si vous devez le faire, n'utilisez pas les attributs HTML standard. Voici un tutoriel sur l'utilisation des attributs personnalisés :

http://www.javascriptkit.com/dhtmltutors/customattributes.shtml

C'est du HTML5, mais c'est rétrocompatible.

Answer 2

J'explorais les réponses, aucune n'a mentionné que dans le JavaScript moderne nous pouvons définir des attributs sur domElements en utilisant dataset il pourrait utiliser sur HTMLOrForeignElement (il s'agit d'un mixin de plusieurs fonctionnalités communes à l'interface utilisateur de l HTMLElement , SVGElement y MathMLElement interfaces) .

Según MDN

El dataset de l'interface HTMLOrForeignElement fournit un accès en lecture/écriture à tous les attributs de données personnalisés. (data-*) sur l'élément. Cet accès est disponible à la fois en HTML et dans le DOM. Il s'agit d'une carte de DOMStrings une entrée pour chaque attribut de données personnalisées.

let element = document.getElementById("test");
let footer = document.querySelector("#output");

/* get element values using camelCase names through .dataset */
let sample = element.dataset.sample;
let sampleNumber = element.dataset.sampleNumber;

let dataFromElement = sample + " :: " + sampleNumber;

footer.innerHTML = element.innerHTML  + dataFromElement;

<input type="hidden" id="test" data-sample="Sample" data-sample-number=34 />
<div id="output"> </div>

Bien qu'il y ait des inquiétudes quant à la prise en charge et aux performances d'Internet Explorer, vous pouvez consulter le site suivant aquí .