Maison  >  Article  >  interface Web  >  Quelles sont les différences entre les objets jquery et les objets dom ?

Quelles sont les différences entre les objets jquery et les objets dom ?

青灯夜游
青灯夜游original
2020-12-01 10:07:203412parcourir

Différence : L'objet jQuery est un objet obtenu à l'aide du sélecteur de la bibliothèque de classes jQuery. Vous pouvez utiliser les méthodes de jQuery, mais vous ne pouvez utiliser aucune méthode de l'objet DOM ; L'objet DOM est obtenu à l'aide d'objets javascript obtenus par des méthodes, les objets DOM ne peuvent pas utiliser les méthodes jQuery.

Quelles sont les différences entre les objets jquery et les objets dom ?

Recommandations associées : "Tutoriel vidéo jQuery"

Objet Dom, objet jQuery

1.1 Objet Dom

Le modèle objet de document, appelé DOM, est une interface de programmation standard recommandée par l'organisation W3C pour le traitement des langages de balisage extensibles.

    DOM est en fait un modèle de document décrit de manière orientée objet. Le DOM définit les objets requis pour représenter et modifier un document, les comportements et propriétés de ces objets, ainsi que les relations entre ces objets.
  • Grâce au DOM, vous pouvez accéder à tous les éléments HTML, ainsi qu'au texte et aux attributs qu'ils contiennent. Le contenu peut être modifié et supprimé, et de nouveaux éléments peuvent également être créés.
  • DOM est indépendant de la plate-forme et du langage de programmation. Il peut être utilisé par n'importe quel langage de programmation tel que Java, JavaScript et VBScript.
  • L'objet DOM est l'objet que nous obtenons en utilisant des méthodes traditionnelles (javascript).
  • DOM est précisément un standard de spécification pour les objets document (Document Object Model). Le standard définit uniquement les propriétés et les comportements des méthodes.

1.2 Objet jQuery

1) Présentation

L'objet jQuery est en fait un tableau JavaScript Cet objet tableau contient 125 méthodes et 4. attributs

Les 4 attributs sont :

    jquery Le numéro de version actuel du framework jquery
  • la longueur indique le nombre d'éléments de l'objet tableau.
  • context pointe généralement vers l'objet HtmlDocument
  • selector Le contenu du sélecteur transmis dans
objet jquery est l'objet généré en encapsulant l'objet DOM via jQuery. L'objet jQuery est unique à jQuery. Il peut utiliser des méthodes dans jQuery, mais ne peut pas utiliser les méthodes DOM, à l'inverse, les objets Dom ne peuvent pas utiliser les méthodes jquery ;

2) La différence entre les objets jQuery et les objets js

    Les objets jQuery appartiennent à des tableaux js
  • Les objets jQuery sont générés par des objets DOM enveloppés par jQuery
  • L'objet jQuery ne peut pas utiliser les méthodes et propriétés de l'objet DOM
  • L'objet DOM ne peut pas utiliser les méthodes et propriétés de l'objet jQuery
3) Conversion mutuelle entre jQuery objets et objets js

    js vers objet jQuery$(objet js)
  • objet jQuery vers objet js
var doc2=$("#idDoc2")[0];   //转换jQuery对象为DOM对象  
doc2.innerHTML="这是jQuery的第一个DOM对象"  
  //使用jQuery对象本身提供的get函数来返回指定集合位置的DOM对象  
var doc2=$("#idDoc2").get(0);  
doc2.innerHTML="这是jQuery的第二个DOM对象"

2. de l'objet jQuery et du DOM La différence et l'utilisation des objets

2.1 Objet jQuery et objet DOM

L'objet DOM est l'objet que nous obtenons en utilisant des méthodes traditionnelles (javascript ), jQuery L'objet est l'objet obtenu à l'aide du sélecteur de la bibliothèque de classes jQuery.

var domObj = document.getElementById("id"); //DOM对象
var $obj = $("#id"); //jQuery对象;
L'objet jQuery est un objet généré en encapsulant un objet DOM via jQuery. Il est unique à jQuery. Si un objet est un objet jQuery, vous pouvez utiliser les méthodes de jQuery.

$("#foo").html(); //获取id为foo的元素内的html代码,html()是jQuery特有的方法
est équivalent à in js :

document.getElementById("foo").innerHTML;
Remarque : Aucune méthode de l'objet DOM ne peut être utilisée dans l'objet jQuery.

Par exemple :

$("#id").innerHTML 和$("#id").checked之类的写法都是错误的
peut être utilisé

$("#id").html()和$("#id").attr ("checked")之类的 jQuery方法来代替。
De même, les objets DOM ne peuvent pas utiliser les méthodes jQuery. Lors de l'apprentissage de jQuery, vous devez établir le concept correct et distinguer la différence entre les objets jQuery et les objets DOM. Après cela, l'apprentissage de jQuery sera beaucoup plus facile.

2.2 Conversion entre objets jQuery et objets DOM

2.2.1 Conversion d'objets jquery en objets dom

jquery fournit Il existe deux méthodes pour convertir un objet jquery en objet dom, à savoir [index] et get(index).

Certaines personnes peuvent trouver étrange la raison pour laquelle les indices sont utilisés. Oui, l'objet jquery est un objet tableau.
Exemple :

var $cr=$("#cr"); //jquery对象
var cr = $cr[0]; //dom对象 也可写成 var cr=$cr.get(0);
alert(cr.checked); //检测这个checkbox是否给选中

2.2.2 Convertir un objet dom en objet jquery

Pour un objet dom, il vous suffit d'utiliser $() pour envelopper le dom object. Vous pouvez obtenir un objet jquery. La méthode

est $(dom object);
Par exemple :

var cr=document.getElementById("cr"); //dom对象
var $cr = $(cr); //转换成jquery对象
Après la conversion, vous pouvez utiliser n'importe quelle méthode dans jquery.

3. Pour résumer

Seuls les objets dom peuvent utiliser des méthodes dans dom, les objets jquery ne peuvent pas utiliser de méthodes dans dom, mais les objets jquery fournissent un ensemble plus complet d'outils de manipulation. Dom.

Les objets jquery habituellement utilisés sont tous fabriqués via la fonction $() La fonction $() est une usine de fabrication d'objets jquery.

Remarque :

Si l'objet obtenu est un objet jquery, alors ajoutez $ devant la variable, afin qu'il soit facile d'identifier quels sont les objets jquery.

Exemple :

var $variable = jquery对象;
Si l'objet DOM est obtenu, la définition est la suivante :

var variable = dom对象
Pour plus de connaissances liées à la programmation, veuillez visiter :

Vidéo de programmation ! !

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn