J'ai besoin de localiser un élément Je veux localiser l'élément Je pense que je le ferais en trouvant la racine J'imagine que cela pourrait ressembler à ceci: p> pour localiser le "prénom"
#root input {
some styling
}
3 Réponses :
Je ne sais pas si c'est ce que vous voulez. Ceci sélectionne la première entrée INTERNET INTERNE INTERNE #ROOT.
#root input[value="First Name"] { background: red; }
Je veux sélectionner l'entrée qui a la valeur "prénom" mais idéalement sans utiliser le [valeur = "prénom"] code> comme non tous les éléments que je dois localiser ont une certaine valeur
OK, alors mes premiers sélecteurs et @pete Selectors doivent faire le travail.
Si vos entrées sont comme dans votre exemple, vous pouvez utiliser p> Si votre HTML est un peu plus complexe, mais toutes les entrées sont toujours des frères et sœurs, vous pouvez essayer p > premier-enfant code>:
<div id="root">
<header>
<h1>Hello World</h1>
</header>
<div>
<div>
<form>
<div>some other elements</div>
<input value="First Name">
<div>some other elements</div>
<input value="Last Name">
<div>some other elements</div>
</form>
</div>
</div>
</div>
premier de type code>: p>
Puis-je dire #root entrée: deuxième type code>?
# Entrée # NTH-of-Type (2)
Si vous voulez autre chose que d'autre que le premier ou le dernier, ce serait nth code> - par exemple
nième de type (2) code> ou
nième enfant (2) Code>
Donc, lorsque vous utilisez NTH-of-Type code>, les éléments ne doivent pas nécessairement être des frères et sœurs du tout?
Oui, ils font: le pseudo-classe de type: NTH-de type () CSS correspond à des éléments d'un type donné, basé sur leur position parmi un groupe de frères et sœurs.
Donc, si les deux éléments code> code> sont tous deux enveloppés dans leurs propres éléments code> div code>, le nième de type code> n'est pas valide. Savez-vous de quoi que ce soit d'autre que je puisse utiliser à la place?
Lire ma réponse correctement - cela vous donne ce scénario et créer un exemple de reproductible minimal avec votre structure HTML actuelle afin que nous ne gaspillent pas de cinquante questions sur quelque chose que vous n'avez pas montré
Pour sélectionner l'entrée avec la valeur "Nom" Utilisez le sélecteur CSS ci-dessous.
#root input[value="Last Name"] { background: red; }
Est-ce votre mise en page HTML actuelle? Ou est-ce l'entrée dans un autre conteneur? Si le premier, vous pouvez essayer
#root entrée: premier enfant code>
La mise en page réelle provient de .jsx comme l'application a été développée dans la bibliothèque de réaction. J'ai inclus cela comme un exemple d'extrait
Vous avez ajouté [selenium] et [tests automatisés] Tags à cela, mais je ne vois aucune référence à les utiliser.