Comment déterminer de manière fiable si un objet JavaScript est un élément DOM ?

Comment déterminer l'état d'un objet DOM en JavaScript

En JavaScript, la distinction entre les objets DOM (Document Object Model) et les objets JavaScript classiques est cruciale pour certaines opérations. Bien que l'approche traditionnelle consistant à vérifier la propriété tagName fonctionne dans la plupart des cas, elle peut échouer dans certains navigateurs qui n'appliquent pas les propriétés en lecture seule.

Une solution complète

Pour résoudre ce problème, envisagez la fonction suivante :

<code class="javascript">function isElement(obj) {
  try {
    // W3 DOM2 (works for FF, Opera, and Chrome)
    return obj instanceof HTMLElement;
  } catch (e) {
    // Non-DOM2 browsers
    return (
      typeof obj === 'object' &&
      obj.nodeType === 1 &&
      typeof obj.style === 'object' &&
      typeof obj.ownerDocument === 'object'
    );
  }
}</code>

Ce code exploite W3 DOM2 pour les navigateurs pris en charge et vérifie les propriétés spécifiques dans les navigateurs non-DOM2.

Options supplémentaires

Une autre approche consiste à utiliser le code suivant :

<code class="javascript">function isNode(o) {
  return typeof Node === 'object'
    ? o instanceof Node
    : o &&
        typeof o === 'object' &&
        typeof o.nodeType === 'number' &&
        typeof o.nodeName === 'string';
}

function isElement(o) {
  return typeof HTMLElement === 'object'
    ? o instanceof HTMLElement
    : o &&
        typeof o === 'object' &&
        o !== null &&
        o.nodeType === 1 &&
        typeof o.nodeName === 'string';
}</code>

Ce code fait la distinction entre les nœuds et les éléments DOM, en traitant des différences potentielles dans les implémentations des navigateurs.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!