getElementsByClassName sur Meteor

lGatl
Javascript

Bonjour,

Es-ce que quelqu'un comprend pourquoi sur mon navigateur normal, ca fonctionne alors que par meteor pas du tout?

let pions = document.getElementsByClassName(`pion`);
console.log(pions);
console.log(pions[0]);

Reponse console Chrome sans meteor

essaie.js: 2
[div.pion, div.pion]
essaie.js:3 
<div class=​"pion">​d​</div>​

Reponse Chrome avec meteor

HTMLCollection[0]
0: div.pion
1: div.pion
length:
2__proto__: HTMLCollection
undefined               script2.js:3

Je n'ai trouvé ni doc ni tuto qui pourrait repondre à ma question...
Merci de vous etre penchés sur mon probleme.

10 réponses

Kenor

Tu es certain que ton div.pion n'est pas généré par Meteor et qu'il existe belle et bien au moment où tu lui demandes ?
Met l'exemple en ligne, mais il y a certainement quelque chose comme ça.
ça me semble impossible que Meteor impact ce genre de commande basique.

lGatl
Auteur

Merci Kenor de t'interesser à mon probleme.
En fait j'ai oublié de developper la reponse dans la console du meteor avant de vous l'afficher
si je developpe j'ai ca:

HTMLCollection[0]
0: div.pion
1: div.pion
length:
2__proto__: HTMLCollection
undefined                                           script2.js:3

Dans la variable pions il y a une HTMLCollection
si on developpe dans la console on a les deux div attendues (qui ont la classe pion) contenues dans cette collection
mais pions[0] renvoie undefined

lGatl
Auteur

Je reedite mon premier post pour etre plus clair

lGatl
Auteur

un petit up

Kenor

Théoriquement, c'est bien sensé renvoyer la même chose, donc à la limite, met le code sur un jsfiddle

Ceci étant, comme tu as un object HTMLCollection, pour avoir le même résultat pions.item(0) doit te renvoyer le même résultat que pions[0] (il s'agit d'un raccourci)

lGatl
Auteur

Merci pour ta reponse. je ne connais pas jsfiddle pions.item(0) me renvoie la meme chose....

Un ami à reussi à me repondre, meteor charge automatiquement les Js au mauvais moment par rapport au chargement du HTML.
En pure js il suffit d'utiliser un 

document.addEventListener('DOMContentLoaded', function() {     })

et de mettre mes getElements à l'interieur.
merci à toi et merci à KRiS qui trouvé la soluce
Probleme résolu

Kenor

jsfiddle permet de mettre des bouts de code en exemple, ça aurait été facile de te dire ce genre de problème avec un exemple concret.
Car là, on ne peut pas savoir comme tu intègres exactement le bout de code que tu nous donnes par exemple.

Par exemple, dans le sujet (en notif) juste avant toi, il a fournit ça http://jsfiddle.net/zetta/mofbbamo/ pour nous aider à comprendre :)

lGatl
Auteur

A ouai!! c'est pratique! mais dans mon exemple ca n'aurait pas pu fonctionner parceque il fallait le demarrer sous meteor, ... les appels de script et styles dans le html sont innexistants sous meteor, il s'en occupe tout seul... d'ou mon probleme,
parcontre j'aurais pu t'envoyer le github.
En tout cas merci pour l'info, ca me sera surement bientot trés utile.

Kenor

Je ne connais pas Meteor, mais sache qu'il y a la possibilité d'insérer des éléments externes, à gauche tu as "External ressources" (tu vois d'ailleurs dans l'exemple donné, qu'il a inclus plusieurs lib).
Enfin au plaisir, ça pourra servir pour les autres fois :)

j'ai cherché sur google "jsfiddle meteor" > http://jsfiddle.net/chicagogrooves/9y49s6so/ par exemple :)

lGatl
Auteur

Merci, je vais regarder tout ca :)