Visualisation d'une page Webjax
Manipuler le modèle DOM avec JQuery
Cette page est propulsée par
Cette page Webjax vous présente les fonctionnalités JQuery qui vous permettent de traverser un document DOM .
00 :: Mettre à jour des contenus , Changing Contents:
append( content )
Permet d'ajouter du contenu à l'intérieur des éléments d'un set d'éléments.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
appendTo( content )
Permet d'attacher un set d'éléments à un autre set d'éléments. Exemple vous souhaitez copier le contenu d'un span ou de plusieurs span dans un élément
précisé par son "id".
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
prepend( content )
L'instruction permet d'ajouter du contenu au début de chaque élément matché. Cette instruction est la meilleure solution pour insérer du contenu
en début d'éléments.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
prependTo( content )
Permet d'ajouter les éléments d'un set au début d'éléments d'un autre set.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
01 :: Insérer du contenu à l'intérieur , Inserting Inside:
wrapAll( html )
Instruction permettant de regrouper une sélection d'éléments au sein d'un élement unique.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
wrapAll( elem )
Cette instruction a le même rôle que la précédente. La seule différence est que l'on passe un objet DOM créé au lieu d'une
chaîne HTML.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
wrapInner( html )
Transfert le contenu d'une liste d'éléménts matchés dans une nouvelle structure éventuellement HTML.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
wrapInner( elem )
Cette instruction est la même que la précédente à l'exception que l'on passe un élément DOM
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
03 :: Insérer du contenu à l'extérieur , Inserting Outside:
after( content )
Instruction qui permet d'ajouter du contenu derrière les éléments d'un set en sélection.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
before( content )
Instruction qui permet d'ajouter du contenu avant les éléments d'un set en sélection.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
insertAfter( content )
L'instruction permet d'insérer un set d'éléments sélectionné à la suite d'un ou d'un set d'élément(s) sélectionné(s).
La version officielle de la documentation note que vous pouvez obtenir le même résultat en utilisant la commande
"$('#myid').after('p');"
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
insertBefore( content )
Instruction qui permet d'insérer un set d'éléments avant un autre set d'éléments.
La version officielle de la documentation note que le même résultat peut être
obtenu en utilisant la commande "$('#myid').before('p');"
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
04 :: Mettre à jour des contenus , Changing Contents:
replaceWith( content )
Instruction qui permet de remplacer les éléments d'un set avec du code HTML ou des éléments précisés.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
replaceAll( selector )
Instruction qui permet de remplacer un set d'éléments par du code HTML ou un élément.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
05 :: Supprimer , Removing:
empty( )
Instruction qui permet de supprimer toutes les nodes filles d'un set d'éléments sélectionnés.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
remove( [expr] )
Cette instruction permet par exemple de supprimer totalement du DOM les éléments "p".
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
06 :: Copier , Copying:
clone( )
Instruction qui permet de cloner des éléments DOM et de les sélectionner.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
clone( true )
Instruction qui permet de réaliser un réel "clonage" d'un élément ou d'un set d'éléments DOM.
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
Cette page Webjax vous présente les fonctionnalités JQuery qui vous permettent de traverser un document DOM .
00 :: Mettre à jour des contenus , Changing Contents:
append( content )
Permet d'ajouter du contenu à l'intérieur des éléments d'un set d'éléments.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
appendTo( content )
Permet d'attacher un set d'éléments à un autre set d'éléments. Exemple vous souhaitez copier le contenu d'un span ou de plusieurs span dans un élément précisé par son "id".Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
prepend( content )
L'instruction permet d'ajouter du contenu au début de chaque élément matché. Cette instruction est la meilleure solution pour insérer du contenu en début d'éléments.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
prependTo( content )
Permet d'ajouter les éléments d'un set au début d'éléments d'un autre set.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
01 :: Insérer du contenu à l'intérieur , Inserting Inside:
wrapAll( html )
Instruction permettant de regrouper une sélection d'éléments au sein d'un élement unique.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
wrapAll( elem )
Cette instruction a le même rôle que la précédente. La seule différence est que l'on passe un objet DOM créé au lieu d'une chaîne HTML.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
wrapInner( html )
Transfert le contenu d'une liste d'éléménts matchés dans une nouvelle structure éventuellement HTML.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
wrapInner( elem )
Cette instruction est la même que la précédente à l'exception que l'on passe un élément DOMVous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
03 :: Insérer du contenu à l'extérieur , Inserting Outside:
after( content )
Instruction qui permet d'ajouter du contenu derrière les éléments d'un set en sélection.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
before( content )
Instruction qui permet d'ajouter du contenu avant les éléments d'un set en sélection.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
insertAfter( content )
L'instruction permet d'insérer un set d'éléments sélectionné à la suite d'un ou d'un set d'élément(s) sélectionné(s).La version officielle de la documentation note que vous pouvez obtenir le même résultat en utilisant la commande "$('#myid').after('p');"
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
insertBefore( content )
Instruction qui permet d'insérer un set d'éléments avant un autre set d'éléments.La version officielle de la documentation note que le même résultat peut être obtenu en utilisant la commande "$('#myid').before('p');"
Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
04 :: Mettre à jour des contenus , Changing Contents:
replaceWith( content )
Instruction qui permet de remplacer les éléments d'un set avec du code HTML ou des éléments précisés.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
replaceAll( selector )
Instruction qui permet de remplacer un set d'éléments par du code HTML ou un élément.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
05 :: Supprimer , Removing:
empty( )
Instruction qui permet de supprimer toutes les nodes filles d'un set d'éléments sélectionnés.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
remove( [expr] )
Cette instruction permet par exemple de supprimer totalement du DOM les éléments "p".Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
06 :: Copier , Copying:
clone( )
Instruction qui permet de cloner des éléments DOM et de les sélectionner.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :
clone( true )
Instruction qui permet de réaliser un réel "clonage" d'un élément ou d'un set d'éléments DOM.Vous pouvez tester l'exemple en utilisant le formulaire ci après :
Le code source de cet exemple est ci après présenté :

:

