2011-05-13 4 views
9

Je voudrais analyser la structure de certaines pages Web complexes que j'ai visitées. L'analyse manuelle des balises dans la source HTML est fastidieuse et sujette aux erreurs. Je voudrais trouver un utilitaire qui acceptera la source HTML (ou une URL) en entrée, et montrer l'arrangement hiérarchique des éléments HTML, y compris les attributs source et id, de préférence dans une arborescence. Je pensais qu'il devrait être facile de trouver un tel outil, mais quelques recherches sur Google n'ont rien trouvé pour moi. Je suis toujours confiant qu'un tel outil existe. La communauté peut-elle m'aider à trouver quelque chose? (Je suis un utilisateur de Windows et, bien sûr, préférerais gratuit si possible.)Afficher la source HTML dans l'arborescence?

+1

Vous voulez dire autre que IE Dev Tools ou Firebug? – anothershrubery

+0

utiliser fire bug, que tout ce que j'utilise – Ibu

+0

Les outils de développement de Chrome le font aussi. Faites un clic droit sur la page et sélectionnez "Inspecter l'élément" pour commencer. –

Répondre

2

IE8 + et Chrome ont tous les deux de merveilleux outils de développement intégrés. Il suffit de visiter une page Web et dans IE, appuyez sur F12, et dans Chrome, allez à wrench-> outils-> outils de développement. Ils montrent tous deux l'arborescence de la page et vous permettent de la modifier. Ils sont tous deux très puissants.

IE9 Developer Tools Chrome Developer Tools

0

Utilisez firebug ou addon DOMinspector sur firefox.

1

La plupart des navigateurs ont un visualiseur DOM intégré. Firefox a un third party extension qui fournit ceci.

Ils afficheront tous le DOM après la récupération d'erreur a été effectuée par le navigateur, avant vous ne pouvez pas être sûr qu'un arbre valide peut être être construit.

1

Vous pouvez également utiliser un bon éditeur comme Notepad ++ qui a mis en évidence la syntaxe et la réduction des nœuds.

1

Comme d'autres l'ont mentionné, la plupart des navigateurs Web modernes comportent des «outils de développement» qui incluent un moyen de parcourir la source HTML dans une arborescence. J'ai mis en place une comparaison rapide des outils que proposent les dernières versions des cinq premiers navigateurs (Internet Explorer 9, Firefox 4, Chrome 12, Opera 11 et Safari 5).

+0

+1 pour une comparaison détaillée. –