web-dev-qa-db-fra.com

Le sélecteur jQuery renvoie prevObject au lieu de l'élément normal

J'ai des problèmes avec la sélection des éléments, avec Jquery. Lorsque j'essaie de sélectionner un élément:

var images = $("#htmlChunk").find("img.Thumb");
console.log(images);

j'obtiens ce résultat:

>[<img>, <img>, prevObject: e.fn.e.init[1], context: #document, selector: "#htmlChunk img.Thumb"]

Quelle est la cause de ce résultat renvoyé? J'ai essayé certaines choses mais je n'obtiens toujours pas le résultat que je voulais.

j'ai essayé d'envelopper le code pour éviter les conflits. j'ai essayé d'effacer l'objet

C'est quelque chose que j'ai trouvé sur le Web. http://drupal.org/node/272557

var images = $("#htmlChunk")['prevObject'].find("img.Thumb");

je suis retourné un objet maintenant, mais ce n'est pas non plus ce que je voulais.

J'ai sauté dans ce projet donc je ne connais pas bien le script. J'ai essayé de rechercher prevObject dans les fichiers js mais je n'en ai pas trouvé.

Je pense que le problème est qu'il interfère avec un autre fichier javascript. des idées? directions?

Modifier: htmlChunk:

<div id="htmlChunk">
    <div class="ngg-albumoverview">
        <div class="ngg-album-compact">
            <div class="ngg-album-compactbox">
                <div class="ngg-album-link">
                    <a class="Link" href="http://........">
                        <img class="Thumb" alt="Personeelsevent" src="http://.........">
                    </a>
                </div>
            </div>
            <h4><a class="ngg-album-desc" title="Personeelsevent" href="http://.....">Personeelsevent</a></h4>
            <p><a href="http:///.......">bekijk dit album</a></p>
        </div>
    </div>
</div>
jqueryjquery-pluginsjquery-selectors
32
Jacob

Votre variable images est un objet jQuery, donc ce que vous voyez en sortie dans la console de votre navigateur semble être cet objet. La sortie spécifique suggère que l'appel à .find() ne correspond en fait à aucun élément; comparer les deux sorties de console de ce jsFiddle (dans Chrome).

Lorsque vous appelez une fonction jQuery - telle que .find(), .filter(), etc. - qui réduit ou modifie la liste des éléments correspondants sur un objet jQuery existant, l'objet jQuery résultant contient également une référence à l'état avant l'exécution de cette fonction, ce que vous voyez comme prevObject. C'est ce qu'il utilise pour revenir en arrière lorsque vous appelez la fonction .end() .

Décomposons votre code:

var images = $(".htmlChunk").find("img.Thumb");

La première partie - $(".htmlChunk") - correspond à tous les éléments qui ont la classe htmlChunk dessus, et retourne un objet jQuery contenant ces éléments.

Ensuite, vous appelez .find("img.Thumb") qui recherche tous les éléments qui sont des descendants des éléments déjà appariés (ceux avec la classe htmlChunk) qui satisfont aux critères d'être un élément <img> Et ayant la classe Thumb sur eux.

Vous pouvez utiliser un seul sélecteur pour récupérer les éléments, ce qui pourrait vous donner de meilleurs résultats:

var images = $(".htmlChunk img.Thumb");

Si vous voulez un tableau des éléments DOM réels, plutôt qu'un objet jQuery les contenant, vous pouvez utiliser la fonction .get() :

var elementArray = images.get();

Pour adresser la modification à la question afin d'inclure le code HTML:

Vous utilisez $(".htmlChunk") pour obtenir l'élément initial. Cependant, cet élément <div> A un [~ # ~] id [~ # ~] , pas une classe, de htmlChunk pour que le code ne sélectionne pas l'élément dont vous avez besoin. Vous voudrez utiliser ce qui suit:

var images = $("#htmlChunk").find("img.Thumb");

Notez le # Plutôt que le . Dans le sélecteur.

46
Anthony Grist

Il ressemble à votre tentative de sélection de la classe ".htmlChunk", mais n'existe pas. Essayez plutôt de sélectionner par identifiant.

var images = $("#htmlChunk").find("img.Thumb");
3
anderssonola