Que signifie le document propriétaire ? Comment est-il utilisé ?

Crée dynamiquement un élément DOM enveloppé par un objet jQuery basé sur une chaîne de balisage HTML brute fournie. Définissez une série de propriétés, d'événements, etc. en même temps.

Vous pouvez transmettre une chaîne HTML manuscrite, une chaîne créée par un moteur de modèle ou un plugin, ou une chaîne chargée via AJAX. Mais il y a des restrictions lorsque vous créez des éléments d'entrée, vous pouvez vous référer au deuxième exemple. Bien entendu, cette chaîne peut contenir des barres obliques (comme une adresse d'image), ainsi que des barres obliques inverses. Lorsque vous créez des éléments individuels, utilisez des balises de fermeture ou un formatage XHTML. Par exemple, pour créer une étendue, vous pouvez utiliser $("") ou $("") , mais $("") ne l'est pas. recommandé. Dans jQuery, cette syntaxe est équivalente à $(document.createElement("span")).

Dans jQuery 1.8, via $(html,props), vous pouvez utiliser la méthode ou le plugin de n'importe quel objet jQuery. Auparavant, vous ne pouviez utiliser qu'une courte liste de noms de méthodes, et il n'existait aucun moyen documenté d'en ajouter à la liste. Désormais, il n'est plus du tout nécessaire que ce soit une liste ! Cependant, veuillez noter que cela peut entraîner une modification du comportement de votre code si le plugin porte le même nom que l'attribut HTML après l'avoir ajouté.

jQuery( html [,ownerDocument] ), jQuery( html, props )

Si le paramètre de chaîne entrante ressemble à un morceau de code HTML (par exemple, la chaîne contient ), jQuery tente d'utiliser ce code HTML pour créer de nouveaux éléments DOM et créer un objet jQuery contenant des références à ces éléments DOM. Par exemple, le code suivant convertira le code HTML en un élément DOM et l'insérera à la fin du nœud body :

$(&#39;<p id="test">My <em>new</em> text</p>&#39;).appendTo(&#39;body&#39;);

Si le code HTML est une seule balise, par exemple, $(' ') ou $(''), jQuery utilisera la méthode native du navigateur document.createElement() pour créer un élément DOM. S'il s'agit d'un fragment HTML plus complexe qu'une balise distincte, telle que $('

Mynewtext

Le deuxième paramètreownerDocument est utilisé pour spécifier l'objet document pour créer un nouvel élément DOM. S'il n'est pas transmis, il est par défaut l'objet document actuel.

Si le code HTML est une balise distincte, le deuxième paramètre peut également être props, qui est un objet commun contenant des propriétés et des événements ; après avoir appelé document.createElement() pour créer un élément DOM, le paramètre props le fera. être transmis à la méthode jQuery .attr(), et .attr() est responsable de la définition des attributs et des événements dans les accessoires de paramètre sur l'élément DOM nouvellement créé.

L'attribut du paramètre props peut être n'importe quel type d'événement (tel que "clic"). À ce stade, la valeur de l'attribut doit être la fonction d'écoute d'événement, qui sera liée à l'élément DOM nouvellement créé ; le paramètre props peut contenir les attributs spéciaux suivants : val, css, html, text, data, width, height, offset, méthodes jQuery correspondantes : .val(), .css(), .html(), .text(), .data(), .width(), .height(), .offset() seront exécutés et la valeur de l'attribut sera transmise en tant que paramètre ; d'autres types d'attributs seront définis sur l'élément DOM nouvellement créé, et certains attributs spéciaux seront également compatibles entre navigateurs (tels que le type, la valeur, l'index de tabulation, etc.) ; vous pouvez définir le style de classe via le nom de l'attribut class, mais vous devez mettre la classe entre guillemets car class est un mot réservé JavaScript. . Par exemple, dans l'exemple suivant, créez un élément p, définissez le style de classe sur « test », définissez le contenu du texte sur « Cliquez sur moi ! », liez un événement de clic, puis insérez-le à la fin du nœud body When. l'élément p est cliqué test de style de classe :

$("<p/>", {  
   "class": "test",  
   text: "Click me!",  
   click: function(){  
     $(this).toggleClass("test");  
   }  
}).appendTo("body");

Exemple de code :

Créer dynamiquement un élément p (et tout son contenu) ) et ajoutez-le à l'élément body. Dans cette fonction, la conversion du balisage en élément DOM est réalisée en créant temporairement un élément et en définissant la propriété innerHTML de l'élément sur la chaîne de balisage donnée. Cette fonction présente donc à la fois de la flexibilité et des limites.

Code jQuery :

$("<p><p>Hello</p></p>").appendTo("body");

Description :

La création d'un élément Parce que Microsoft stipule que le type de l'élément ne peut être écrit qu'une seule fois.

Code jQuery :

// 在 IE 中无效: $("<input>").attr("type", "checkbox"); // 在 IE 中有效: $("<input type=&#39;checkbox&#39;>");

Description :

Crée dynamiquement un élément p (et tout son contenu) et l'ajoute à l'élément body. Dans cette fonction, la conversion du balisage en élément DOM est réalisée en créant temporairement un élément et en définissant la propriété innerHTML de l'élément sur la chaîne de balisage donnée. Cette fonction présente donc à la fois de la flexibilité et des limites.

Code jQuery :

$("<p>", {

  "class": "test",

  text: "Click me!",

  click: function(){

    $(this).toggleClass("test");

  }

}).appendTo("body");

Description :

创建一个 元素，同时设定 type 属性、属性值，以及一些事件。

jQuery 代码:

$("<input>", {

  type: "text",

  val: "Test",

  focusin: function() {

    $(this).addClass("active");

  },

  focusout: function() {

    $(this).removeClass("active");

  }

}).appendTo("form");

jQuery( html, [ownerDocument] ) 的用途是通过 html 字符串创造相应的 node 节点，jQuery 分为了两种情况，一种是 html 是由一个标签组成的 html 字符串，比如

<span>I&#39;m a SPAN</span>

这时, jQuery 会使用正则表达式匹配出这个 tag 的 tag name ,然后使用

document.createElement( tagName )

来生成这个 node ,而对于多个标签（还包括单个标签的前后有空白字符串）的情况，会这么处理：

先用 document.createDocumentFragment 创建一个 documentFragment

然后 用 document.createElement('p') ，创建一个 p

然后再 p.innerHTML = html ，创建 html 字符串对应的 node 节点

然后从 p 中得到这些节点，并返回

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!