Comment faire une recherche simple dans L'onglet inspecteur de Firefox DevTools?
j'utilise le Firefox DevTools et j'utilise l'onglet Inspector , dans lequel il affiche l'arbre HTML.
quand j'utilise la fonctionnalité Search HTML , elle ne recherche que les tags. Supposons donc que j'ai ceci:
<div class="lol">textinsidediv</div>
et quand je cherche 'div', il renvoie le <div> en conséquence. Cependant, si je cherche 'textinside' il ne correspond pas au texte content malgré le fait que ça commence là.
ma question : Comment puis-je rechercher une chaîne arbitraire dans cet arbre HTML?
(dans le contraire Firebug effectue une recherche de texte simple comme prévu.)
6 réponses
ce n'est pas une recherche de balise html vraiment inutile, elle recherche en fait les sélecteurs CSS (comme ce que vous utilisez avec CSS, querySelector en Javascript, ou jQuery selector)
donc vous pouvez rechercher #id , passer en revue tous les éléments d'une certaine classe en cherchant .class , vous pouvez même rechercher tous les éléments avec attribut y compris le texte, par exemple [class*="o"] devrait donner tous les éléments avec la lettre o dans l'attribut de classe. Ceci est utile pour ce que les concepteurs / développeurs veulent trouver - pour trouver du texte, vous pouvez Ctrl + F dans la page, puis clic droit, inspecter l'élément.
la recherche dans le panneau Inspector de Firefox DevTools permet de rechercher du contenu texte depuis Firefox 45 (voir bug 835896 ).
Btw. depuis Firebug 2.0, vous êtes également en mesure de rechercher dans le HTML panneau en utilisant les sélecteurs CSS (en plus de la recherche en texte simple).
une bonne idée est de copier HTML interne, mais encore mieux est éditer comme HTML. Qui met en place un panneau d'affichage du texte intégral, et il peut être recherché avec Ctrl + F ou cmd + F .
Ctrl + G pour trouver, Ctrl + Shift + G pour trouver les précédents.
solution de contournement: dans l'inspecteur, cliquez avec le bouton droit de la souris sur l'étiquette extérieure, puis cliquez sur "Copier HTML interne". Coller dans un traitement de texte et de recherche.
ceci est maintenant fixé à partir de FireFox 45...
https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML#Searching
voir réponse .
comme alternative à la recherche dans dev tools...
- clic droit sur la page où que ce soit
- , Sélectionnez " Afficher La Source
dans la vue source, vous pouvez facilement effectuer une recherche texte en faisant un ctrl/f ou cmd/f si sur un mac.