Résumer les méthodes courantes de JQuery DOM

1. Méthodes de base des objets jquery :

(1) get(); Obtenez tous les éléments correspondants
(2) get(index); get(0) est équivalent à $(this)[0]
(3) Number index(jqueryObj); Rechercher des sous-objets
(4) each(callback) Similaire à foreach, mais itère sur le element array
Par exemple :

$("img".each(function(index){
    this.src = "test" + index + ".jpg";
 });

Utilisez return false; return true; pour représenter les fonctions break et continue

(5) length, size(); des éléments

(6) jQuery.noConflict(true); Réinitialiser le symbole par défaut de jquery
tel que :

 var dom = {};
    dom.query = jQuery.noConflict(true);

Dans ce cas, dom.query sera utilisé à la place de $

2. , sélecteur JQuery

(1) De base :
* correspond à tous les éléments DOM
.classname correspond aux éléments DOM avec le nom de classe spécifié
élément (DOM nom de la balise) correspond à tous ceux portant le nom spécifié. L'élément DOM

id correspond à l'élément DOM

avec l'ID spécifié, séparé par , pour indiquer qu'il correspond à l'une des multiples conditions de sélection

(2) Niveau :
Sélectionnez-en un [Espace]Choisissez deux signifie tous les éléments de la sélection qui remplissent la condition deux
Sélectionnez-en un[>]Sélectionnez deux signifie le premier élément de la sélection qui remplit la condition deux
Sélectionnez-en un[+]Sélectionnez deux Représente l'élément suivant
qui en sélectionne un immédiatement après la condition deux. Sélectionnez un [~] Représente tous les éléments qui suivent la condition deux après en avoir sélectionné un. >

:eq(index) Position de l'index, telle que : $("div:eq(1)"
:even Élément pair
dd Élément impair
:first Le premier
: GT (Index) est supérieur à tous les éléments de l'index
: LT (Index) inférieur à tous les éléments de l'index
: en-tête H1, H2 ... Ces éléments de titre
 : Dernier dernier
 : non (non (non (non (non (non (non (non Sélecteur)) Exclut
 : contient (chaîne) Le contenu de l'objet sélectionné contient
:empty Le contenu de l'objet sélectionné est vide
:has(Selector) Contient
:parent Contrairement à vide

:first-child:last-child
:nth-child(index) Numéro
nly-child Le seul élément enfant

[att=value] Comme ci-dessus
[att*=value] Correspondance floue
[att!=value] Ne peut pas être cette valeur
[att$=value] Se termine par cette valeur
[ att^=value] Commence par cette valeur
[att1][att2][att3 ]... Correspond à l'une des multiples conditions d'attribut

attr(key , fn), attr(key, value) définit une valeur d'attribut pour tous les éléments correspondants . Le deuxième paramètre du premier est une fonction, et la valeur est la valeur de retour de cette
fonction attr(properties ) Utilisez des paires clé-valeur pour définir une ou plusieurs valeurs d'attribut pour tous. éléments correspondants, tels que : $("img".attr({ src: "test.jpg", alt: "Test Image" });
removeAttr(name) Supprime la valeur d'attribut spécifiée de l'élément correspondant
addClass(classname) Ajoutez le nom de la classe, c'est-à-dire ajoutez l'attribut de classe
removeClass(classname)
toggleClass(classname) Basculez le nom de la classe (supprimez s'il existe, s'il n'existe pas) puis augmentez)

html()
html(setvalue)
text()
text(setvalue)
val()
val(val) Pour les éléments ordinaires, utilisez La méthode devrait être un object.val (valeur définie); pour select, radio, etc., la valeur est utilisée pour indiquer l'objet pour sélectionner cette valeur, tel que :
                                                                                         ; Implémentation de l'opérateur, seules certaines méthodes de fonctionnement spéciales sont répertoriées ici .

EQ (INDEX), Filter (EXPR), Hasclass (Class), IS (EXPR), NOT (EXPR),

Filter (Fn) Elected Element Collection (Fn) pour correspondre à la fonction spécifiée renvoyée collection d'éléments (Cette fonction calculera en interne
une fois pour chaque objet (similaire à '$.each'). Si la fonction appelée renvoie false, l'élément est supprimé, sinon il sera conservé. )

slice(start, [end]) Sélectionnez un sous-ensemble correspondant

map(callback) Convertit un ensemble d'éléments en d'autres tableaux (qu'il s'agisse d'un tableau d'éléments ou non)

andSelf() Ajouter la sélection à l'ensemble d'éléments actuel
end()                                                                                                                                                                                                                          🎜>

prepend(content), prependTo( content), after(content), before(content)

replaceWith(content) Remplacer l'élément sélectionné par content
replaceAll(selector) Remplacer l'objet sélectionné par l'objet actuel

vide ()
remove([expr])
clone()
clone(true) Cloner l'événement ensemble lors du clonage


4. Traitement CSS

css(name,value) Dans tous les éléments correspondants, définissez la valeur d'une propriété de style

offset() Récupère le déplacement de l'élément sélectionné. La valeur de retour est l'objet Object{top,left}

height(), height(val), width(), width(val )


4.
Traitement des événements de l'objet JQuery

Opération globale

Événement. lorsque le DOM est prêt, pour le document L'événement peut être abrégé en $(function(){ … });

Par exemple :

$("p".bind("click", function(){
alert( $(this).text() );

function handler(event) {
alert(event.data.foo);
}
$("p".bind("click", {foo: "bar" }, handler)


(3) one(type,[data],fn) La différence ci-dessus est que cet événement ne répond qu'une seule fois
(4) trigger(type,[data]) déclenche un certain événement une fois sur chaque élément Event

(6) unbind([type] ,[data]) supprime l'événement lié
(7) hover(overFn, outFn) répond à l'événement de passage de la souris
(8) toggle(fn1,fn2…) répond aux différentes fonctions à chaque fois que la souris est cliqué

2. Événements fixes
Sans paramètres, cela signifie exécuter un événement. Avec des paramètres, cela signifie définir un événement

Les événements suivants peuvent être déclenchés et peuvent également être définis :

Les événements suivants peuvent uniquement être définis et ne peuvent pas être déclenchés par JS :

Effet

show()

toggle() Switch state

fonction de rappel

slideUp(speed,[callback]) Masque dynamiquement tous les éléments correspondants en modifiant la hauteur (en diminuant vers le haut), déclenchant éventuellement une fonction de rappel une fois le masquage terminé. slideToggle(speed,[callback]) Bascule la visibilité de tous les éléments correspondants lors des changements de hauteur et déclenche éventuellement une fonction de rappel une fois le changement terminé.

fadeIn(speed,[callback]) Implémente l'effet de fondu entrant de tous les éléments correspondants via des changements d'opacité et déclenche éventuellement une fonction de rappel une fois l'animation terminée.
fadeOut(speed,[callback]) Réalise l'effet de fondu de tous les éléments correspondants grâce à des changements d'opacité et déclenche éventuellement une fonction de rappel une fois l'animation terminée.
fadeTo(speed,opacity,[callback]) Ajuste progressivement l'opacité de tous les éléments correspondants à l'opacité spécifiée et déclenche éventuellement une fonction de rappel une fois l'animation terminée.


animate(params,options) Fonction utilisée pour créer des animations personnalisées.

params (Options) : 一组包含作为动画属性和终值的样式属性和及其值的集合
options (Options) : 一组包含动画选项的值的集合。

animate(params[,duration[,easing[,callback]]])

duration、 easing 是预设的动画动作
duration (String,Number) : (可选) 三种预定速度之一的字符串(“slow”, “normal”, or > “fast”或表示动画时长的毫秒数值(如：1000)
easing (String) : (可选) 要使用的擦除效果的名称(需要插件支持).> 默认jQuery提供”linear” 和 “swing”.
dequeue() 从动画队列中移除一个队列函数
queue() 返回指向第一个匹配元素的队列(将是一个函数数组)
queue(callback) 在匹配的元素的动画队列中添加一个函数
queue(queue) 将匹配元素的动画队列用新的一个队列来代替(函数数组)
stop()

六、AJAX

1、jQuery.ajax(options) 通过 HTTP 请求加载远程数据。

参数列表：
(1) async (Boolean) : (默认: true) 默认设置下，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为 false。
(2) beforeSend (Function) : 发送请求前可修改 XMLHttpRequest 对象的函数，如添加自定义 HTTP 头。XMLHttpRequest 是Function的唯一参数
(3) cache (Boolean) : (默认: true,dataType为script时默认为false) jQuery 1.2 新功能，设置为 false 将不会从浏览器缓存中加载请求信息。
(4) complete (Function) : 请求完成后回调函数 (请求成功或失败时均调用)。
(5) contentType (String) : (默认: “application/x-www-form-urlencoded” 发送信息至服务器时内容编码类型。
(6) data (Object,String) : 发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。查看 processData 选项说明以禁止此自动转换。必须为

Key/Value 格式。如果为数组，jQuery 将自动为不同值对应同一个名称。如 {foo:[“bar1″, “bar2″]} 转换为 ‘&foo=bar1&foo=bar2’。
(7) dataFilter (Function) :给Ajax返回的原始数据的进行预处理的函数。
(8) dataType (String) : 预期服务器返回的数据类型，”xml”、”html”、”script”、”json”、”jsonp”、”text”。
(9) error (Function) : (默认: 自动判断 (xml 或 html)) 请求失败时调用时间。
(10) global (Boolean) : (默认: true) 是否触发全局 AJAX 事件。设置为 false 将不会触发全局 AJAX 事件
(11) ifModified (Boolean) : (默认: false) 仅在服务器数据改变时获取新数据。使用 HTTP 包 Last-Modified 头信息判断。
(12) jsonp (String) : 在一个jsonp请求中重写回调函数的名字。
(13) password (String) : 用于响应HTTP访问认证请求的密码
(20) username (String) : 用于响应HTTP访问认证请求的用户名
(14) processData (Boolean) : (默认: true) 默认情况下，发送的数据将被转换为对象(技术上讲并非字符串) 以配合默认内容类型 “application/x-www-form-urlencoded”。如

果要发送 DOM 树信息或其它不希望转换的信息，请设置为 false。
(15) scriptCharset (String) : 只有当请求时dataType为”jsonp”或”script”，并且type是”GET”才会用于强制修改charset。通常在本地和远程的内容编码不同时使用。
(16) success (Function) : 请求成功后回调函数。参数：服务器返回数据，数据格式。 Ajax 事件。
(17) timeout (Number) : 设置请求超时时间（毫秒），此设置将覆盖全局设置。
(18) type (String) : (默认: “GET” 请求方式 (“POST” 或 “GET”)， 默认为 “GET”。
(19) url (String) : (默认: 当前页地址) 发送请求的地址。

参数用 : 分开，如：

$.ajax({
url: "test.html",
cache: false,
success: function(html){
    $("#results").append(html);
}
});

2、封装好的简易方法(callback是成功时执行的函数，参数是返回的数据)

jQuery.get(url,[data],[callback])
jQuery.getJSON(url,[data],[callback])
jQuery.getScript(url,[callback])       载入远程JS并执行
jQuery.post(url,[data],[callback])
load(url,[data],[callback])            把远程的HTML载入当前选中的DOM中

3、事件(事件参数为event, XMLHttpRequest, ajaxOptions, thrownError)

ajaxError(callback) Exécute la fonction lorsqu'une erreur se produit dans la requête AJAX.
ajaxSend(callback) Exécute la fonction avant l'envoi de la requête AJAX
ajaxComplete(callback) Exécute la fonction lorsque la requête AJAX est terminée
ajaxStart(callback) Exécute la fonction lorsque la requête AJAX démarre
ajaxStop(callback) Lorsque la requête AJAX se termine Exécuter la fonction
ajaxSuccess(callback) Exécuter la fonction
jQuery.ajaxSetup(options) lorsque la requête AJAX réussit et définir la valeur globale par défaut d'Ajax
serialize( ) Le contenu du formulaire de séquence est une chaîne
serializeArray() Les éléments de la table de séquence (similaires à la méthode '.serialize()') renvoient des données de structure de données JSON

7. Statique couramment utilisé méthodes

jQuery.boxModel Indique si le navigateur utilise des boîtes standard dans la page actuelle Page de rendu du modèle
jQuery.browser Identifiant du noyau du navigateur. Dépend de navigator.userAgent.
Valeur disponible : Safari Opera Msie Mozilla

jquery.Browser.Version Numéro de version du moteur de rendu du navigateur.
jQuery.each(obj,callback) est une méthode d'itération générale qui peut être utilisée pour itérer des objets et des tableaux.
jQuery.inArray(value,array) détermine la position du premier paramètre dans le tableau (renvoie -1 s'il n'est pas trouvé).
jQuery.map(array,callback) Convertit un objet de type tableau en objet tableau. La valeur de retour est data. Le rappel peut traiter l'ancien tableau individuellement.
jQuery.unique(array) Supprime les éléments en double. le tableau.

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!